From c0b681ec7b98d8a39ee833814129794ae81102b4 Mon Sep 17 00:00:00 2001 From: Dongsik Yoo Date: Tue, 29 Aug 2017 20:11:26 +0900 Subject: [PATCH 01/10] chore: create bundle files for 3.0.0 --- .gitignore | 2 - dist/tui-image-editor.js | 11067 +++++++++++++++++++++++++++++++++ dist/tui-image-editor.min.js | 10 + package-lock.json | 2 +- 4 files changed, 11078 insertions(+), 3 deletions(-) create mode 100644 dist/tui-image-editor.js create mode 100644 dist/tui-image-editor.min.js diff --git a/.gitignore b/.gitignore index 16f3fd9ab..8257ad5bb 100644 --- a/.gitignore +++ b/.gitignore @@ -54,5 +54,3 @@ report *.vim test.html -# Compiled files -dist diff --git a/dist/tui-image-editor.js b/dist/tui-image-editor.js new file mode 100644 index 000000000..79d468ac1 --- /dev/null +++ b/dist/tui-image-editor.js @@ -0,0 +1,11067 @@ +/*! + * tui-image-editor.js + * @version 3.0.0 + * @author NHNEnt FE Development Lab + * @license MIT + */ +(function webpackUniversalModuleDefinition(root, factory) { + if(typeof exports === 'object' && typeof module === 'object') + module.exports = factory(require("tui-code-snippet"), require("fabric")); + else if(typeof define === 'function' && define.amd) + define(["tui-code-snippet", "fabric"], factory); + else if(typeof exports === 'object') + exports["ImageEditor"] = factory(require("tui-code-snippet"), require("fabric")); + else + root["tui"] = root["tui"] || {}, root["tui"]["ImageEditor"] = factory((root["tui"] && root["tui"]["util"]), root["fabric"]); +})(this, function(__WEBPACK_EXTERNAL_MODULE_2__, __WEBPACK_EXTERNAL_MODULE_74__) { +return /******/ (function(modules) { // webpackBootstrap +/******/ // The module cache +/******/ var installedModules = {}; + +/******/ // The require function +/******/ function __webpack_require__(moduleId) { + +/******/ // Check if module is in cache +/******/ if(installedModules[moduleId]) +/******/ return installedModules[moduleId].exports; + +/******/ // Create a new module (and put it into the cache) +/******/ var module = installedModules[moduleId] = { +/******/ exports: {}, +/******/ id: moduleId, +/******/ loaded: false +/******/ }; + +/******/ // Execute the module function +/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); + +/******/ // Flag the module as loaded +/******/ module.loaded = true; + +/******/ // Return the exports of the module +/******/ return module.exports; +/******/ } + + +/******/ // expose the modules object (__webpack_modules__) +/******/ __webpack_require__.m = modules; + +/******/ // expose the module cache +/******/ __webpack_require__.c = installedModules; + +/******/ // __webpack_public_path__ +/******/ __webpack_require__.p = "dist"; + +/******/ // Load entry module and return exports +/******/ return __webpack_require__(0); +/******/ }) +/************************************************************************/ +/******/ ([ +/* 0 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _imageEditor = __webpack_require__(1); + + var _imageEditor2 = _interopRequireDefault(_imageEditor); + + __webpack_require__(99); + + __webpack_require__(100); + + __webpack_require__(101); + + __webpack_require__(102); + + __webpack_require__(103); + + __webpack_require__(104); + + __webpack_require__(105); + + __webpack_require__(106); + + __webpack_require__(107); + + __webpack_require__(108); + + __webpack_require__(109); + + __webpack_require__(110); + + __webpack_require__(111); + + __webpack_require__(112); + + __webpack_require__(113); + + __webpack_require__(114); + + __webpack_require__(115); + + __webpack_require__(116); + + __webpack_require__(117); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + module.exports = _imageEditor2.default; + + // commands + +/***/ }), +/* 1 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); /** + * @author NHN Ent. FE Development Team + * @fileoverview Image-editor application class + */ + + + var _tuiCodeSnippet = __webpack_require__(2); + + var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + + var _invoker2 = __webpack_require__(3); + + var _invoker3 = _interopRequireDefault(_invoker2); + + var _command = __webpack_require__(68); + + var _command2 = _interopRequireDefault(_command); + + var _graphics = __webpack_require__(73); + + var _graphics2 = _interopRequireDefault(_graphics); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + var events = _consts2.default.eventNames; + var commands = _consts2.default.commandNames; + var keyCodes = _consts2.default.keyCodes, + rejectMessages = _consts2.default.rejectMessages; + var isUndefined = _tuiCodeSnippet2.default.isUndefined, + forEach = _tuiCodeSnippet2.default.forEach, + CustomEvents = _tuiCodeSnippet2.default.CustomEvents; + + /** + * Image editor + * @class + * @param {string|jQuery|HTMLElement} wrapper - Wrapper's element or selector + * @param {Object} [option] - Canvas max width & height of css + * @param {number} option.cssMaxWidth - Canvas css-max-width + * @param {number} option.cssMaxHeight - Canvas css-max-height + */ + + var ImageEditor = function () { + function ImageEditor(wrapper, option) { + _classCallCheck(this, ImageEditor); + + option = option || {}; + + /** + * Invoker + * @type {Invoker} + * @private + */ + this._invoker = new _invoker3.default(); + + /** + * Graphics instance + * @type {Graphics} + * @private + */ + this._graphics = new _graphics2.default(wrapper, option.cssMaxWidth, option.cssMaxHeight); + + /** + * Event handler list + * @type {Object} + * @private + */ + this._handlers = { + keydown: this._onKeyDown.bind(this), + mousedown: this._onMouseDown.bind(this), + objectActivated: this._onObjectActivated.bind(this), + objectMoved: this._onObjectMoved.bind(this), + objectScaled: this._onObjectScaled.bind(this), + createdPath: this._onCreatedPath, + addText: this._onAddText.bind(this), + addObject: this._onAddObject.bind(this), + textEditing: this._onTextEditing.bind(this), + textChanged: this._onTextChanged.bind(this) + }; + + this._attachInvokerEvents(); + this._attachGraphicsEvents(); + this._attachDomEvents(); + + if (option.selectionStyle) { + this._setSelectionStyle(option.selectionStyle); + } + } + + /** + * Image filter result + * @typedef {Object} FilterResult + * @property {string} type - filter type like 'mask', 'Grayscale' and so on + * @property {string} action - action type like 'add', 'remove' + */ + + /** + * Flip status + * @typedef {Object} FlipStatus + * @property {boolean} flipX - x axis + * @property {boolean} flipY - y axis + * @property {Number} angle - angle + */ + + /** + * Rotation status + * @typedef {Number} RotateStatus + * @property {Number} angle - angle + */ + + /** + * Old and new Size + * @typedef {Object} SizeChange + * @property {Number} oldWidth - old width + * @property {Number} oldHeight - old height + * @property {Number} newWidth - new width + * @property {Number} newHeight - new height + */ + + /** + * @typedef {string} ErrorMsg - {string} error message + */ + + /** + * @typedef {Object} ObjectProps - graphics object properties + * @property {number} id - object id + * @property {string} type - object type + * @property {string} text - text content + * @property {string} left - Left + * @property {string} top - Top + * @property {string} width - Width + * @property {string} height - Height + * @property {string} fill - Color + * @property {string} stroke - Stroke + * @property {string} strokeWidth - StrokeWidth + * @property {string} fontFamily - Font type for text + * @property {number} fontSize - Font Size + * @property {string} fontStyle - Type of inclination (normal / italic) + * @property {string} fontWeight - Type of thicker or thinner looking (normal / bold) + * @property {string} textAlign - Type of text align (left / center / right) + * @property {string} textDecoraiton - Type of line (underline / line-throgh / overline) + */ + + /** + * Set selection style by init option + * @param {Object} styles - Selection styles + * @private + */ + + + _createClass(ImageEditor, [{ + key: '_setSelectionStyle', + value: function _setSelectionStyle(styles) { + this._graphics.setSelectionStyle(styles); + } + + /** + * Attach invoker events + * @private + */ + + }, { + key: '_attachInvokerEvents', + value: function _attachInvokerEvents() { + var UNDO_STACK_CHANGED = events.UNDO_STACK_CHANGED, + REDO_STACK_CHANGED = events.REDO_STACK_CHANGED; + + /** + * Undo stack changed event + * @event ImageEditor#undoStackChanged + * @param {Number} length - undo stack length + * @example + * imageEditor.on('undoStackChanged', function(length) { + * console.log(length); + * }); + */ + + this._invoker.on(UNDO_STACK_CHANGED, this.fire.bind(this, UNDO_STACK_CHANGED)); + /** + * Redo stack changed event + * @event ImageEditor#redoStackChanged + * @param {Number} length - redo stack length + * @example + * imageEditor.on('redoStackChanged', function(length) { + * console.log(length); + * }); + */ + this._invoker.on(REDO_STACK_CHANGED, this.fire.bind(this, REDO_STACK_CHANGED)); + } + + /** + * Attach canvas events + * @private + */ + + }, { + key: '_attachGraphicsEvents', + value: function _attachGraphicsEvents() { + this._graphics.on({ + 'mousedown': this._handlers.mousedown, + 'objectMoved': this._handlers.objectMoved, + 'objectScaled': this._handlers.objectScaled, + 'objectActivated': this._handlers.objectActivated, + 'addText': this._handlers.addText, + 'addObject': this._handlers.addObject, + 'textEditing': this._handlers.textEditing, + 'textChanged': this._handlers.textChanged + }); + } + + /** + * Attach dom events + * @private + */ + + }, { + key: '_attachDomEvents', + value: function _attachDomEvents() { + // ImageEditor supports IE 9 higher + document.addEventListener('keydown', this._handlers.keydown); + } + + /** + * Detach dom events + * @private + */ + + }, { + key: '_detachDomEvents', + value: function _detachDomEvents() { + // ImageEditor supports IE 9 higher + document.removeEventListener('keydown', this._handlers.keydown); + } + + /** + * Keydown event handler + * @param {KeyboardEvent} e - Event object + * @private + */ + /* eslint-disable complexity */ + + }, { + key: '_onKeyDown', + value: function _onKeyDown(e) { + var activeObject = this._graphics.getActiveObject(); + var activeObjectId = this._graphics.getObjectId(activeObject); + + if ((e.ctrlKey || e.metaKey) && e.keyCode === keyCodes.Z) { + // There is no error message on shortcut when it's empty + this.undo()['catch'](function () {}); + } + + if ((e.ctrlKey || e.metaKey) && e.keyCode === keyCodes.Y) { + // There is no error message on shortcut when it's empty + this.redo()['catch'](function () {}); + } + + if ((e.keyCode === keyCodes.BACKSPACE || e.keyCode === keyCodes.DEL) && activeObject) { + e.preventDefault(); + this.removeObject(activeObjectId); + } + } + /* eslint-enable complexity */ + + /** + * mouse down event handler + * @param {Event} event mouse down event + * @param {Object} originPointer origin pointer + * @param {Number} originPointer.x x position + * @param {Number} originPointer.y y position + * @private + */ + + }, { + key: '_onMouseDown', + value: function _onMouseDown(event, originPointer) { + /** + * The mouse down event with position x, y on canvas + * @event ImageEditor#mousedown + * @param {Object} event - browser mouse event object + * @param {Object} originPointer origin pointer + * @param {Number} originPointer.x x position + * @param {Number} originPointer.y y position + * @example + * imageEditor.on('mousedown', function(event, originPointer) { + * console.log(event); + * console.log(originPointer); + * if (imageEditor.hasFilter('colorFilter')) { + * imageEditor.applyFilter('colorFilter', { + * x: parseInt(originPointer.x, 10), + * y: parseInt(originPointer.y, 10) + * }); + * } + * }); + */ + this.fire(events.MOUSE_DOWN, event, originPointer); + } + + /** + * Add a 'addObject' command + * @param {Object} obj - Fabric object + * @private + */ + + }, { + key: '_pushAddObjectCommand', + value: function _pushAddObjectCommand(obj) { + var command = _command2.default.create(commands.ADD_OBJECT, this._graphics, obj); + this._invoker.pushUndoStack(command); + } + + /** + * 'objectActivated' event handler + * @param {ObjectProps} props - object properties + * @private + */ + + }, { + key: '_onObjectActivated', + value: function _onObjectActivated(props) { + /** + * The event when object is selected(aka activated). + * @event ImageEditor#objectActivated + * @param {ObjectProps} objectProps - object properties + * @example + * imageEditor.on('objectActivated', function(props) { + * console.log(props); + * console.log(props.type); + * console.log(props.id); + * }); + */ + this.fire(events.OBJECT_ACTIVATED, props); + } + + /** + * 'objectMoved' event handler + * @param {ObjectProps} props - object properties + * @private + */ + + }, { + key: '_onObjectMoved', + value: function _onObjectMoved(props) { + /** + * The event when object is moved + * @event ImageEditor#objectMoved + * @param {ObjectProps} props - object properties + * @example + * imageEditor.on('objectMoved', function(props) { + * console.log(props); + * console.log(props.type); + * }); + */ + this.fire(events.OBJECT_MOVED, props); + } + + /** + * 'objectScaled' event handler + * @param {ObjectProps} props - object properties + * @private + */ + + }, { + key: '_onObjectScaled', + value: function _onObjectScaled(props) { + /** + * The event when scale factor is changed + * @event ImageEditor#objectScaled + * @param {ObjectProps} props - object properties + * @example + * imageEditor.on('objectScaled', function(props) { + * console.log(props); + * console.log(props.type); + * }); + */ + this.fire(events.OBJECT_SCALED, props); + } + + /** + * Get current drawing mode + * @returns {string} + * @example + * // Image editor drawing mode + * // + * // NORMAL: 'NORMAL' + * // CROPPER: 'CROPPER' + * // FREE_DRAWING: 'FREE_DRAWING' + * // LINE_DRAWING: 'LINE_DRAWING' + * // TEXT: 'TEXT' + * // + * if (imageEditor.getDrawingMode() === 'FREE_DRAWING') { + * imageEditor.stopDrawingMode(); + * } + */ + + }, { + key: 'getDrawingMode', + value: function getDrawingMode() { + return this._graphics.getDrawingMode(); + } + + /** + * Clear all objects + * @returns {Promise} + * @example + * imageEditor.clearObjects(); + */ + + }, { + key: 'clearObjects', + value: function clearObjects() { + return this.execute(commands.CLEAR_OBJECTS); + } + + /** + * Deactivate all objects + * @example + * imageEditor.deactivateAll(); + */ + + }, { + key: 'deactivateAll', + value: function deactivateAll() { + this._graphics.deactivateAll(); + this._graphics.renderAll(); + } + + /** + * Invoke command + * @param {String} commandName - Command name + * @param {...*} args - Arguments for creating command + * @returns {Promise} + * @private + */ + + }, { + key: 'execute', + value: function execute(commandName) { + var _invoker; + + for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { + args[_key - 1] = arguments[_key]; + } + + // Inject an Graphics instance as first parameter + var theArgs = [this._graphics].concat(args); + + return (_invoker = this._invoker).execute.apply(_invoker, [commandName].concat(theArgs)); + } + + /** + * Undo + * @returns {Promise} + * @example + * imageEditor.undo(); + */ + + }, { + key: 'undo', + value: function undo() { + return this._invoker.undo(); + } + + /** + * Redo + * @returns {Promise} + * @example + * imageEditor.redo(); + */ + + }, { + key: 'redo', + value: function redo() { + return this._invoker.redo(); + } + + /** + * Load image from file + * @param {File} imgFile - Image file + * @param {string} [imageName] - imageName + * @returns {Promise} + * @example + * imageEditor.loadImageFromFile(file).then(result => { + * console.log('old : ' + result.oldWidth + ', ' + result.oldHeight); + * console.log('new : ' + result.newWidth + ', ' + result.newHeight); + * }); + */ + + }, { + key: 'loadImageFromFile', + value: function loadImageFromFile(imgFile, imageName) { + if (!imgFile) { + return Promise.reject(rejectMessages.invalidParameters); + } + + var imgUrl = URL.createObjectURL(imgFile); + imageName = imageName || imgFile.name; + + return this.loadImageFromURL(imgUrl, imageName).then(function (value) { + URL.revokeObjectURL(imgFile); + + return value; + }); + } + + /** + * Load image from url + * @param {string} url - File url + * @param {string} imageName - imageName + * @returns {Promise} + * @example + * imageEditor.loadImageFromURL('http://url/testImage.png', 'lena').then(result => { + * console.log('old : ' + result.oldWidth + ', ' + result.oldHeight); + * console.log('new : ' + result.newWidth + ', ' + result.newHeight); + * }); + */ + + }, { + key: 'loadImageFromURL', + value: function loadImageFromURL(url, imageName) { + if (!imageName || !url) { + return Promise.reject(rejectMessages.invalidParameters); + } + + return this.execute(commands.LOAD_IMAGE, imageName, url); + } + + /** + * Add image object on canvas + * @param {string} imgUrl - Image url to make object + * @returns {Promise} + * @example + * imageEditor.addImageObject('path/fileName.jpg').then(objectProps => { + * console.log(ojectProps.id); + * }); + */ + + }, { + key: 'addImageObject', + value: function addImageObject(imgUrl) { + if (!imgUrl) { + return Promise.reject(rejectMessages.invalidParameters); + } + + return this.execute(commands.ADD_IMAGE_OBJECT, imgUrl); + } + + /** + * Start a drawing mode. If the current mode is not 'NORMAL', 'stopDrawingMode()' will be called first. + * @param {String} mode Can be one of 'CROPPER', 'FREE_DRAWING', 'LINE_DRAWING', 'TEXT', 'SHAPE' + * @param {Object} [option] parameters of drawing mode, it's available with 'FREE_DRAWING', 'LINE_DRAWING' + * @param {Number} [option.width] brush width + * @param {String} [option.color] brush color + * @returns {boolean} true if success or false + * @example + * imageEditor.startDrawingMode('FREE_DRAWING', { + * width: 10, + * color: 'rgba(255,0,0,0.5)' + * }); + */ + + }, { + key: 'startDrawingMode', + value: function startDrawingMode(mode, option) { + return this._graphics.startDrawingMode(mode, option); + } + + /** + * Stop the current drawing mode and back to the 'NORMAL' mode + * @example + * imageEditor.stopDrawingMode(); + */ + + }, { + key: 'stopDrawingMode', + value: function stopDrawingMode() { + this._graphics.stopDrawingMode(); + } + + /** + * Crop this image with rect + * @param {Object} rect crop rect + * @param {Number} rect.left left position + * @param {Number} rect.top top position + * @param {Number} rect.width width + * @param {Number} rect.height height + * @returns {Promise} + * @example + * imageEditor.crop(imageEditor.getCropzoneRect()); + */ + + }, { + key: 'crop', + value: function crop(rect) { + var data = this._graphics.getCroppedImageData(rect); + if (!data) { + return Promise.reject(rejectMessages.invalidParameters); + } + + return this.loadImageFromURL(data.url, data.imageName); + } + + /** + * Get the cropping rect + * @returns {Object} {{left: number, top: number, width: number, height: number}} rect + */ + + }, { + key: 'getCropzoneRect', + value: function getCropzoneRect() { + return this._graphics.getCropzoneRect(); + } + + /** + * Flip + * @returns {Promise} + * @param {string} type - 'flipX' or 'flipY' or 'reset' + * @returns {Promise} + * @private + */ + + }, { + key: '_flip', + value: function _flip(type) { + return this.execute(commands.FLIP_IMAGE, type); + } + + /** + * Flip x + * @returns {Promise} + * @example + * imageEditor.flipX().then((status => { + * console.log('flipX: ', status.flipX); + * console.log('flipY: ', status.flipY); + * console.log('angle: ', status.angle); + * }).catch(message => { + * console.log('error: ', message); + * }); + */ + + }, { + key: 'flipX', + value: function flipX() { + return this._flip('flipX'); + } + + /** + * Flip y + * @returns {Promise} + * @example + * imageEditor.flipY().then(status => { + * console.log('flipX: ', status.flipX); + * console.log('flipY: ', status.flipY); + * console.log('angle: ', status.angle); + * }).catch(message => { + * console.log('error: ', message); + * }); + */ + + }, { + key: 'flipY', + value: function flipY() { + return this._flip('flipY'); + } + + /** + * Reset flip + * @returns {Promise} + * @example + * imageEditor.resetFlip().then(status => { + * console.log('flipX: ', status.flipX); + * console.log('flipY: ', status.flipY); + * console.log('angle: ', status.angle); + * }).catch(message => { + * console.log('error: ', message); + * });; + */ + + }, { + key: 'resetFlip', + value: function resetFlip() { + return this._flip('reset'); + } + + /** + * @param {string} type - 'rotate' or 'setAngle' + * @param {number} angle - angle value (degree) + * @returns {Promise} + * @private + */ + + }, { + key: '_rotate', + value: function _rotate(type, angle) { + return this.execute(commands.ROTATE_IMAGE, type, angle); + } + + /** + * Rotate image + * @returns {Promise} + * @param {number} angle - Additional angle to rotate image + * @returns {Promise} + * @example + * imageEditor.setAngle(10); // angle = 10 + * imageEditor.rotate(10); // angle = 20 + * imageEidtor.setAngle(5); // angle = 5 + * imageEidtor.rotate(-95); // angle = -90 + * imageEditor.rotate(10).then(status => { + * console.log('angle: ', status.angle); + * })).catch(message => { + * console.log('error: ', message); + * }); + */ + + }, { + key: 'rotate', + value: function rotate(angle) { + return this._rotate('rotate', angle); + } + + /** + * Set angle + * @param {number} angle - Angle of image + * @returns {Promise} + * @example + * imageEditor.setAngle(10); // angle = 10 + * imageEditor.rotate(10); // angle = 20 + * imageEidtor.setAngle(5); // angle = 5 + * imageEidtor.rotate(50); // angle = 55 + * imageEidtor.setAngle(-40); // angle = -40 + * imageEditor.setAngle(10).then(status => { + * console.log('angle: ', status.angle); + * })).catch(message => { + * console.log('error: ', message); + * }); + */ + + }, { + key: 'setAngle', + value: function setAngle(angle) { + return this._rotate('setAngle', angle); + } + + /** + * Set drawing brush + * @param {Object} option brush option + * @param {Number} option.width width + * @param {String} option.color color like 'FFFFFF', 'rgba(0, 0, 0, 0.5)' + * @example + * imageEditor.startDrawingMode('FREE_DRAWING'); + * imageEditor.setBrush({ + * width: 12, + * color: 'rgba(0, 0, 0, 0.5)' + * }); + * imageEditor.setBrush({ + * width: 8, + * color: 'FFFFFF' + * }); + */ + + }, { + key: 'setBrush', + value: function setBrush(option) { + this._graphics.setBrush(option); + } + + /** + * Set states of current drawing shape + * @param {string} type - Shape type (ex: 'rect', 'circle', 'triangle') + * @param {Object} [options] - Shape options + * @param {string} [options.fill] - Shape foreground color (ex: '#fff', 'transparent') + * @param {string} [options.stoke] - Shape outline color + * @param {number} [options.strokeWidth] - Shape outline width + * @param {number} [options.width] - Width value (When type option is 'rect', this options can use) + * @param {number} [options.height] - Height value (When type option is 'rect', this options can use) + * @param {number} [options.rx] - Radius x value (When type option is 'circle', this options can use) + * @param {number} [options.ry] - Radius y value (When type option is 'circle', this options can use) + * @param {number} [options.isRegular] - Whether resizing shape has 1:1 ratio or not + * @example + * imageEditor.setDrawingShape('rect', { + * fill: 'red', + * width: 100, + * height: 200 + * }); + * @example + * imageEditor.setDrawingShape('circle', { + * fill: 'transparent', + * stroke: 'blue', + * strokeWidth: 3, + * rx: 10, + * ry: 100 + * }); + * @example + * imageEditor.setDrawingShape('triangle', { // When resizing, the shape keep the 1:1 ratio + * width: 1, + * height: 1, + * isRegular: true + * }); + * @example + * imageEditor.setDrawingShape('circle', { // When resizing, the shape keep the 1:1 ratio + * rx: 10, + * ry: 10, + * isRegular: true + * }); + */ + + }, { + key: 'setDrawingShape', + value: function setDrawingShape(type, options) { + this._graphics.setDrawingShape(type, options); + } + + /** + * Add shape + * @param {string} type - Shape type (ex: 'rect', 'circle', 'triangle') + * @param {Object} options - Shape options + * @param {string} [options.fill] - Shape foreground color (ex: '#fff', 'transparent') + * @param {string} [options.stroke] - Shape outline color + * @param {number} [options.strokeWidth] - Shape outline width + * @param {number} [options.width] - Width value (When type option is 'rect', this options can use) + * @param {number} [options.height] - Height value (When type option is 'rect', this options can use) + * @param {number} [options.rx] - Radius x value (When type option is 'circle', this options can use) + * @param {number} [options.ry] - Radius y value (When type option is 'circle', this options can use) + * @param {number} [options.left] - Shape x position + * @param {number} [options.top] - Shape y position + * @param {number} [options.isRegular] - Whether resizing shape has 1:1 ratio or not + * @returns {Promise} + * @example + * imageEditor.addShape('rect', { + * fill: 'red', + * stroke: 'blue', + * strokeWidth: 3, + * width: 100, + * height: 200, + * left: 10, + * top: 10, + * isRegular: true + * }); + * @example + * imageEditor.addShape('circle', { + * fill: 'red', + * stroke: 'blue', + * strokeWidth: 3, + * rx: 10, + * ry: 100, + * isRegular: false + * }).then(objectProps => { + * console.log(objectProps.id); + * }); + */ + + }, { + key: 'addShape', + value: function addShape(type, options) { + options = options || {}; + + this._setPositions(options); + + return this.execute(commands.ADD_SHAPE, type, options); + } + + /** + * Change shape + * @param {number} id - object id + * @param {Object} options - Shape options + * @param {string} [options.fill] - Shape foreground color (ex: '#fff', 'transparent') + * @param {string} [options.stroke] - Shape outline color + * @param {number} [options.strokeWidth] - Shape outline width + * @param {number} [options.width] - Width value (When type option is 'rect', this options can use) + * @param {number} [options.height] - Height value (When type option is 'rect', this options can use) + * @param {number} [options.rx] - Radius x value (When type option is 'circle', this options can use) + * @param {number} [options.ry] - Radius y value (When type option is 'circle', this options can use) + * @param {number} [options.isRegular] - Whether resizing shape has 1:1 ratio or not + * @returns {Promise} + * @example + * // call after selecting shape object on canvas + * imageEditor.changeShape(id, { // change rectagle or triangle + * fill: 'red', + * stroke: 'blue', + * strokeWidth: 3, + * width: 100, + * height: 200 + * }); + * @example + * // call after selecting shape object on canvas + * imageEditor.changeShape(id, { // change circle + * fill: 'red', + * stroke: 'blue', + * strokeWidth: 3, + * rx: 10, + * ry: 100 + * }); + */ + + }, { + key: 'changeShape', + value: function changeShape(id, options) { + return this.execute(commands.CHANGE_SHAPE, id, options); + } + + /** + * Add text on image + * @param {string} text - Initial input text + * @param {Object} [options] Options for generating text + * @param {Object} [options.styles] Initial styles + * @param {string} [options.styles.fill] Color + * @param {string} [options.styles.fontFamily] Font type for text + * @param {number} [options.styles.fontSize] Size + * @param {string} [options.styles.fontStyle] Type of inclination (normal / italic) + * @param {string} [options.styles.fontWeight] Type of thicker or thinner looking (normal / bold) + * @param {string} [options.styles.textAlign] Type of text align (left / center / right) + * @param {string} [options.styles.textDecoraiton] Type of line (underline / line-throgh / overline) + * @param {{x: number, y: number}} [options.position] - Initial position + * @returns {Promise} + * @example + * imageEditor.addText('init text'); + * @example + * imageEditor.addText('init text', { + * styles: { + * fill: '#000', + * fontSize: '20', + * fontWeight: 'bold' + * }, + * position: { + * x: 10, + * y: 10 + * } + * }).then(objectProps => { + * console.log(objectProps.id); + * }); + */ + + }, { + key: 'addText', + value: function addText(text, options) { + text = text || ''; + options = options || {}; + + return this.execute(commands.ADD_TEXT, text, options); + } + + /** + * Change contents of selected text object on image + * @param {number} id - object id + * @param {string} text - Changing text + * @returns {Promise} + * @example + * imageEditor.changeText(id, 'change text'); + */ + + }, { + key: 'changeText', + value: function changeText(id, text) { + text = text || ''; + + return this.execute(commands.CHANGE_TEXT, id, text); + } + + /** + * Set style + * @param {number} id - object id + * @param {Object} styleObj - text styles + * @param {string} [styleObj.fill] Color + * @param {string} [styleObj.fontFamily] Font type for text + * @param {number} [styleObj.fontSize] Size + * @param {string} [styleObj.fontStyle] Type of inclination (normal / italic) + * @param {string} [styleObj.fontWeight] Type of thicker or thinner looking (normal / bold) + * @param {string} [styleObj.textAlign] Type of text align (left / center / right) + * @param {string} [styleObj.textDecoraiton] Type of line (underline / line-throgh / overline) + * @returns {Promise} + * @example + * imageEditor.changeTextStyle(id, { + * fontStyle: 'italic' + * }); + */ + + }, { + key: 'changeTextStyle', + value: function changeTextStyle(id, styleObj) { + return this.execute(commands.CHANGE_TEXT_STYLE, id, styleObj); + } + + /** + * 'textChanged' event handler + * @param {Object} objectProps changed object properties + * @private + */ + + }, { + key: '_onTextChanged', + value: function _onTextChanged(objectProps) { + this.changeText(objectProps.id, objectProps.text); + } + + /** + * 'textEditing' event handler + * @private + */ + + }, { + key: '_onTextEditing', + value: function _onTextEditing() { + /** + * The event which starts to edit text object + * @event ImageEditor#textEditing + * @example + * imageEditor.on('textEditing', function() { + * console.log('text editing'); + * }); + */ + this.fire(events.TEXT_EDITING); + } + + /** + * Mousedown event handler in case of 'TEXT' drawing mode + * @param {fabric.Event} event - Current mousedown event object + * @private + */ + + }, { + key: '_onAddText', + value: function _onAddText(event) { + /** + * The event when 'TEXT' drawing mode is enabled and click non-object area. + * @event ImageEditor#addText + * @param {Object} pos + * @param {Object} pos.originPosition - Current position on origin canvas + * @param {Number} pos.originPosition.x - x + * @param {Number} pos.originPosition.y - y + * @param {Object} pos.clientPosition - Current position on client area + * @param {Number} pos.clientPosition.x - x + * @param {Number} pos.clientPosition.y - y + * @example + * imageEditor.on('addText', function(pos) { + * imageEditor.addText('Double Click', { + * position: pos.originPosition + * }); + * console.log('text position on canvas: ' + pos.originPosition); + * console.log('text position on brwoser: ' + pos.clientPosition); + * }); + */ + this.fire(events.ADD_TEXT, { + originPosition: event.originPosition, + clientPosition: event.clientPosition + }); + } + + /** + * 'addObject' event handler + * @param {Object} objectProps added object properties + * @private + */ + + }, { + key: '_onAddObject', + value: function _onAddObject(objectProps) { + var obj = this._graphics.getObject(objectProps.id); + this._pushAddObjectCommand(obj); + } + + /** + * Register custom icons + * @param {{iconType: string, pathValue: string}} infos - Infos to register icons + * @example + * imageEditor.registerIcons({ + * customIcon: 'M 0 0 L 20 20 L 10 10 Z', + * customArrow: 'M 60 0 L 120 60 H 90 L 75 45 V 180 H 45 V 45 L 30 60 H 0 Z' + * }); + */ + + }, { + key: 'registerIcons', + value: function registerIcons(infos) { + this._graphics.registerPaths(infos); + } + + /** + * Add icon on canvas + * @param {string} type - Icon type ('arrow', 'cancel', custom icon name) + * @param {Object} options - Icon options + * @param {string} [options.fill] - Icon foreground color + * @param {string} [options.left] - Icon x position + * @param {string} [options.top] - Icon y position + * @returns {Promise} + * @example + * imageEditor.addIcon('arrow'); // The position is center on canvas + * @example + * imageEditor.addIcon('arrow', { + * left: 100, + * top: 100 + * }).then(objectProps => { + * console.log(objectProps.id); + * }); + */ + + }, { + key: 'addIcon', + value: function addIcon(type, options) { + options = options || {}; + + this._setPositions(options); + + return this.execute(commands.ADD_ICON, type, options); + } + + /** + * Change icon color + * @param {number} id - object id + * @param {string} color - Color for icon + * @returns {Promise} + * @example + * imageEditor.changeIconColor(id, '#000000'); + */ + + }, { + key: 'changeIconColor', + value: function changeIconColor(id, color) { + return this.execute(commands.CHANGE_ICON_COLOR, id, color); + } + + /** + * Remove an object or group by id + * @param {number} id - object id + * @returns {Promise} + * @example + * imageEditor.removeObject(id); + */ + + }, { + key: 'removeObject', + value: function removeObject(id) { + return this.execute(commands.REMOVE_OBJECT, id); + } + + /** + * Whether it has the filter or not + * @param {string} type - Filter type + * @returns {boolean} true if it has the filter + */ + + }, { + key: 'hasFilter', + value: function hasFilter(type) { + return this._graphics.hasFilter(type); + } + + /** + * Remove filter on canvas image + * @param {string} type - Filter type + * @returns {Promise} + * @example + * imageEditor.removeFilter('Grayscale').then(obj => { + * console.log('filterType: ', obj.type); + * console.log('actType: ', obj.action); + * }).catch(message => { + * console.log('error: ', message); + * }); + */ + + }, { + key: 'removeFilter', + value: function removeFilter(type) { + return this.execute(commands.REMOVE_FILTER, type); + } + + /** + * Apply filter on canvas image + * @param {string} type - Filter type + * @param {Object} options - Options to apply filter + * @param {number} options.maskObjId - masking image object id + * @returns {Promise} + * @example + * imageEditor.applyFilter('Grayscale'); + * @example + * imageEditor.applyFilter('mask', {maskObjId: id}).then(obj => { + * console.log('filterType: ', obj.type); + * console.log('actType: ', obj.action); + * }).catch(message => { + * console.log('error: ', message); + * });; + */ + + }, { + key: 'applyFilter', + value: function applyFilter(type, options) { + return this.execute(commands.APPLY_FILTER, type, options); + } + + /** + * Get data url + * @param {string} type - A DOMString indicating the image format. The default type is image/png. + * @returns {string} A DOMString containing the requested data URI + * @example + * imgEl.src = imageEditor.toDataURL(); + * + * imageEditor.loadImageFromURL(imageEditor.toDataURL(), 'FilterImage').then(() => { + * imageEditor.addImageObject(imgUrl); + * }); + */ + + }, { + key: 'toDataURL', + value: function toDataURL(type) { + return this._graphics.toDataURL(type); + } + + /** + * Get image name + * @returns {string} image name + * @example + * console.log(imageEditor.getImageName()); + */ + + }, { + key: 'getImageName', + value: function getImageName() { + return this._graphics.getImageName(); + } + + /** + * Clear undoStack + * @example + * imageEditor.clearUndoStack(); + */ + + }, { + key: 'clearUndoStack', + value: function clearUndoStack() { + this._invoker.clearUndoStack(); + } + + /** + * Clear redoStack + * @example + * imageEditor.clearRedoStack(); + */ + + }, { + key: 'clearRedoStack', + value: function clearRedoStack() { + this._invoker.clearRedoStack(); + } + + /** + * Whehter the undo stack is empty or not + * @returns {boolean} + * imageEditor.isEmptyUndoStack(); + */ + + }, { + key: 'isEmptyUndoStack', + value: function isEmptyUndoStack() { + return this._invoker.isEmptyUndoStack(); + } + + /** + * Whehter the redo stack is empty or not + * @returns {boolean} + * imageEditor.isEmptyRedoStack(); + */ + + }, { + key: 'isEmptyRedoStack', + value: function isEmptyRedoStack() { + return this._invoker.isEmptyRedoStack(); + } + + /** + * Resize canvas dimension + * @param {{width: number, height: number}} dimension - Max width & height + * @returns {Promise} + */ + + }, { + key: 'resizeCanvasDimension', + value: function resizeCanvasDimension(dimension) { + if (!dimension) { + return Promise.reject(rejectMessages.invalidParameters); + } + + return this.execute(commands.RESIZE_CANVAS_DIMENSION, dimension); + } + + /** + * Destroy + */ + + }, { + key: 'destroy', + value: function destroy() { + var _this = this; + + this.stopDrawingMode(); + this._detachDomEvents(); + this._graphics.destroy(); + this._graphics = null; + + forEach(this, function (value, key) { + _this[key] = null; + }, this); + } + + /** + * Set position + * @param {Object} options - Position options (left or top) + * @private + */ + + }, { + key: '_setPositions', + value: function _setPositions(options) { + var centerPosition = this._graphics.getCenter(); + + if (isUndefined(options.left)) { + options.left = centerPosition.left; + } + + if (isUndefined(options.top)) { + options.top = centerPosition.top; + } + } + + /** + * Set properties of active object + * @param {number} id - object id + * @param {Object} keyValue - key & value + * @returns {Promise} + * @example + * imageEditor.setObjectProperties(id, { + * left:100, + * top:100, + * width: 200, + * height: 200, + * opacity: 0.5 + * }); + */ + + }, { + key: 'setObjectProperties', + value: function setObjectProperties(id, keyValue) { + return this.execute(commands.SET_OBJECT_PROPERTIES, id, keyValue); + } + + /** + * Get properties of active object corresponding key + * @param {number} id - object id + * @param {Array|ObjectProps|string} keys - property's key + * @returns {ObjectProps} properties if id is valid or null + * @example + * var props = imageEditor.getObjectProperties(id, 'left'); + * console.log(props); + * @example + * var props = imageEditor.getObjectProperties(id, ['left', 'top', 'width', 'height']); + * console.log(props); + * @example + * var props = imageEditor.getObjectProperties(id, { + * left: null, + * top: null, + * width: null, + * height: null, + * opacity: null + * }); + * console.log(props); + */ + + }, { + key: 'getObjectProperties', + value: function getObjectProperties(id, keys) { + var object = this._graphics.getObject(id); + if (!object) { + return null; + } + + return this._graphics.getObjectProperties(id, keys); + } + + /** + * Get the canvas size + * @returns {Object} {{width: number, height: number}} canvas size + * @example + * var canvasSize = imageEditor.getCanvasSize(); + * console.log(canvasSize.width); + * console.height(canvasSize.height); + */ + + }, { + key: 'getCanvasSize', + value: function getCanvasSize() { + return this._graphics.getCanvasSize(); + } + + /** + * Get object position by originX, originY + * @param {number} id - object id + * @param {string} originX - can be 'left', 'center', 'right' + * @param {string} originY - can be 'top', 'center', 'bottom' + * @returns {Object} {{x:number, y: number}} position by origin if id is valid, or null + * @example + * var position = imageEditor.getObjectPosition(id, 'left', 'top'); + * console.log(position); + */ + + }, { + key: 'getObjectPosition', + value: function getObjectPosition(id, originX, originY) { + return this._graphics.getObjectPosition(id, originX, originY); + } + + /** + * Set object position by originX, originY + * @param {number} id - object id + * @param {Object} posInfo - position object + * @param {number} posInfo.x - x position + * @param {number} posInfo.y - y position + * @param {string} posInfo.originX - can be 'left', 'center', 'right' + * @param {string} posInfo.originY - can be 'top', 'center', 'bottom' + * @returns {Promise} + * @example + * // align the object to 'left', 'top' + * imageEditor.setObjectPosition(id, { + * x: 0, + * y: 0, + * originX: 'left', + * originY: 'top' + * }); + * @example + * // align the object to 'right', 'top' + * var canvasSize = imageEditor.getCanvasSize(); + * imageEditor.setObjectPosition(id, { + * x: canvasSize.width, + * y: 0, + * originX: 'right', + * originY: 'top' + * }); + * @example + * // align the object to 'left', 'bottom' + * var canvasSize = imageEditor.getCanvasSize(); + * imageEditor.setObjectPosition(id, { + * x: 0, + * y: canvasSize.height, + * originX: 'left', + * originY: 'bottom' + * }); + * @example + * // align the object to 'right', 'bottom' + * var canvasSize = imageEditor.getCanvasSize(); + * imageEditor.setObjectPosition(id, { + * x: canvasSize.width, + * y: canvasSize.height, + * originX: 'right', + * originY: 'bottom' + * }); + */ + + }, { + key: 'setObjectPosition', + value: function setObjectPosition(id, posInfo) { + return this.execute(commands.SET_OBJECT_POSITION, id, posInfo); + } + }]); + + return ImageEditor; + }(); + + CustomEvents.mixin(ImageEditor); + module.exports = ImageEditor; + +/***/ }), +/* 2 */ +/***/ (function(module, exports) { + + module.exports = __WEBPACK_EXTERNAL_MODULE_2__; + +/***/ }), +/* 3 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); /** + * @author NHN Ent. FE Development Team + * @fileoverview Invoker - invoke commands + */ + + + var _tuiCodeSnippet = __webpack_require__(2); + + var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _command = __webpack_require__(68); + + var _command2 = _interopRequireDefault(_command); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + var eventNames = _consts2.default.eventNames, + rejectMessages = _consts2.default.rejectMessages; + var isFunction = _tuiCodeSnippet2.default.isFunction, + isString = _tuiCodeSnippet2.default.isString, + CustomEvents = _tuiCodeSnippet2.default.CustomEvents; + + /** + * Invoker + * @class + * @ignore + */ + + var Invoker = function () { + function Invoker() { + _classCallCheck(this, Invoker); + + /** + * Undo stack + * @type {Array.} + * @private + */ + this._undoStack = []; + + /** + * Redo stack + * @type {Array.} + * @private + */ + this._redoStack = []; + + /** + * Lock-flag for executing command + * @type {boolean} + * @private + */ + this._isLocked = false; + } + + /** + * Invoke command execution + * @param {Command} command - Command + * @returns {Promise} + * @private + */ + + + _createClass(Invoker, [{ + key: '_invokeExecution', + value: function _invokeExecution(command) { + var _this = this; + + this.lock(); + + var args = command.args; + + if (!args) { + args = []; + } + + return command.execute.apply(command, args).then(function (value) { + _this.pushUndoStack(command); + _this.unlock(); + if (isFunction(command.executeCallback)) { + command.executeCallback(value); + } + + return value; + })['catch'](function (message) { + _this.unlock(); + + return _promise2.default.reject(message); + }); + } + + /** + * Invoke command undo + * @param {Command} command - Command + * @returns {Promise} + * @private + */ + + }, { + key: '_invokeUndo', + value: function _invokeUndo(command) { + var _this2 = this; + + this.lock(); + + var args = command.args; + + if (!args) { + args = []; + } + + return command.undo.apply(command, args).then(function (value) { + _this2.pushRedoStack(command); + _this2.unlock(); + if (isFunction(command.undoCallback)) { + command.undoCallback(value); + } + + return value; + })['catch'](function (message) { + _this2.unlock(); + + return _promise2.default.reject(message); + }); + } + + /** + * fire REDO_STACK_CHANGED event + * @private + */ + + }, { + key: '_fireRedoStackChanged', + value: function _fireRedoStackChanged() { + this.fire(eventNames.REDO_STACK_CHANGED, this._redoStack.length); + } + + /** + * fire UNDO_STACK_CHANGED event + * @private + */ + + }, { + key: '_fireUndoStackChanged', + value: function _fireUndoStackChanged() { + this.fire(eventNames.UNDO_STACK_CHANGED, this._undoStack.length); + } + + /** + * Lock this invoker + */ + + }, { + key: 'lock', + value: function lock() { + this._isLocked = true; + } + + /** + * Unlock this invoker + */ + + }, { + key: 'unlock', + value: function unlock() { + this._isLocked = false; + } + + /** + * Invoke command + * Store the command to the undoStack + * Clear the redoStack + * @param {String} commandName - Command name + * @param {...*} args - Arguments for creating command + * @returns {Promise} + */ + + }, { + key: 'execute', + value: function execute() { + var _this3 = this; + + if (this._isLocked) { + return _promise2.default.reject(rejectMessages.isLock); + } + + for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; + } + + var command = args[0]; + + if (isString(command)) { + command = _command2.default.create.apply(_command2.default, args); + } + + return this._invokeExecution(command).then(function (value) { + _this3.clearRedoStack(); + + return value; + }); + } + + /** + * Undo command + * @returns {Promise} + */ + + }, { + key: 'undo', + value: function undo() { + var command = this._undoStack.pop(); + var promise = void 0; + var message = ''; + + if (command && this._isLocked) { + this.pushUndoStack(command, true); + command = null; + } + if (command) { + if (this.isEmptyUndoStack()) { + this._fireUndoStackChanged(); + } + promise = this._invokeUndo(command); + } else { + message = rejectMessages.undo; + if (this._isLocked) { + message = message + ' Because ' + rejectMessages.isLock; + } + promise = _promise2.default.reject(message); + } + + return promise; + } + + /** + * Redo command + * @returns {Promise} + */ + + }, { + key: 'redo', + value: function redo() { + var command = this._redoStack.pop(); + var promise = void 0; + var message = ''; + + if (command && this._isLocked) { + this.pushRedoStack(command, true); + command = null; + } + if (command) { + if (this.isEmptyRedoStack()) { + this._fireRedoStackChanged(); + } + promise = this._invokeExecution(command); + } else { + message = rejectMessages.redo; + if (this._isLocked) { + message = message + ' Because ' + rejectMessages.isLock; + } + promise = _promise2.default.reject(message); + } + + return promise; + } + + /** + * Push undo stack + * @param {Command} command - command + * @param {boolean} [isSilent] - Fire event or not + */ + + }, { + key: 'pushUndoStack', + value: function pushUndoStack(command, isSilent) { + this._undoStack.push(command); + if (!isSilent) { + this._fireUndoStackChanged(); + } + } + + /** + * Push redo stack + * @param {Command} command - command + * @param {boolean} [isSilent] - Fire event or not + */ + + }, { + key: 'pushRedoStack', + value: function pushRedoStack(command, isSilent) { + this._redoStack.push(command); + if (!isSilent) { + this._fireRedoStackChanged(); + } + } + + /** + * Return whether the redoStack is empty + * @returns {boolean} + */ + + }, { + key: 'isEmptyRedoStack', + value: function isEmptyRedoStack() { + return this._redoStack.length === 0; + } + + /** + * Return whether the undoStack is empty + * @returns {boolean} + */ + + }, { + key: 'isEmptyUndoStack', + value: function isEmptyUndoStack() { + return this._undoStack.length === 0; + } + + /** + * Clear undoStack + */ + + }, { + key: 'clearUndoStack', + value: function clearUndoStack() { + if (!this.isEmptyUndoStack()) { + this._undoStack = []; + this._fireUndoStackChanged(); + } + } + + /** + * Clear redoStack + */ + + }, { + key: 'clearRedoStack', + value: function clearRedoStack() { + if (!this.isEmptyRedoStack()) { + this._redoStack = []; + this._fireRedoStackChanged(); + } + } + }]); + + return Invoker; + }(); + + CustomEvents.mixin(Invoker); + module.exports = Invoker; + +/***/ }), +/* 4 */ +/***/ (function(module, exports, __webpack_require__) { + + __webpack_require__(5); + __webpack_require__(6); + __webpack_require__(50); + __webpack_require__(54); + module.exports = __webpack_require__(14).Promise; + +/***/ }), +/* 5 */ +/***/ (function(module, exports) { + + + +/***/ }), +/* 6 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + var $at = __webpack_require__(7)(true); + + // 21.1.3.27 String.prototype[@@iterator]() + __webpack_require__(10)(String, 'String', function(iterated){ + this._t = String(iterated); // target + this._i = 0; // next index + // 21.1.5.2.1 %StringIteratorPrototype%.next() + }, function(){ + var O = this._t + , index = this._i + , point; + if(index >= O.length)return {value: undefined, done: true}; + point = $at(O, index); + this._i += point.length; + return {value: point, done: false}; + }); + +/***/ }), +/* 7 */ +/***/ (function(module, exports, __webpack_require__) { + + var toInteger = __webpack_require__(8) + , defined = __webpack_require__(9); + // true -> String#at + // false -> String#codePointAt + module.exports = function(TO_STRING){ + return function(that, pos){ + var s = String(defined(that)) + , i = toInteger(pos) + , l = s.length + , a, b; + if(i < 0 || i >= l)return TO_STRING ? '' : undefined; + a = s.charCodeAt(i); + return a < 0xd800 || a > 0xdbff || i + 1 === l || (b = s.charCodeAt(i + 1)) < 0xdc00 || b > 0xdfff + ? TO_STRING ? s.charAt(i) : a + : TO_STRING ? s.slice(i, i + 2) : (a - 0xd800 << 10) + (b - 0xdc00) + 0x10000; + }; + }; + +/***/ }), +/* 8 */ +/***/ (function(module, exports) { + + // 7.1.4 ToInteger + var ceil = Math.ceil + , floor = Math.floor; + module.exports = function(it){ + return isNaN(it = +it) ? 0 : (it > 0 ? floor : ceil)(it); + }; + +/***/ }), +/* 9 */ +/***/ (function(module, exports) { + + // 7.2.1 RequireObjectCoercible(argument) + module.exports = function(it){ + if(it == undefined)throw TypeError("Can't call method on " + it); + return it; + }; + +/***/ }), +/* 10 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + var LIBRARY = __webpack_require__(11) + , $export = __webpack_require__(12) + , redefine = __webpack_require__(27) + , hide = __webpack_require__(17) + , has = __webpack_require__(28) + , Iterators = __webpack_require__(29) + , $iterCreate = __webpack_require__(30) + , setToStringTag = __webpack_require__(46) + , getPrototypeOf = __webpack_require__(48) + , ITERATOR = __webpack_require__(47)('iterator') + , BUGGY = !([].keys && 'next' in [].keys()) // Safari has buggy iterators w/o `next` + , FF_ITERATOR = '@@iterator' + , KEYS = 'keys' + , VALUES = 'values'; + + var returnThis = function(){ return this; }; + + module.exports = function(Base, NAME, Constructor, next, DEFAULT, IS_SET, FORCED){ + $iterCreate(Constructor, NAME, next); + var getMethod = function(kind){ + if(!BUGGY && kind in proto)return proto[kind]; + switch(kind){ + case KEYS: return function keys(){ return new Constructor(this, kind); }; + case VALUES: return function values(){ return new Constructor(this, kind); }; + } return function entries(){ return new Constructor(this, kind); }; + }; + var TAG = NAME + ' Iterator' + , DEF_VALUES = DEFAULT == VALUES + , VALUES_BUG = false + , proto = Base.prototype + , $native = proto[ITERATOR] || proto[FF_ITERATOR] || DEFAULT && proto[DEFAULT] + , $default = $native || getMethod(DEFAULT) + , $entries = DEFAULT ? !DEF_VALUES ? $default : getMethod('entries') : undefined + , $anyNative = NAME == 'Array' ? proto.entries || $native : $native + , methods, key, IteratorPrototype; + // Fix native + if($anyNative){ + IteratorPrototype = getPrototypeOf($anyNative.call(new Base)); + if(IteratorPrototype !== Object.prototype){ + // Set @@toStringTag to native iterators + setToStringTag(IteratorPrototype, TAG, true); + // fix for some old engines + if(!LIBRARY && !has(IteratorPrototype, ITERATOR))hide(IteratorPrototype, ITERATOR, returnThis); + } + } + // fix Array#{values, @@iterator}.name in V8 / FF + if(DEF_VALUES && $native && $native.name !== VALUES){ + VALUES_BUG = true; + $default = function values(){ return $native.call(this); }; + } + // Define iterator + if((!LIBRARY || FORCED) && (BUGGY || VALUES_BUG || !proto[ITERATOR])){ + hide(proto, ITERATOR, $default); + } + // Plug for library + Iterators[NAME] = $default; + Iterators[TAG] = returnThis; + if(DEFAULT){ + methods = { + values: DEF_VALUES ? $default : getMethod(VALUES), + keys: IS_SET ? $default : getMethod(KEYS), + entries: $entries + }; + if(FORCED)for(key in methods){ + if(!(key in proto))redefine(proto, key, methods[key]); + } else $export($export.P + $export.F * (BUGGY || VALUES_BUG), NAME, methods); + } + return methods; + }; + +/***/ }), +/* 11 */ +/***/ (function(module, exports) { + + module.exports = true; + +/***/ }), +/* 12 */ +/***/ (function(module, exports, __webpack_require__) { + + var global = __webpack_require__(13) + , core = __webpack_require__(14) + , ctx = __webpack_require__(15) + , hide = __webpack_require__(17) + , PROTOTYPE = 'prototype'; + + var $export = function(type, name, source){ + var IS_FORCED = type & $export.F + , IS_GLOBAL = type & $export.G + , IS_STATIC = type & $export.S + , IS_PROTO = type & $export.P + , IS_BIND = type & $export.B + , IS_WRAP = type & $export.W + , exports = IS_GLOBAL ? core : core[name] || (core[name] = {}) + , expProto = exports[PROTOTYPE] + , target = IS_GLOBAL ? global : IS_STATIC ? global[name] : (global[name] || {})[PROTOTYPE] + , key, own, out; + if(IS_GLOBAL)source = name; + for(key in source){ + // contains in native + own = !IS_FORCED && target && target[key] !== undefined; + if(own && key in exports)continue; + // export native or passed + out = own ? target[key] : source[key]; + // prevent global pollution for namespaces + exports[key] = IS_GLOBAL && typeof target[key] != 'function' ? source[key] + // bind timers to global for call from export context + : IS_BIND && own ? ctx(out, global) + // wrap global constructors for prevent change them in library + : IS_WRAP && target[key] == out ? (function(C){ + var F = function(a, b, c){ + if(this instanceof C){ + switch(arguments.length){ + case 0: return new C; + case 1: return new C(a); + case 2: return new C(a, b); + } return new C(a, b, c); + } return C.apply(this, arguments); + }; + F[PROTOTYPE] = C[PROTOTYPE]; + return F; + // make static versions for prototype methods + })(out) : IS_PROTO && typeof out == 'function' ? ctx(Function.call, out) : out; + // export proto methods to core.%CONSTRUCTOR%.methods.%NAME% + if(IS_PROTO){ + (exports.virtual || (exports.virtual = {}))[key] = out; + // export proto methods to core.%CONSTRUCTOR%.prototype.%NAME% + if(type & $export.R && expProto && !expProto[key])hide(expProto, key, out); + } + } + }; + // type bitmap + $export.F = 1; // forced + $export.G = 2; // global + $export.S = 4; // static + $export.P = 8; // proto + $export.B = 16; // bind + $export.W = 32; // wrap + $export.U = 64; // safe + $export.R = 128; // real proto method for `library` + module.exports = $export; + +/***/ }), +/* 13 */ +/***/ (function(module, exports) { + + // https://github.com/zloirock/core-js/issues/86#issuecomment-115759028 + var global = module.exports = typeof window != 'undefined' && window.Math == Math + ? window : typeof self != 'undefined' && self.Math == Math ? self : Function('return this')(); + if(typeof __g == 'number')__g = global; // eslint-disable-line no-undef + +/***/ }), +/* 14 */ +/***/ (function(module, exports) { + + var core = module.exports = {version: '2.4.0'}; + if(typeof __e == 'number')__e = core; // eslint-disable-line no-undef + +/***/ }), +/* 15 */ +/***/ (function(module, exports, __webpack_require__) { + + // optional / simple context binding + var aFunction = __webpack_require__(16); + module.exports = function(fn, that, length){ + aFunction(fn); + if(that === undefined)return fn; + switch(length){ + case 1: return function(a){ + return fn.call(that, a); + }; + case 2: return function(a, b){ + return fn.call(that, a, b); + }; + case 3: return function(a, b, c){ + return fn.call(that, a, b, c); + }; + } + return function(/* ...args */){ + return fn.apply(that, arguments); + }; + }; + +/***/ }), +/* 16 */ +/***/ (function(module, exports) { + + module.exports = function(it){ + if(typeof it != 'function')throw TypeError(it + ' is not a function!'); + return it; + }; + +/***/ }), +/* 17 */ +/***/ (function(module, exports, __webpack_require__) { + + var dP = __webpack_require__(18) + , createDesc = __webpack_require__(26); + module.exports = __webpack_require__(22) ? function(object, key, value){ + return dP.f(object, key, createDesc(1, value)); + } : function(object, key, value){ + object[key] = value; + return object; + }; + +/***/ }), +/* 18 */ +/***/ (function(module, exports, __webpack_require__) { + + var anObject = __webpack_require__(19) + , IE8_DOM_DEFINE = __webpack_require__(21) + , toPrimitive = __webpack_require__(25) + , dP = Object.defineProperty; + + exports.f = __webpack_require__(22) ? Object.defineProperty : function defineProperty(O, P, Attributes){ + anObject(O); + P = toPrimitive(P, true); + anObject(Attributes); + if(IE8_DOM_DEFINE)try { + return dP(O, P, Attributes); + } catch(e){ /* empty */ } + if('get' in Attributes || 'set' in Attributes)throw TypeError('Accessors not supported!'); + if('value' in Attributes)O[P] = Attributes.value; + return O; + }; + +/***/ }), +/* 19 */ +/***/ (function(module, exports, __webpack_require__) { + + var isObject = __webpack_require__(20); + module.exports = function(it){ + if(!isObject(it))throw TypeError(it + ' is not an object!'); + return it; + }; + +/***/ }), +/* 20 */ +/***/ (function(module, exports) { + + module.exports = function(it){ + return typeof it === 'object' ? it !== null : typeof it === 'function'; + }; + +/***/ }), +/* 21 */ +/***/ (function(module, exports, __webpack_require__) { + + module.exports = !__webpack_require__(22) && !__webpack_require__(23)(function(){ + return Object.defineProperty(__webpack_require__(24)('div'), 'a', {get: function(){ return 7; }}).a != 7; + }); + +/***/ }), +/* 22 */ +/***/ (function(module, exports, __webpack_require__) { + + // Thank's IE8 for his funny defineProperty + module.exports = !__webpack_require__(23)(function(){ + return Object.defineProperty({}, 'a', {get: function(){ return 7; }}).a != 7; + }); + +/***/ }), +/* 23 */ +/***/ (function(module, exports) { + + module.exports = function(exec){ + try { + return !!exec(); + } catch(e){ + return true; + } + }; + +/***/ }), +/* 24 */ +/***/ (function(module, exports, __webpack_require__) { + + var isObject = __webpack_require__(20) + , document = __webpack_require__(13).document + // in old IE typeof document.createElement is 'object' + , is = isObject(document) && isObject(document.createElement); + module.exports = function(it){ + return is ? document.createElement(it) : {}; + }; + +/***/ }), +/* 25 */ +/***/ (function(module, exports, __webpack_require__) { + + // 7.1.1 ToPrimitive(input [, PreferredType]) + var isObject = __webpack_require__(20); + // instead of the ES6 spec version, we didn't implement @@toPrimitive case + // and the second argument - flag - preferred type is a string + module.exports = function(it, S){ + if(!isObject(it))return it; + var fn, val; + if(S && typeof (fn = it.toString) == 'function' && !isObject(val = fn.call(it)))return val; + if(typeof (fn = it.valueOf) == 'function' && !isObject(val = fn.call(it)))return val; + if(!S && typeof (fn = it.toString) == 'function' && !isObject(val = fn.call(it)))return val; + throw TypeError("Can't convert object to primitive value"); + }; + +/***/ }), +/* 26 */ +/***/ (function(module, exports) { + + module.exports = function(bitmap, value){ + return { + enumerable : !(bitmap & 1), + configurable: !(bitmap & 2), + writable : !(bitmap & 4), + value : value + }; + }; + +/***/ }), +/* 27 */ +/***/ (function(module, exports, __webpack_require__) { + + module.exports = __webpack_require__(17); + +/***/ }), +/* 28 */ +/***/ (function(module, exports) { + + var hasOwnProperty = {}.hasOwnProperty; + module.exports = function(it, key){ + return hasOwnProperty.call(it, key); + }; + +/***/ }), +/* 29 */ +/***/ (function(module, exports) { + + module.exports = {}; + +/***/ }), +/* 30 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + var create = __webpack_require__(31) + , descriptor = __webpack_require__(26) + , setToStringTag = __webpack_require__(46) + , IteratorPrototype = {}; + + // 25.1.2.1.1 %IteratorPrototype%[@@iterator]() + __webpack_require__(17)(IteratorPrototype, __webpack_require__(47)('iterator'), function(){ return this; }); + + module.exports = function(Constructor, NAME, next){ + Constructor.prototype = create(IteratorPrototype, {next: descriptor(1, next)}); + setToStringTag(Constructor, NAME + ' Iterator'); + }; + +/***/ }), +/* 31 */ +/***/ (function(module, exports, __webpack_require__) { + + // 19.1.2.2 / 15.2.3.5 Object.create(O [, Properties]) + var anObject = __webpack_require__(19) + , dPs = __webpack_require__(32) + , enumBugKeys = __webpack_require__(44) + , IE_PROTO = __webpack_require__(41)('IE_PROTO') + , Empty = function(){ /* empty */ } + , PROTOTYPE = 'prototype'; + + // Create object with fake `null` prototype: use iframe Object with cleared prototype + var createDict = function(){ + // Thrash, waste and sodomy: IE GC bug + var iframe = __webpack_require__(24)('iframe') + , i = enumBugKeys.length + , lt = '<' + , gt = '>' + , iframeDocument; + iframe.style.display = 'none'; + __webpack_require__(45).appendChild(iframe); + iframe.src = 'javascript:'; // eslint-disable-line no-script-url + // createDict = iframe.contentWindow.Object; + // html.removeChild(iframe); + iframeDocument = iframe.contentWindow.document; + iframeDocument.open(); + iframeDocument.write(lt + 'script' + gt + 'document.F=Object' + lt + '/script' + gt); + iframeDocument.close(); + createDict = iframeDocument.F; + while(i--)delete createDict[PROTOTYPE][enumBugKeys[i]]; + return createDict(); + }; + + module.exports = Object.create || function create(O, Properties){ + var result; + if(O !== null){ + Empty[PROTOTYPE] = anObject(O); + result = new Empty; + Empty[PROTOTYPE] = null; + // add "__proto__" for Object.getPrototypeOf polyfill + result[IE_PROTO] = O; + } else result = createDict(); + return Properties === undefined ? result : dPs(result, Properties); + }; + + +/***/ }), +/* 32 */ +/***/ (function(module, exports, __webpack_require__) { + + var dP = __webpack_require__(18) + , anObject = __webpack_require__(19) + , getKeys = __webpack_require__(33); + + module.exports = __webpack_require__(22) ? Object.defineProperties : function defineProperties(O, Properties){ + anObject(O); + var keys = getKeys(Properties) + , length = keys.length + , i = 0 + , P; + while(length > i)dP.f(O, P = keys[i++], Properties[P]); + return O; + }; + +/***/ }), +/* 33 */ +/***/ (function(module, exports, __webpack_require__) { + + // 19.1.2.14 / 15.2.3.14 Object.keys(O) + var $keys = __webpack_require__(34) + , enumBugKeys = __webpack_require__(44); + + module.exports = Object.keys || function keys(O){ + return $keys(O, enumBugKeys); + }; + +/***/ }), +/* 34 */ +/***/ (function(module, exports, __webpack_require__) { + + var has = __webpack_require__(28) + , toIObject = __webpack_require__(35) + , arrayIndexOf = __webpack_require__(38)(false) + , IE_PROTO = __webpack_require__(41)('IE_PROTO'); + + module.exports = function(object, names){ + var O = toIObject(object) + , i = 0 + , result = [] + , key; + for(key in O)if(key != IE_PROTO)has(O, key) && result.push(key); + // Don't enum bug & hidden keys + while(names.length > i)if(has(O, key = names[i++])){ + ~arrayIndexOf(result, key) || result.push(key); + } + return result; + }; + +/***/ }), +/* 35 */ +/***/ (function(module, exports, __webpack_require__) { + + // to indexed object, toObject with fallback for non-array-like ES3 strings + var IObject = __webpack_require__(36) + , defined = __webpack_require__(9); + module.exports = function(it){ + return IObject(defined(it)); + }; + +/***/ }), +/* 36 */ +/***/ (function(module, exports, __webpack_require__) { + + // fallback for non-array-like ES3 and non-enumerable old V8 strings + var cof = __webpack_require__(37); + module.exports = Object('z').propertyIsEnumerable(0) ? Object : function(it){ + return cof(it) == 'String' ? it.split('') : Object(it); + }; + +/***/ }), +/* 37 */ +/***/ (function(module, exports) { + + var toString = {}.toString; + + module.exports = function(it){ + return toString.call(it).slice(8, -1); + }; + +/***/ }), +/* 38 */ +/***/ (function(module, exports, __webpack_require__) { + + // false -> Array#indexOf + // true -> Array#includes + var toIObject = __webpack_require__(35) + , toLength = __webpack_require__(39) + , toIndex = __webpack_require__(40); + module.exports = function(IS_INCLUDES){ + return function($this, el, fromIndex){ + var O = toIObject($this) + , length = toLength(O.length) + , index = toIndex(fromIndex, length) + , value; + // Array#includes uses SameValueZero equality algorithm + if(IS_INCLUDES && el != el)while(length > index){ + value = O[index++]; + if(value != value)return true; + // Array#toIndex ignores holes, Array#includes - not + } else for(;length > index; index++)if(IS_INCLUDES || index in O){ + if(O[index] === el)return IS_INCLUDES || index || 0; + } return !IS_INCLUDES && -1; + }; + }; + +/***/ }), +/* 39 */ +/***/ (function(module, exports, __webpack_require__) { + + // 7.1.15 ToLength + var toInteger = __webpack_require__(8) + , min = Math.min; + module.exports = function(it){ + return it > 0 ? min(toInteger(it), 0x1fffffffffffff) : 0; // pow(2, 53) - 1 == 9007199254740991 + }; + +/***/ }), +/* 40 */ +/***/ (function(module, exports, __webpack_require__) { + + var toInteger = __webpack_require__(8) + , max = Math.max + , min = Math.min; + module.exports = function(index, length){ + index = toInteger(index); + return index < 0 ? max(index + length, 0) : min(index, length); + }; + +/***/ }), +/* 41 */ +/***/ (function(module, exports, __webpack_require__) { + + var shared = __webpack_require__(42)('keys') + , uid = __webpack_require__(43); + module.exports = function(key){ + return shared[key] || (shared[key] = uid(key)); + }; + +/***/ }), +/* 42 */ +/***/ (function(module, exports, __webpack_require__) { + + var global = __webpack_require__(13) + , SHARED = '__core-js_shared__' + , store = global[SHARED] || (global[SHARED] = {}); + module.exports = function(key){ + return store[key] || (store[key] = {}); + }; + +/***/ }), +/* 43 */ +/***/ (function(module, exports) { + + var id = 0 + , px = Math.random(); + module.exports = function(key){ + return 'Symbol('.concat(key === undefined ? '' : key, ')_', (++id + px).toString(36)); + }; + +/***/ }), +/* 44 */ +/***/ (function(module, exports) { + + // IE 8- don't enum bug keys + module.exports = ( + 'constructor,hasOwnProperty,isPrototypeOf,propertyIsEnumerable,toLocaleString,toString,valueOf' + ).split(','); + +/***/ }), +/* 45 */ +/***/ (function(module, exports, __webpack_require__) { + + module.exports = __webpack_require__(13).document && document.documentElement; + +/***/ }), +/* 46 */ +/***/ (function(module, exports, __webpack_require__) { + + var def = __webpack_require__(18).f + , has = __webpack_require__(28) + , TAG = __webpack_require__(47)('toStringTag'); + + module.exports = function(it, tag, stat){ + if(it && !has(it = stat ? it : it.prototype, TAG))def(it, TAG, {configurable: true, value: tag}); + }; + +/***/ }), +/* 47 */ +/***/ (function(module, exports, __webpack_require__) { + + var store = __webpack_require__(42)('wks') + , uid = __webpack_require__(43) + , Symbol = __webpack_require__(13).Symbol + , USE_SYMBOL = typeof Symbol == 'function'; + + var $exports = module.exports = function(name){ + return store[name] || (store[name] = + USE_SYMBOL && Symbol[name] || (USE_SYMBOL ? Symbol : uid)('Symbol.' + name)); + }; + + $exports.store = store; + +/***/ }), +/* 48 */ +/***/ (function(module, exports, __webpack_require__) { + + // 19.1.2.9 / 15.2.3.2 Object.getPrototypeOf(O) + var has = __webpack_require__(28) + , toObject = __webpack_require__(49) + , IE_PROTO = __webpack_require__(41)('IE_PROTO') + , ObjectProto = Object.prototype; + + module.exports = Object.getPrototypeOf || function(O){ + O = toObject(O); + if(has(O, IE_PROTO))return O[IE_PROTO]; + if(typeof O.constructor == 'function' && O instanceof O.constructor){ + return O.constructor.prototype; + } return O instanceof Object ? ObjectProto : null; + }; + +/***/ }), +/* 49 */ +/***/ (function(module, exports, __webpack_require__) { + + // 7.1.13 ToObject(argument) + var defined = __webpack_require__(9); + module.exports = function(it){ + return Object(defined(it)); + }; + +/***/ }), +/* 50 */ +/***/ (function(module, exports, __webpack_require__) { + + __webpack_require__(51); + var global = __webpack_require__(13) + , hide = __webpack_require__(17) + , Iterators = __webpack_require__(29) + , TO_STRING_TAG = __webpack_require__(47)('toStringTag'); + + for(var collections = ['NodeList', 'DOMTokenList', 'MediaList', 'StyleSheetList', 'CSSRuleList'], i = 0; i < 5; i++){ + var NAME = collections[i] + , Collection = global[NAME] + , proto = Collection && Collection.prototype; + if(proto && !proto[TO_STRING_TAG])hide(proto, TO_STRING_TAG, NAME); + Iterators[NAME] = Iterators.Array; + } + +/***/ }), +/* 51 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + var addToUnscopables = __webpack_require__(52) + , step = __webpack_require__(53) + , Iterators = __webpack_require__(29) + , toIObject = __webpack_require__(35); + + // 22.1.3.4 Array.prototype.entries() + // 22.1.3.13 Array.prototype.keys() + // 22.1.3.29 Array.prototype.values() + // 22.1.3.30 Array.prototype[@@iterator]() + module.exports = __webpack_require__(10)(Array, 'Array', function(iterated, kind){ + this._t = toIObject(iterated); // target + this._i = 0; // next index + this._k = kind; // kind + // 22.1.5.2.1 %ArrayIteratorPrototype%.next() + }, function(){ + var O = this._t + , kind = this._k + , index = this._i++; + if(!O || index >= O.length){ + this._t = undefined; + return step(1); + } + if(kind == 'keys' )return step(0, index); + if(kind == 'values')return step(0, O[index]); + return step(0, [index, O[index]]); + }, 'values'); + + // argumentsList[@@iterator] is %ArrayProto_values% (9.4.4.6, 9.4.4.7) + Iterators.Arguments = Iterators.Array; + + addToUnscopables('keys'); + addToUnscopables('values'); + addToUnscopables('entries'); + +/***/ }), +/* 52 */ +/***/ (function(module, exports) { + + module.exports = function(){ /* empty */ }; + +/***/ }), +/* 53 */ +/***/ (function(module, exports) { + + module.exports = function(done, value){ + return {value: value, done: !!done}; + }; + +/***/ }), +/* 54 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + var LIBRARY = __webpack_require__(11) + , global = __webpack_require__(13) + , ctx = __webpack_require__(15) + , classof = __webpack_require__(55) + , $export = __webpack_require__(12) + , isObject = __webpack_require__(20) + , aFunction = __webpack_require__(16) + , anInstance = __webpack_require__(56) + , forOf = __webpack_require__(57) + , speciesConstructor = __webpack_require__(61) + , task = __webpack_require__(62).set + , microtask = __webpack_require__(64)() + , PROMISE = 'Promise' + , TypeError = global.TypeError + , process = global.process + , $Promise = global[PROMISE] + , process = global.process + , isNode = classof(process) == 'process' + , empty = function(){ /* empty */ } + , Internal, GenericPromiseCapability, Wrapper; + + var USE_NATIVE = !!function(){ + try { + // correct subclassing with @@species support + var promise = $Promise.resolve(1) + , FakePromise = (promise.constructor = {})[__webpack_require__(47)('species')] = function(exec){ exec(empty, empty); }; + // unhandled rejections tracking support, NodeJS Promise without it fails @@species test + return (isNode || typeof PromiseRejectionEvent == 'function') && promise.then(empty) instanceof FakePromise; + } catch(e){ /* empty */ } + }(); + + // helpers + var sameConstructor = function(a, b){ + // with library wrapper special case + return a === b || a === $Promise && b === Wrapper; + }; + var isThenable = function(it){ + var then; + return isObject(it) && typeof (then = it.then) == 'function' ? then : false; + }; + var newPromiseCapability = function(C){ + return sameConstructor($Promise, C) + ? new PromiseCapability(C) + : new GenericPromiseCapability(C); + }; + var PromiseCapability = GenericPromiseCapability = function(C){ + var resolve, reject; + this.promise = new C(function($$resolve, $$reject){ + if(resolve !== undefined || reject !== undefined)throw TypeError('Bad Promise constructor'); + resolve = $$resolve; + reject = $$reject; + }); + this.resolve = aFunction(resolve); + this.reject = aFunction(reject); + }; + var perform = function(exec){ + try { + exec(); + } catch(e){ + return {error: e}; + } + }; + var notify = function(promise, isReject){ + if(promise._n)return; + promise._n = true; + var chain = promise._c; + microtask(function(){ + var value = promise._v + , ok = promise._s == 1 + , i = 0; + var run = function(reaction){ + var handler = ok ? reaction.ok : reaction.fail + , resolve = reaction.resolve + , reject = reaction.reject + , domain = reaction.domain + , result, then; + try { + if(handler){ + if(!ok){ + if(promise._h == 2)onHandleUnhandled(promise); + promise._h = 1; + } + if(handler === true)result = value; + else { + if(domain)domain.enter(); + result = handler(value); + if(domain)domain.exit(); + } + if(result === reaction.promise){ + reject(TypeError('Promise-chain cycle')); + } else if(then = isThenable(result)){ + then.call(result, resolve, reject); + } else resolve(result); + } else reject(value); + } catch(e){ + reject(e); + } + }; + while(chain.length > i)run(chain[i++]); // variable length - can't use forEach + promise._c = []; + promise._n = false; + if(isReject && !promise._h)onUnhandled(promise); + }); + }; + var onUnhandled = function(promise){ + task.call(global, function(){ + var value = promise._v + , abrupt, handler, console; + if(isUnhandled(promise)){ + abrupt = perform(function(){ + if(isNode){ + process.emit('unhandledRejection', value, promise); + } else if(handler = global.onunhandledrejection){ + handler({promise: promise, reason: value}); + } else if((console = global.console) && console.error){ + console.error('Unhandled promise rejection', value); + } + }); + // Browsers should not trigger `rejectionHandled` event if it was handled here, NodeJS - should + promise._h = isNode || isUnhandled(promise) ? 2 : 1; + } promise._a = undefined; + if(abrupt)throw abrupt.error; + }); + }; + var isUnhandled = function(promise){ + if(promise._h == 1)return false; + var chain = promise._a || promise._c + , i = 0 + , reaction; + while(chain.length > i){ + reaction = chain[i++]; + if(reaction.fail || !isUnhandled(reaction.promise))return false; + } return true; + }; + var onHandleUnhandled = function(promise){ + task.call(global, function(){ + var handler; + if(isNode){ + process.emit('rejectionHandled', promise); + } else if(handler = global.onrejectionhandled){ + handler({promise: promise, reason: promise._v}); + } + }); + }; + var $reject = function(value){ + var promise = this; + if(promise._d)return; + promise._d = true; + promise = promise._w || promise; // unwrap + promise._v = value; + promise._s = 2; + if(!promise._a)promise._a = promise._c.slice(); + notify(promise, true); + }; + var $resolve = function(value){ + var promise = this + , then; + if(promise._d)return; + promise._d = true; + promise = promise._w || promise; // unwrap + try { + if(promise === value)throw TypeError("Promise can't be resolved itself"); + if(then = isThenable(value)){ + microtask(function(){ + var wrapper = {_w: promise, _d: false}; // wrap + try { + then.call(value, ctx($resolve, wrapper, 1), ctx($reject, wrapper, 1)); + } catch(e){ + $reject.call(wrapper, e); + } + }); + } else { + promise._v = value; + promise._s = 1; + notify(promise, false); + } + } catch(e){ + $reject.call({_w: promise, _d: false}, e); // wrap + } + }; + + // constructor polyfill + if(!USE_NATIVE){ + // 25.4.3.1 Promise(executor) + $Promise = function Promise(executor){ + anInstance(this, $Promise, PROMISE, '_h'); + aFunction(executor); + Internal.call(this); + try { + executor(ctx($resolve, this, 1), ctx($reject, this, 1)); + } catch(err){ + $reject.call(this, err); + } + }; + Internal = function Promise(executor){ + this._c = []; // <- awaiting reactions + this._a = undefined; // <- checked in isUnhandled reactions + this._s = 0; // <- state + this._d = false; // <- done + this._v = undefined; // <- value + this._h = 0; // <- rejection state, 0 - default, 1 - handled, 2 - unhandled + this._n = false; // <- notify + }; + Internal.prototype = __webpack_require__(65)($Promise.prototype, { + // 25.4.5.3 Promise.prototype.then(onFulfilled, onRejected) + then: function then(onFulfilled, onRejected){ + var reaction = newPromiseCapability(speciesConstructor(this, $Promise)); + reaction.ok = typeof onFulfilled == 'function' ? onFulfilled : true; + reaction.fail = typeof onRejected == 'function' && onRejected; + reaction.domain = isNode ? process.domain : undefined; + this._c.push(reaction); + if(this._a)this._a.push(reaction); + if(this._s)notify(this, false); + return reaction.promise; + }, + // 25.4.5.1 Promise.prototype.catch(onRejected) + 'catch': function(onRejected){ + return this.then(undefined, onRejected); + } + }); + PromiseCapability = function(){ + var promise = new Internal; + this.promise = promise; + this.resolve = ctx($resolve, promise, 1); + this.reject = ctx($reject, promise, 1); + }; + } + + $export($export.G + $export.W + $export.F * !USE_NATIVE, {Promise: $Promise}); + __webpack_require__(46)($Promise, PROMISE); + __webpack_require__(66)(PROMISE); + Wrapper = __webpack_require__(14)[PROMISE]; + + // statics + $export($export.S + $export.F * !USE_NATIVE, PROMISE, { + // 25.4.4.5 Promise.reject(r) + reject: function reject(r){ + var capability = newPromiseCapability(this) + , $$reject = capability.reject; + $$reject(r); + return capability.promise; + } + }); + $export($export.S + $export.F * (LIBRARY || !USE_NATIVE), PROMISE, { + // 25.4.4.6 Promise.resolve(x) + resolve: function resolve(x){ + // instanceof instead of internal slot check because we should fix it without replacement native Promise core + if(x instanceof $Promise && sameConstructor(x.constructor, this))return x; + var capability = newPromiseCapability(this) + , $$resolve = capability.resolve; + $$resolve(x); + return capability.promise; + } + }); + $export($export.S + $export.F * !(USE_NATIVE && __webpack_require__(67)(function(iter){ + $Promise.all(iter)['catch'](empty); + })), PROMISE, { + // 25.4.4.1 Promise.all(iterable) + all: function all(iterable){ + var C = this + , capability = newPromiseCapability(C) + , resolve = capability.resolve + , reject = capability.reject; + var abrupt = perform(function(){ + var values = [] + , index = 0 + , remaining = 1; + forOf(iterable, false, function(promise){ + var $index = index++ + , alreadyCalled = false; + values.push(undefined); + remaining++; + C.resolve(promise).then(function(value){ + if(alreadyCalled)return; + alreadyCalled = true; + values[$index] = value; + --remaining || resolve(values); + }, reject); + }); + --remaining || resolve(values); + }); + if(abrupt)reject(abrupt.error); + return capability.promise; + }, + // 25.4.4.4 Promise.race(iterable) + race: function race(iterable){ + var C = this + , capability = newPromiseCapability(C) + , reject = capability.reject; + var abrupt = perform(function(){ + forOf(iterable, false, function(promise){ + C.resolve(promise).then(capability.resolve, reject); + }); + }); + if(abrupt)reject(abrupt.error); + return capability.promise; + } + }); + +/***/ }), +/* 55 */ +/***/ (function(module, exports, __webpack_require__) { + + // getting tag from 19.1.3.6 Object.prototype.toString() + var cof = __webpack_require__(37) + , TAG = __webpack_require__(47)('toStringTag') + // ES3 wrong here + , ARG = cof(function(){ return arguments; }()) == 'Arguments'; + + // fallback for IE11 Script Access Denied error + var tryGet = function(it, key){ + try { + return it[key]; + } catch(e){ /* empty */ } + }; + + module.exports = function(it){ + var O, T, B; + return it === undefined ? 'Undefined' : it === null ? 'Null' + // @@toStringTag case + : typeof (T = tryGet(O = Object(it), TAG)) == 'string' ? T + // builtinTag case + : ARG ? cof(O) + // ES3 arguments fallback + : (B = cof(O)) == 'Object' && typeof O.callee == 'function' ? 'Arguments' : B; + }; + +/***/ }), +/* 56 */ +/***/ (function(module, exports) { + + module.exports = function(it, Constructor, name, forbiddenField){ + if(!(it instanceof Constructor) || (forbiddenField !== undefined && forbiddenField in it)){ + throw TypeError(name + ': incorrect invocation!'); + } return it; + }; + +/***/ }), +/* 57 */ +/***/ (function(module, exports, __webpack_require__) { + + var ctx = __webpack_require__(15) + , call = __webpack_require__(58) + , isArrayIter = __webpack_require__(59) + , anObject = __webpack_require__(19) + , toLength = __webpack_require__(39) + , getIterFn = __webpack_require__(60) + , BREAK = {} + , RETURN = {}; + var exports = module.exports = function(iterable, entries, fn, that, ITERATOR){ + var iterFn = ITERATOR ? function(){ return iterable; } : getIterFn(iterable) + , f = ctx(fn, that, entries ? 2 : 1) + , index = 0 + , length, step, iterator, result; + if(typeof iterFn != 'function')throw TypeError(iterable + ' is not iterable!'); + // fast case for arrays with default iterator + if(isArrayIter(iterFn))for(length = toLength(iterable.length); length > index; index++){ + result = entries ? f(anObject(step = iterable[index])[0], step[1]) : f(iterable[index]); + if(result === BREAK || result === RETURN)return result; + } else for(iterator = iterFn.call(iterable); !(step = iterator.next()).done; ){ + result = call(iterator, f, step.value, entries); + if(result === BREAK || result === RETURN)return result; + } + }; + exports.BREAK = BREAK; + exports.RETURN = RETURN; + +/***/ }), +/* 58 */ +/***/ (function(module, exports, __webpack_require__) { + + // call something on iterator step with safe closing on error + var anObject = __webpack_require__(19); + module.exports = function(iterator, fn, value, entries){ + try { + return entries ? fn(anObject(value)[0], value[1]) : fn(value); + // 7.4.6 IteratorClose(iterator, completion) + } catch(e){ + var ret = iterator['return']; + if(ret !== undefined)anObject(ret.call(iterator)); + throw e; + } + }; + +/***/ }), +/* 59 */ +/***/ (function(module, exports, __webpack_require__) { + + // check on default Array iterator + var Iterators = __webpack_require__(29) + , ITERATOR = __webpack_require__(47)('iterator') + , ArrayProto = Array.prototype; + + module.exports = function(it){ + return it !== undefined && (Iterators.Array === it || ArrayProto[ITERATOR] === it); + }; + +/***/ }), +/* 60 */ +/***/ (function(module, exports, __webpack_require__) { + + var classof = __webpack_require__(55) + , ITERATOR = __webpack_require__(47)('iterator') + , Iterators = __webpack_require__(29); + module.exports = __webpack_require__(14).getIteratorMethod = function(it){ + if(it != undefined)return it[ITERATOR] + || it['@@iterator'] + || Iterators[classof(it)]; + }; + +/***/ }), +/* 61 */ +/***/ (function(module, exports, __webpack_require__) { + + // 7.3.20 SpeciesConstructor(O, defaultConstructor) + var anObject = __webpack_require__(19) + , aFunction = __webpack_require__(16) + , SPECIES = __webpack_require__(47)('species'); + module.exports = function(O, D){ + var C = anObject(O).constructor, S; + return C === undefined || (S = anObject(C)[SPECIES]) == undefined ? D : aFunction(S); + }; + +/***/ }), +/* 62 */ +/***/ (function(module, exports, __webpack_require__) { + + var ctx = __webpack_require__(15) + , invoke = __webpack_require__(63) + , html = __webpack_require__(45) + , cel = __webpack_require__(24) + , global = __webpack_require__(13) + , process = global.process + , setTask = global.setImmediate + , clearTask = global.clearImmediate + , MessageChannel = global.MessageChannel + , counter = 0 + , queue = {} + , ONREADYSTATECHANGE = 'onreadystatechange' + , defer, channel, port; + var run = function(){ + var id = +this; + if(queue.hasOwnProperty(id)){ + var fn = queue[id]; + delete queue[id]; + fn(); + } + }; + var listener = function(event){ + run.call(event.data); + }; + // Node.js 0.9+ & IE10+ has setImmediate, otherwise: + if(!setTask || !clearTask){ + setTask = function setImmediate(fn){ + var args = [], i = 1; + while(arguments.length > i)args.push(arguments[i++]); + queue[++counter] = function(){ + invoke(typeof fn == 'function' ? fn : Function(fn), args); + }; + defer(counter); + return counter; + }; + clearTask = function clearImmediate(id){ + delete queue[id]; + }; + // Node.js 0.8- + if(__webpack_require__(37)(process) == 'process'){ + defer = function(id){ + process.nextTick(ctx(run, id, 1)); + }; + // Browsers with MessageChannel, includes WebWorkers + } else if(MessageChannel){ + channel = new MessageChannel; + port = channel.port2; + channel.port1.onmessage = listener; + defer = ctx(port.postMessage, port, 1); + // Browsers with postMessage, skip WebWorkers + // IE8 has postMessage, but it's sync & typeof its postMessage is 'object' + } else if(global.addEventListener && typeof postMessage == 'function' && !global.importScripts){ + defer = function(id){ + global.postMessage(id + '', '*'); + }; + global.addEventListener('message', listener, false); + // IE8- + } else if(ONREADYSTATECHANGE in cel('script')){ + defer = function(id){ + html.appendChild(cel('script'))[ONREADYSTATECHANGE] = function(){ + html.removeChild(this); + run.call(id); + }; + }; + // Rest old browsers + } else { + defer = function(id){ + setTimeout(ctx(run, id, 1), 0); + }; + } + } + module.exports = { + set: setTask, + clear: clearTask + }; + +/***/ }), +/* 63 */ +/***/ (function(module, exports) { + + // fast apply, http://jsperf.lnkit.com/fast-apply/5 + module.exports = function(fn, args, that){ + var un = that === undefined; + switch(args.length){ + case 0: return un ? fn() + : fn.call(that); + case 1: return un ? fn(args[0]) + : fn.call(that, args[0]); + case 2: return un ? fn(args[0], args[1]) + : fn.call(that, args[0], args[1]); + case 3: return un ? fn(args[0], args[1], args[2]) + : fn.call(that, args[0], args[1], args[2]); + case 4: return un ? fn(args[0], args[1], args[2], args[3]) + : fn.call(that, args[0], args[1], args[2], args[3]); + } return fn.apply(that, args); + }; + +/***/ }), +/* 64 */ +/***/ (function(module, exports, __webpack_require__) { + + var global = __webpack_require__(13) + , macrotask = __webpack_require__(62).set + , Observer = global.MutationObserver || global.WebKitMutationObserver + , process = global.process + , Promise = global.Promise + , isNode = __webpack_require__(37)(process) == 'process'; + + module.exports = function(){ + var head, last, notify; + + var flush = function(){ + var parent, fn; + if(isNode && (parent = process.domain))parent.exit(); + while(head){ + fn = head.fn; + head = head.next; + try { + fn(); + } catch(e){ + if(head)notify(); + else last = undefined; + throw e; + } + } last = undefined; + if(parent)parent.enter(); + }; + + // Node.js + if(isNode){ + notify = function(){ + process.nextTick(flush); + }; + // browsers with MutationObserver + } else if(Observer){ + var toggle = true + , node = document.createTextNode(''); + new Observer(flush).observe(node, {characterData: true}); // eslint-disable-line no-new + notify = function(){ + node.data = toggle = !toggle; + }; + // environments with maybe non-completely correct, but existent Promise + } else if(Promise && Promise.resolve){ + var promise = Promise.resolve(); + notify = function(){ + promise.then(flush); + }; + // for other environments - macrotask based on: + // - setImmediate + // - MessageChannel + // - window.postMessag + // - onreadystatechange + // - setTimeout + } else { + notify = function(){ + // strange IE + webpack dev server bug - use .call(global) + macrotask.call(global, flush); + }; + } + + return function(fn){ + var task = {fn: fn, next: undefined}; + if(last)last.next = task; + if(!head){ + head = task; + notify(); + } last = task; + }; + }; + +/***/ }), +/* 65 */ +/***/ (function(module, exports, __webpack_require__) { + + var hide = __webpack_require__(17); + module.exports = function(target, src, safe){ + for(var key in src){ + if(safe && target[key])target[key] = src[key]; + else hide(target, key, src[key]); + } return target; + }; + +/***/ }), +/* 66 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + var global = __webpack_require__(13) + , core = __webpack_require__(14) + , dP = __webpack_require__(18) + , DESCRIPTORS = __webpack_require__(22) + , SPECIES = __webpack_require__(47)('species'); + + module.exports = function(KEY){ + var C = typeof core[KEY] == 'function' ? core[KEY] : global[KEY]; + if(DESCRIPTORS && C && !C[SPECIES])dP.f(C, SPECIES, { + configurable: true, + get: function(){ return this; } + }); + }; + +/***/ }), +/* 67 */ +/***/ (function(module, exports, __webpack_require__) { + + var ITERATOR = __webpack_require__(47)('iterator') + , SAFE_CLOSING = false; + + try { + var riter = [7][ITERATOR](); + riter['return'] = function(){ SAFE_CLOSING = true; }; + Array.from(riter, function(){ throw 2; }); + } catch(e){ /* empty */ } + + module.exports = function(exec, skipClosing){ + if(!skipClosing && !SAFE_CLOSING)return false; + var safe = false; + try { + var arr = [7] + , iter = arr[ITERATOR](); + iter.next = function(){ return {done: safe = true}; }; + arr[ITERATOR] = function(){ return iter; }; + exec(arr); + } catch(e){ /* empty */ } + return safe; + }; + +/***/ }), +/* 68 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _command = __webpack_require__(69); + + var _command2 = _interopRequireDefault(_command); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + var commands = {}; + + /** + * Create a command + * @param {string} name - Command name + * @param {...*} args - Arguments for creating command + * @returns {Command} + * @ignore + */ + /** + * @author NHN Ent. FE Development Team + * @fileoverview Command factory + */ + function create(name) { + var actions = commands[name]; + if (actions) { + for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { + args[_key - 1] = arguments[_key]; + } + + return new _command2.default(actions, args); + } + + return null; + } + + /** + * Register a command with name as a key + * @param {Object} command - {name:{string}, execute: {function}, undo: {function}} + * @param {string} command.name - command name + * @param {function} command.execute - executable function + * @param {function} command.undo - undo function + * @ignore + */ + function register(command) { + commands[command.name] = command; + } + + module.exports = { + create: create, + register: register + }; + +/***/ }), +/* 69 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); /** + * @author NHN Ent. FE Development Team + * @fileoverview Command interface + */ + + + var _errorMessage = __webpack_require__(70); + + var _errorMessage2 = _interopRequireDefault(_errorMessage); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + var createMessage = _errorMessage2.default.create; + var errorTypes = _errorMessage2.default.types; + + /** + * Command class + * @class + * @param {{name:function, execute: function, undo: function, + * executeCallback: function, undoCallback: function}} actions - Command actions + * @param {Array} args - passing arguments on execute, undo + * @ignore + */ + + var Command = function () { + function Command(actions, args) { + _classCallCheck(this, Command); + + /** + * command name + * @type {string} + */ + this.name = actions.name; + + /** + * arguments + * @type {Array} + */ + this.args = args; + + /** + * Execute function + * @type {function} + */ + this.execute = actions.execute; + + /** + * Undo function + * @type {function} + */ + this.undo = actions.undo; + + /** + * executeCallback + * @type {function} + */ + this.executeCallback = actions.executeCallback || null; + + /** + * undoCallback + * @type {function} + */ + this.undoCallback = actions.undoCallback || null; + + /** + * data for undo + * @type {Object} + */ + this.undoData = {}; + } + + /** + * Execute action + * @param {Object.} compMap - Components injection + * @abstract + */ + + + _createClass(Command, [{ + key: 'execute', + value: function execute() { + throw new Error(createMessage(errorTypes.UN_IMPLEMENTATION, 'execute')); + } + + /** + * Undo action + * @param {Object.} compMap - Components injection + * @abstract + */ + + }, { + key: 'undo', + value: function undo() { + throw new Error(createMessage(errorTypes.UN_IMPLEMENTATION, 'undo')); + } + + /** + * Attach execute callabck + * @param {function} callback - Callback after execution + * @returns {Command} this + */ + + }, { + key: 'setExecuteCallback', + value: function setExecuteCallback(callback) { + this.executeCallback = callback; + + return this; + } + + /** + * Attach undo callback + * @param {function} callback - Callback after undo + * @returns {Command} this + */ + + }, { + key: 'setUndoCallback', + value: function setUndoCallback(callback) { + this.undoCallback = callback; + + return this; + } + }]); + + return Command; + }(); + + module.exports = Command; + +/***/ }), +/* 70 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _tuiCodeSnippet = __webpack_require__(2); + + var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + + var _util = __webpack_require__(71); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + /** + * @author NHN Ent. FE Development Team + * @fileoverview Error-message factory + */ + var types = (0, _util.keyMirror)('UN_IMPLEMENTATION', 'NO_COMPONENT_NAME'); + var messages = { + UN_IMPLEMENTATION: 'Should implement a method: ', + NO_COMPONENT_NAME: 'Should set a component name' + }; + var map = { + UN_IMPLEMENTATION: function UN_IMPLEMENTATION(methodName) { + return messages.UN_IMPLEMENTATION + methodName; + }, + NO_COMPONENT_NAME: function NO_COMPONENT_NAME() { + return messages.NO_COMPONENT_NAME; + } + }; + + module.exports = { + types: _tuiCodeSnippet2.default.extend({}, types), + + create: function create(type) { + type = type.toLowerCase(); + var func = map[type]; + + for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { + args[_key - 1] = arguments[_key]; + } + + return func.apply(undefined, args); + } + }; + +/***/ }), +/* 71 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _tuiCodeSnippet = __webpack_require__(2); + + var min = Math.min, + max = Math.max; /** + * @author NHN Ent. FE Development Team + * @fileoverview Util + */ + + module.exports = { + /** + * Clamp value + * @param {number} value - Value + * @param {number} minValue - Minimum value + * @param {number} maxValue - Maximum value + * @returns {number} clamped value + */ + clamp: function clamp(value, minValue, maxValue) { + var temp = void 0; + if (minValue > maxValue) { + temp = minValue; + minValue = maxValue; + maxValue = temp; + } + + return max(minValue, min(value, maxValue)); + }, + + + /** + * Make key-value object from arguments + * @returns {object.} + */ + keyMirror: function keyMirror() { + var obj = {}; + + for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; + } + + (0, _tuiCodeSnippet.forEach)(args, function (key) { + obj[key] = key; + }); + + return obj; + }, + + + /** + * Make CSSText + * @param {Object} styleObj - Style info object + * @returns {string} Connected string of style + */ + makeStyleText: function makeStyleText(styleObj) { + var styleStr = ''; + + (0, _tuiCodeSnippet.forEach)(styleObj, function (value, prop) { + styleStr += prop + ': ' + value + ';'; + }); + + return styleStr; + }, + + + /** + * Get object's properties + * @param {Object} obj - object + * @param {Array} keys - keys + * @returns {Object} properties object + */ + getProperties: function getProperties(obj, keys) { + var props = {}; + var length = keys.length; + + var i = 0; + var key = void 0; + + for (i = 0; i < length; i += 1) { + key = keys[i]; + props[key] = obj[key]; + } + + return props; + } + }; + +/***/ }), +/* 72 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _util = __webpack_require__(71); + + var _util2 = _interopRequireDefault(_util); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + module.exports = { + /** + * Component names + * @type {Object.} + */ + componentNames: _util2.default.keyMirror('IMAGE_LOADER', 'CROPPER', 'FLIP', 'ROTATION', 'FREE_DRAWING', 'LINE', 'TEXT', 'ICON', 'FILTER', 'SHAPE'), + + /** + * Command names + * @type {Object.} + */ + commandNames: { + 'CLEAR_OBJECTS': 'clearObjects', + 'LOAD_IMAGE': 'loadImage', + 'FLIP_IMAGE': 'flip', + 'ROTATE_IMAGE': 'rotate', + 'ADD_OBJECT': 'addObject', + 'REMOVE_OBJECT': 'removeObject', + 'APPLY_FILTER': 'applyFilter', + 'REMOVE_FILTER': 'removeFilter', + 'ADD_ICON': 'addIcon', + 'CHANGE_ICON_COLOR': 'changeIconColor', + 'ADD_SHAPE': 'addShape', + 'CHANGE_SHAPE': 'changeShape', + 'ADD_TEXT': 'addText', + 'CHANGE_TEXT': 'changeText', + 'CHANGE_TEXT_STYLE': 'changeTextStyle', + 'ADD_IMAGE_OBJECT': 'addImageObject', + 'RESIZE_CANVAS_DIMENSION': 'resizeCanvasDimension', + 'SET_OBJECT_PROPERTIES': 'setObjectProperties', + 'SET_OBJECT_POSITION': 'setObjectPosition' + }, + + /** + * Event names + * @type {Object.} + */ + eventNames: { + OBJECT_ACTIVATED: 'objectActivated', + OBJECT_MOVED: 'objectMoved', + OBJECT_SCALED: 'objectScaled', + TEXT_EDITING: 'textEditing', + TEXT_CHANGED: 'textChanged', + ADD_TEXT: 'addText', + ADD_OBJECT: 'addObject', + MOUSE_DOWN: 'mousedown', + // UNDO/REDO Events + REDO_STACK_CHANGED: 'redoStackChanged', + UNDO_STACK_CHANGED: 'undoStackChanged' + }, + + /** + * Editor states + * @type {Object.} + */ + drawingModes: _util2.default.keyMirror('NORMAL', 'CROPPER', 'FREE_DRAWING', 'LINE_DRAWING', 'TEXT', 'SHAPE'), + + /** + * Shortcut key values + * @type {Object.} + */ + keyCodes: { + Z: 90, + Y: 89, + SHIFT: 16, + BACKSPACE: 8, + DEL: 46 + }, + + /** + * Fabric object options + * @type {Object.} + */ + fObjectOptions: { + SELECTION_STYLE: { + borderColor: 'red', + cornerColor: 'green', + cornerSize: 10, + originX: 'center', + originY: 'center', + transparentCorners: false + } + }, + + /** + * Promise reject messages + * @type {Object.} + */ + rejectMessages: { + flip: 'The flipX and flipY setting values are not changed.', + rotation: 'The current angle is same the old angle.', + loadImage: 'The background image is empty.', + isLock: 'The executing command state is locked.', + undo: 'The promise of undo command is reject.', + redo: 'The promise of redo command is reject.', + invalidDrawingMode: 'This operation is not supported in the drawing mode', + invalidParameters: 'Invalid parameters', + noActiveObject: 'There is no active object.', + unsupportedType: 'Unsupported object type', + noObject: 'The object is not in canvas.', + addedObject: 'The object is already added.' + } + }; /** + * @author NHN Ent. FE Development Team + * @fileoverview Constants + */ + +/***/ }), +/* 73 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); /** + * @author NHN Ent. FE Development Team + * @fileoverview Graphics module + */ + + + var _tuiCodeSnippet = __webpack_require__(2); + + var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _fabric = __webpack_require__(74); + + var _imageLoader = __webpack_require__(75); + + var _imageLoader2 = _interopRequireDefault(_imageLoader); + + var _cropper = __webpack_require__(77); + + var _cropper2 = _interopRequireDefault(_cropper); + + var _flip = __webpack_require__(79); + + var _flip2 = _interopRequireDefault(_flip); + + var _rotation = __webpack_require__(80); + + var _rotation2 = _interopRequireDefault(_rotation); + + var _freeDrawing = __webpack_require__(81); + + var _freeDrawing2 = _interopRequireDefault(_freeDrawing); + + var _line = __webpack_require__(82); + + var _line2 = _interopRequireDefault(_line); + + var _text = __webpack_require__(83); + + var _text2 = _interopRequireDefault(_text); + + var _icon = __webpack_require__(84); + + var _icon2 = _interopRequireDefault(_icon); + + var _filter = __webpack_require__(85); + + var _filter2 = _interopRequireDefault(_filter); + + var _shape = __webpack_require__(91); + + var _shape2 = _interopRequireDefault(_shape); + + var _cropper3 = __webpack_require__(93); + + var _cropper4 = _interopRequireDefault(_cropper3); + + var _freeDrawing3 = __webpack_require__(95); + + var _freeDrawing4 = _interopRequireDefault(_freeDrawing3); + + var _lineDrawing = __webpack_require__(96); + + var _lineDrawing2 = _interopRequireDefault(_lineDrawing); + + var _shape3 = __webpack_require__(97); + + var _shape4 = _interopRequireDefault(_shape3); + + var _text3 = __webpack_require__(98); + + var _text4 = _interopRequireDefault(_text3); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + var _util = __webpack_require__(71); + + var _util2 = _interopRequireDefault(_util); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + var components = _consts2.default.componentNames; + var events = _consts2.default.eventNames; + var drawingModes = _consts2.default.drawingModes, + fObjectOptions = _consts2.default.fObjectOptions; + var extend = _tuiCodeSnippet2.default.extend, + stamp = _tuiCodeSnippet2.default.stamp, + isArray = _tuiCodeSnippet2.default.isArray, + isString = _tuiCodeSnippet2.default.isString, + forEachArray = _tuiCodeSnippet2.default.forEachArray, + forEachOwnProperties = _tuiCodeSnippet2.default.forEachOwnProperties, + CustomEvents = _tuiCodeSnippet2.default.CustomEvents; + + + var DEFAULT_CSS_MAX_WIDTH = 1000; + var DEFAULT_CSS_MAX_HEIGHT = 800; + + var cssOnly = { + cssOnly: true + }; + var backstoreOnly = { + backstoreOnly: true + }; + + /** + * Graphics class + * @class + * @param {string|jQuery|HTMLElement} wrapper - Wrapper's element or selector + * @param {Object} [option] - Canvas max width & height of css + * @param {number} option.cssMaxWidth - Canvas css-max-width + * @param {number} option.cssMaxHeight - Canvas css-max-height + * @ignore + */ + + var Graphics = function () { + function Graphics(element, cssMaxWidth, cssMaxHeight) { + _classCallCheck(this, Graphics); + + /** + * Fabric image instance + * @type {fabric.Image} + */ + this.canvasImage = null; + + /** + * Max width of canvas elements + * @type {number} + */ + this.cssMaxWidth = cssMaxWidth || DEFAULT_CSS_MAX_WIDTH; + + /** + * Max height of canvas elements + * @type {number} + */ + this.cssMaxHeight = cssMaxHeight || DEFAULT_CSS_MAX_HEIGHT; + + /** + * Image name + * @type {string} + */ + this.imageName = ''; + + /** + * Object Map + * @type {Object} + * @private + */ + this._objects = {}; + + /** + * Fabric-Canvas instance + * @type {fabric.Canvas} + * @private + */ + this._canvas = null; + + /** + * Drawing mode + * @type {string} + * @private + */ + this._drawingMode = drawingModes.NORMAL; + + /** + * DrawingMode map + * @type {Object.} + * @private + */ + this._drawingModeMap = {}; + + /** + * Component map + * @type {Object.} + * @private + */ + this._componentMap = {}; + + /** + * fabric event handlers + * @type {Object.} + * @private + */ + this._handler = { + onMouseDown: this._onMouseDown.bind(this), + onObjectAdded: this._onObjectAdded.bind(this), + onObjectRemoved: this._onObjectRemoved.bind(this), + onObjectMoved: this._onObjectMoved.bind(this), + onObjectScaled: this._onObjectScaled.bind(this), + onObjectSelected: this._onObjectSelected.bind(this), + onPathCreated: this._onPathCreated.bind(this) + }; + + this._setCanvasElement(element); + this._createDrawingModeInstances(); + this._createComponents(); + this._attachCanvasEvents(); + } + + /** + * Destroy canvas element + */ + + + _createClass(Graphics, [{ + key: 'destroy', + value: function destroy() { + var wrapperEl = this._canvas.wrapperEl; + + + this._canvas.clear(); + + wrapperEl.parentNode.removeChild(wrapperEl); + } + + /** + * Deactivates all objects on canvas + * @returns {Graphics} this + */ + + }, { + key: 'deactivateAll', + value: function deactivateAll() { + this._canvas.deactivateAll(); + + return this; + } + + /** + * Renders all objects on canvas + * @returns {Graphics} this + */ + + }, { + key: 'renderAll', + value: function renderAll() { + this._canvas.renderAll(); + + return this; + } + + /** + * Adds objects on canvas + * @param {Object|Array} objects - objects + */ + + }, { + key: 'add', + value: function add(objects) { + var _canvas; + + var theArgs = []; + if (isArray(objects)) { + theArgs = objects; + } else { + theArgs.push(objects); + } + + (_canvas = this._canvas).add.apply(_canvas, theArgs); + } + /** + * Removes the object or group + * @param {Object} target - graphics object or group + * @returns {boolean} true if contains or false + */ + + }, { + key: 'contains', + value: function contains(target) { + return this._canvas.contains(target); + } + + /** + * Gets all objects or group + * @returns {Array} all objects, shallow copy + */ + + }, { + key: 'getObjects', + value: function getObjects() { + return this._canvas.getObjects().slice(); + } + + /** + * Get an object by id + * @param {number} id - object id + * @returns {fabric.Object} object corresponding id + */ + + }, { + key: 'getObject', + value: function getObject(id) { + return this._objects[id]; + } + + /** + * Removes the object or group + * @param {Object} target - graphics object or group + */ + + }, { + key: 'remove', + value: function remove(target) { + this._canvas.remove(target); + } + + /** + * Removes all object or group + * @param {boolean} includesBackground - remove the background image or not + * @returns {Array} all objects array which is removed + */ + + }, { + key: 'removeAll', + value: function removeAll(includesBackground) { + var canvas = this._canvas; + var objects = canvas.getObjects().slice(); + canvas.remove.apply(canvas, this._canvas.getObjects()); + + if (includesBackground) { + canvas.clear(); + } + + return objects; + } + + /** + * Removes an object or group by id + * @param {number} id - object id + * @returns {Array} removed objects + */ + + }, { + key: 'removeObjectById', + value: function removeObjectById(id) { + var objects = []; + var canvas = this._canvas; + var target = this.getObject(id); + var isValidGroup = target && target.isType('group') && !target.isEmpty(); + + if (isValidGroup) { + canvas.discardActiveGroup(); // restore states for each objects + target.forEachObject(function (obj) { + objects.push(obj); + obj.remove(); + }); + } else if (canvas.contains(target)) { + objects.push(target); + target.remove(); + } + + return objects; + } + + /** + * Get an id by object instance + * @param {fabric.Object} object object + * @returns {number} object id if it exists or null + */ + + }, { + key: 'getObjectId', + value: function getObjectId(object) { + var key = null; + for (key in this._objects) { + if (this._objects.hasOwnProperty(key)) { + if (object === this._objects[key]) { + return key; + } + } + } + + return null; + } + + /** + * Gets an active object or group + * @returns {Object} active object or group instance + */ + + }, { + key: 'getActiveObject', + value: function getActiveObject() { + return this._canvas.getActiveObject(); + } + + /** + * Activates an object or group + * @param {Object} target - target object or group + */ + + }, { + key: 'setActiveObject', + value: function setActiveObject(target) { + this._canvas.setActiveObject(target); + } + + /** + * Get component + * @param {string} name - Component name + * @returns {Component} + */ + + }, { + key: 'getComponent', + value: function getComponent(name) { + return this._componentMap[name]; + } + + /** + * Get current drawing mode + * @returns {string} + */ + + }, { + key: 'getDrawingMode', + value: function getDrawingMode() { + return this._drawingMode; + } + + /** + * Start a drawing mode. If the current mode is not 'NORMAL', 'stopDrawingMode()' will be called first. + * @param {String} mode Can be one of 'CROPPER', 'FREE_DRAWING', 'LINE', 'TEXT', 'SHAPE' + * @param {Object} [option] parameters of drawing mode, it's available with 'FREE_DRAWING', 'LINE_DRAWING' + * @param {Number} [option.width] brush width + * @param {String} [option.color] brush color + * @returns {boolean} true if success or false + */ + + }, { + key: 'startDrawingMode', + value: function startDrawingMode(mode, option) { + if (this._isSameDrawingMode(mode)) { + return true; + } + + // If the current mode is not 'NORMAL', 'stopDrawingMode()' will be called first. + this.stopDrawingMode(); + + var drawingModeInstance = this._getDrawingModeInstance(mode); + if (drawingModeInstance && drawingModeInstance.start) { + drawingModeInstance.start(this, option); + + this._drawingMode = mode; + } + + return !!drawingModeInstance; + } + /** + * Stop the current drawing mode and back to the 'NORMAL' mode + */ + + }, { + key: 'stopDrawingMode', + value: function stopDrawingMode() { + if (this._isSameDrawingMode(drawingModes.NORMAL)) { + return; + } + + var drawingModeInstance = this._getDrawingModeInstance(this.getDrawingMode()); + if (drawingModeInstance && drawingModeInstance.end) { + drawingModeInstance.end(this); + } + this._drawingMode = drawingModes.NORMAL; + } + + /** + * To data url from canvas + * @param {string} type - A DOMString indicating the image format. The default type is image/png. + * @returns {string} A DOMString containing the requested data URI. + */ + + }, { + key: 'toDataURL', + value: function toDataURL(type) { + return this._canvas && this._canvas.toDataURL(type); + } + + /** + * Save image(background) of canvas + * @param {string} name - Name of image + * @param {?fabric.Image} canvasImage - Fabric image instance + */ + + }, { + key: 'setCanvasImage', + value: function setCanvasImage(name, canvasImage) { + if (canvasImage) { + stamp(canvasImage); + } + this.imageName = name; + this.canvasImage = canvasImage; + } + + /** + * Set css max dimension + * @param {{width: number, height: number}} maxDimension - Max width & Max height + */ + + }, { + key: 'setCssMaxDimension', + value: function setCssMaxDimension(maxDimension) { + this.cssMaxWidth = maxDimension.width || this.cssMaxWidth; + this.cssMaxHeight = maxDimension.height || this.cssMaxHeight; + } + + /** + * Adjust canvas dimension with scaling image + */ + + }, { + key: 'adjustCanvasDimension', + value: function adjustCanvasDimension() { + var canvasImage = this.canvasImage.scale(1); + + var _canvasImage$getBound = canvasImage.getBoundingRect(), + width = _canvasImage$getBound.width, + height = _canvasImage$getBound.height; + + var maxDimension = this._calcMaxDimension(width, height); + + this.setCanvasCssDimension({ + width: '100%', + height: '100%', // Set height '' for IE9 + 'max-width': maxDimension.width + 'px', + 'max-height': maxDimension.height + 'px' + }); + + this.setCanvasBackstoreDimension({ + width: width, + height: height + }); + this._canvas.centerObject(canvasImage); + } + + /** + * Set canvas dimension - css only + * {@link http://fabricjs.com/docs/fabric.Canvas.html#setDimensions} + * @param {Object} dimension - Canvas css dimension + */ + + }, { + key: 'setCanvasCssDimension', + value: function setCanvasCssDimension(dimension) { + this._canvas.setDimensions(dimension, cssOnly); + } + + /** + * Set canvas dimension - backstore only + * {@link http://fabricjs.com/docs/fabric.Canvas.html#setDimensions} + * @param {Object} dimension - Canvas backstore dimension + */ + + }, { + key: 'setCanvasBackstoreDimension', + value: function setCanvasBackstoreDimension(dimension) { + this._canvas.setDimensions(dimension, backstoreOnly); + } + + /** + * Set image properties + * {@link http://fabricjs.com/docs/fabric.Image.html#set} + * @param {Object} setting - Image properties + * @param {boolean} [withRendering] - If true, The changed image will be reflected in the canvas + */ + + }, { + key: 'setImageProperties', + value: function setImageProperties(setting, withRendering) { + var canvasImage = this.canvasImage; + + + if (!canvasImage) { + return; + } + + canvasImage.set(setting).setCoords(); + if (withRendering) { + this._canvas.renderAll(); + } + } + + /** + * Returns canvas element of fabric.Canvas[[lower-canvas]] + * @returns {HTMLCanvasElement} + */ + + }, { + key: 'getCanvasElement', + value: function getCanvasElement() { + return this._canvas.getElement(); + } + + /** + * Get fabric.Canvas instance + * @returns {fabric.Canvas} + * @private + */ + + }, { + key: 'getCanvas', + value: function getCanvas() { + return this._canvas; + } + + /** + * Get canvasImage (fabric.Image instance) + * @returns {fabric.Image} + */ + + }, { + key: 'getCanvasImage', + value: function getCanvasImage() { + return this.canvasImage; + } + + /** + * Get image name + * @returns {string} + */ + + }, { + key: 'getImageName', + value: function getImageName() { + return this.imageName; + } + + /** + * Add image object on canvas + * @param {string} imgUrl - Image url to make object + * @returns {Promise} + */ + + }, { + key: 'addImageObject', + value: function addImageObject(imgUrl) { + var _this = this; + + var callback = this._callbackAfterLoadingImageObject.bind(this); + + return new _promise2.default(function (resolve) { + _fabric.fabric.Image.fromURL(imgUrl, function (image) { + callback(image); + resolve(_this.createObjectProperties(image)); + }, { + crossOrigin: 'Anonymous' + }); + }); + } + + /** + * Get center position of canvas + * @returns {Object} {left, top} + */ + + }, { + key: 'getCenter', + value: function getCenter() { + return this._canvas.getCenter(); + } + + /** + * Get cropped rect + * @returns {Object} rect + */ + + }, { + key: 'getCropzoneRect', + value: function getCropzoneRect() { + return this.getComponent(components.CROPPER).getCropzoneRect(); + } + + /** + * Get cropped image data + * @param {Object} cropRect cropzone rect + * @param {Number} cropRect.left left position + * @param {Number} cropRect.top top position + * @param {Number} cropRect.width width + * @param {Number} cropRect.height height + * @returns {?{imageName: string, url: string}} cropped Image data + */ + + }, { + key: 'getCroppedImageData', + value: function getCroppedImageData(cropRect) { + return this.getComponent(components.CROPPER).getCroppedImageData(cropRect); + } + + /** + * Set brush option + * @param {Object} option brush option + * @param {Number} option.width width + * @param {String} option.color color like 'FFFFFF', 'rgba(0, 0, 0, 0.5)' + */ + + }, { + key: 'setBrush', + value: function setBrush(option) { + var drawingMode = this._drawingMode; + var compName = components.FREE_DRAWING; + + if (drawingMode === drawingModes.LINE) { + compName = drawingModes.LINE; + } + + this.getComponent(compName).setBrush(option); + } + + /** + * Set states of current drawing shape + * @param {string} type - Shape type (ex: 'rect', 'circle', 'triangle') + * @param {Object} [options] - Shape options + * @param {string} [options.fill] - Shape foreground color (ex: '#fff', 'transparent') + * @param {string} [options.stoke] - Shape outline color + * @param {number} [options.strokeWidth] - Shape outline width + * @param {number} [options.width] - Width value (When type option is 'rect', this options can use) + * @param {number} [options.height] - Height value (When type option is 'rect', this options can use) + * @param {number} [options.rx] - Radius x value (When type option is 'circle', this options can use) + * @param {number} [options.ry] - Radius y value (When type option is 'circle', this options can use) + * @param {number} [options.isRegular] - Whether resizing shape has 1:1 ratio or not + */ + + }, { + key: 'setDrawingShape', + value: function setDrawingShape(type, options) { + this.getComponent(components.SHAPE).setStates(type, options); + } + + /** + * Register icon paths + * @param {Object} pathInfos - Path infos + * @param {string} pathInfos.key - key + * @param {string} pathInfos.value - value + */ + + }, { + key: 'registerPaths', + value: function registerPaths(pathInfos) { + this.getComponent(components.ICON).registerPaths(pathInfos); + } + + /** + * Whether it has the filter or not + * @param {string} type - Filter type + * @returns {boolean} true if it has the filter + */ + + }, { + key: 'hasFilter', + value: function hasFilter(type) { + return this.getComponent(components.FILTER).hasFilter(type); + } + + /** + * Set selection style of fabric object by init option + * @param {Object} styles - Selection styles + */ + + }, { + key: 'setSelectionStyle', + value: function setSelectionStyle(styles) { + extend(fObjectOptions.SELECTION_STYLE, styles); + } + + /** + * Set object properties + * @param {number} id - object id + * @param {Object} props - props + * @param {string} [props.fill] Color + * @param {string} [props.fontFamily] Font type for text + * @param {number} [props.fontSize] Size + * @param {string} [props.fontStyle] Type of inclination (normal / italic) + * @param {string} [props.fontWeight] Type of thicker or thinner looking (normal / bold) + * @param {string} [props.textAlign] Type of text align (left / center / right) + * @param {string} [props.textDecoraiton] Type of line (underline / line-throgh / overline) + * @returns {Object} applied properties + */ + + }, { + key: 'setObjectProperties', + value: function setObjectProperties(id, props) { + var object = this.getObject(id); + var clone = extend({}, props); + + object.set(clone); + + this.getCanvas().renderAll(); + + return clone; + } + + /** + * Get object properties corresponding key + * @param {number} id - object id + * @param {Array|ObjectProps|string} keys - property's key + * @returns {Object} properties + */ + + }, { + key: 'getObjectProperties', + value: function getObjectProperties(id, keys) { + var object = this.getObject(id); + var props = {}; + + if (isString(keys)) { + props[keys] = object[keys]; + } else if (isArray(keys)) { + forEachArray(keys, function (value) { + props[value] = object[value]; + }); + } else { + forEachOwnProperties(keys, function (value, key) { + props[key] = object[key]; + }); + } + + return props; + } + + /** + * Get object position by originX, originY + * @param {number} id - object id + * @param {string} originX - can be 'left', 'center', 'right' + * @param {string} originY - can be 'top', 'center', 'bottom' + * @returns {Object} {{x:number, y: number}} position by origin if id is valid, or null + */ + + }, { + key: 'getObjectPosition', + value: function getObjectPosition(id, originX, originY) { + var targetObj = this.getObject(id); + if (!targetObj) { + return null; + } + + return targetObj.getPointByOrigin(originX, originY); + } + + /** + * Set object position by originX, originY + * @param {number} id - object id + * @param {Object} posInfo - position object + * @param {number} posInfo.x - x position + * @param {number} posInfo.y - y position + * @param {string} posInfo.originX - can be 'left', 'center', 'right' + * @param {string} posInfo.originY - can be 'top', 'center', 'bottom' + * @returns {boolean} true if target id is valid or false + */ + + }, { + key: 'setObjectPosition', + value: function setObjectPosition(id, posInfo) { + var targetObj = this.getObject(id); + var x = posInfo.x, + y = posInfo.y, + originX = posInfo.originX, + originY = posInfo.originY; + + if (!targetObj) { + return false; + } + + var targetOrigin = targetObj.getPointByOrigin(originX, originY); + var centerOrigin = targetObj.getPointByOrigin('center', 'center'); + var diffX = centerOrigin.x - targetOrigin.x; + var diffY = centerOrigin.y - targetOrigin.y; + + targetObj.set({ + left: x + diffX, + top: y + diffY + }); + + return true; + } + + /** + * Get the canvas size + * @returns {Object} {{width: number, height: number}} image size + */ + + }, { + key: 'getCanvasSize', + value: function getCanvasSize() { + var image = this.getCanvasImage(); + + return { + width: image ? image.width : 0, + height: image ? image.height : 0 + }; + } + + /** + * Get a DrawingMode instance + * @param {string} modeName - DrawingMode Class Name + * @returns {DrawingMode} DrawingMode instance + * @private + */ + + }, { + key: '_getDrawingModeInstance', + value: function _getDrawingModeInstance(modeName) { + return this._drawingModeMap[modeName]; + } + + /** + * Set canvas element to fabric.Canvas + * @param {jQuery|Element|string} element - Wrapper or canvas element or selector + * @private + */ + + }, { + key: '_setCanvasElement', + value: function _setCanvasElement(element) { + var selectedElement = void 0; + var canvasElement = void 0; + + if (element.jquery) { + selectedElement = element[0]; + } else if (element.nodeType) { + selectedElement = element; + } else { + selectedElement = document.querySelector(element); + } + + if (selectedElement.nodeName.toUpperCase() !== 'CANVAS') { + canvasElement = document.createElement('canvas'); + selectedElement.appendChild(canvasElement); + } + + this._canvas = new _fabric.fabric.Canvas(canvasElement, { + containerClass: 'tui-image-editor-canvas-container', + enableRetinaScaling: false + }); + } + + /** + * Creates DrawingMode instances + * @private + */ + + }, { + key: '_createDrawingModeInstances', + value: function _createDrawingModeInstances() { + this._register(this._drawingModeMap, new _cropper4.default()); + this._register(this._drawingModeMap, new _freeDrawing4.default()); + this._register(this._drawingModeMap, new _lineDrawing2.default()); + this._register(this._drawingModeMap, new _shape4.default()); + this._register(this._drawingModeMap, new _text4.default()); + } + + /** + * Create components + * @private + */ + + }, { + key: '_createComponents', + value: function _createComponents() { + this._register(this._componentMap, new _imageLoader2.default(this)); + this._register(this._componentMap, new _cropper2.default(this)); + this._register(this._componentMap, new _flip2.default(this)); + this._register(this._componentMap, new _rotation2.default(this)); + this._register(this._componentMap, new _freeDrawing2.default(this)); + this._register(this._componentMap, new _line2.default(this)); + this._register(this._componentMap, new _text2.default(this)); + this._register(this._componentMap, new _icon2.default(this)); + this._register(this._componentMap, new _filter2.default(this)); + this._register(this._componentMap, new _shape2.default(this)); + } + + /** + * Register component + * @param {Object} map - map object + * @param {Object} module - module which has getName method + * @private + */ + + }, { + key: '_register', + value: function _register(map, module) { + map[module.getName()] = module; + } + + /** + * Get the current drawing mode is same with given mode + * @param {string} mode drawing mode + * @returns {boolean} true if same or false + */ + + }, { + key: '_isSameDrawingMode', + value: function _isSameDrawingMode(mode) { + return this.getDrawingMode() === mode; + } + + /** + * Calculate max dimension of canvas + * The css-max dimension is dynamically decided with maintaining image ratio + * The css-max dimension is lower than canvas dimension (attribute of canvas, not css) + * @param {number} width - Canvas width + * @param {number} height - Canvas height + * @returns {{width: number, height: number}} - Max width & Max height + * @private + */ + + }, { + key: '_calcMaxDimension', + value: function _calcMaxDimension(width, height) { + var wScaleFactor = this.cssMaxWidth / width; + var hScaleFactor = this.cssMaxHeight / height; + var cssMaxWidth = Math.min(width, this.cssMaxWidth); + var cssMaxHeight = Math.min(height, this.cssMaxHeight); + + if (wScaleFactor < 1 && wScaleFactor < hScaleFactor) { + cssMaxWidth = width * wScaleFactor; + cssMaxHeight = height * wScaleFactor; + } else if (hScaleFactor < 1 && hScaleFactor < wScaleFactor) { + cssMaxWidth = width * hScaleFactor; + cssMaxHeight = height * hScaleFactor; + } + + return { + width: Math.floor(cssMaxWidth), + height: Math.floor(cssMaxHeight) + }; + } + + /** + * Callback function after loading image + * @param {fabric.Image} obj - Fabric image object + * @private + */ + + }, { + key: '_callbackAfterLoadingImageObject', + value: function _callbackAfterLoadingImageObject(obj) { + var centerPos = this.getCanvasImage().getCenterPoint(); + + obj.set(_consts2.default.fObjectOptions.SELECTION_STYLE); + obj.set({ + left: centerPos.x, + top: centerPos.y, + crossOrigin: 'Anonymous' + }); + + this.getCanvas().add(obj).setActiveObject(obj); + } + + /** + * Attach canvas's events + */ + + }, { + key: '_attachCanvasEvents', + value: function _attachCanvasEvents() { + var canvas = this._canvas; + var handler = this._handler; + canvas.on({ + 'mouse:down': handler.onMouseDown, + 'object:added': handler.onObjectAdded, + 'object:removed': handler.onObjectRemoved, + 'object:moving': handler.onObjectMoved, + 'object:scaling': handler.onObjectScaled, + 'object:selected': handler.onObjectSelected, + 'path:created': handler.onPathCreated + }); + } + + /** + * "mouse:down" canvas event handler + * @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event + * @private + */ + + }, { + key: '_onMouseDown', + value: function _onMouseDown(fEvent) { + var originPointer = this._canvas.getPointer(fEvent.e); + this.fire(events.MOUSE_DOWN, fEvent.e, originPointer); + } + + /** + * "object:added" canvas event handler + * @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event + * @private + */ + + }, { + key: '_onObjectAdded', + value: function _onObjectAdded(fEvent) { + var obj = fEvent.target; + if (obj.isType('cropzone')) { + return; + } + + this._addFabricObject(obj); + } + + /** + * "object:removed" canvas event handler + * @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event + * @private + */ + + }, { + key: '_onObjectRemoved', + value: function _onObjectRemoved(fEvent) { + var obj = fEvent.target; + + this._removeFabricObject(stamp(obj)); + } + + /** + * "object:moving" canvas event handler + * @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event + * @private + */ + + }, { + key: '_onObjectMoved', + value: function _onObjectMoved(fEvent) { + var target = fEvent.target; + + var params = this.createObjectProperties(target); + + this.fire(events.OBJECT_MOVED, params); + } + + /** + * "object:scaling" canvas event handler + * @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event + * @private + */ + + }, { + key: '_onObjectScaled', + value: function _onObjectScaled(fEvent) { + var target = fEvent.target; + + var params = this.createObjectProperties(target); + + this.fire(events.OBJECT_SCALED, params); + } + + /** + * "object:selected" canvas event handler + * @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event + * @private + */ + + }, { + key: '_onObjectSelected', + value: function _onObjectSelected(fEvent) { + var target = fEvent.target; + + var params = this.createObjectProperties(target); + + this.fire(events.OBJECT_ACTIVATED, params); + } + + /** + * "path:created" canvas event handler + * @param {{path: fabric.Path}} obj - Path object + * @private + */ + + }, { + key: '_onPathCreated', + value: function _onPathCreated(obj) { + obj.path.set(_consts2.default.fObjectOptions.SELECTION_STYLE); + + var params = this.createObjectProperties(obj.path); + + this.fire(events.ADD_OBJECT, params); + } + + /** + * Return object's properties + * @param {fabric.Object} obj - fabric object + * @returns {Object} properties object + */ + + }, { + key: 'createObjectProperties', + value: function createObjectProperties(obj) { + var predefinedKeys = ['left', 'top', 'width', 'height', 'fill', 'stroke', 'strokeWidth', 'opacity']; + var props = { + id: stamp(obj), + type: obj.type + }; + + extend(props, _util2.default.getProperties(obj, predefinedKeys)); + + if (obj.type === 'text') { + extend(props, this._createTextProperties(obj, props)); + } + + return props; + } + + /** + * Get text object's properties + * @param {fabric.Object} obj - fabric text object + * @param {Object} props - properties + * @returns {Object} properties object + */ + + }, { + key: '_createTextProperties', + value: function _createTextProperties(obj) { + var predefinedKeys = ['text', 'fontFamily', 'fontSize', 'fontStyle', 'textAlign', 'textDecoration']; + var props = {}; + extend(props, _util2.default.getProperties(obj, predefinedKeys)); + + return props; + } + + /** + * Add object array by id + * @param {fabric.Object} obj - fabric object + * @returns {number} object id + */ + + }, { + key: '_addFabricObject', + value: function _addFabricObject(obj) { + var id = stamp(obj); + this._objects[id] = obj; + + return id; + } + + /** + * Remove an object in array yb id + * @param {number} id - object id + */ + + }, { + key: '_removeFabricObject', + value: function _removeFabricObject(id) { + delete this._objects[id]; + } + }]); + + return Graphics; + }(); + + CustomEvents.mixin(Graphics); + module.exports = Graphics; + +/***/ }), +/* 74 */ +/***/ (function(module, exports) { + + module.exports = __WEBPACK_EXTERNAL_MODULE_74__; + +/***/ }), +/* 75 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _component = __webpack_require__(76); + + var _component2 = _interopRequireDefault(_component); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /** + * @author NHN Ent. FE Development Team + * @fileoverview Image loader + */ + + + var componentNames = _consts2.default.componentNames, + rejectMessages = _consts2.default.rejectMessages; + + var imageOption = { + padding: 0, + crossOrigin: 'Anonymous' + }; + + /** + * ImageLoader components + * @extends {Component} + * @class ImageLoader + * @param {Graphics} graphics - Graphics instance + * @ignore + */ + + var ImageLoader = function (_Component) { + _inherits(ImageLoader, _Component); + + function ImageLoader(graphics) { + _classCallCheck(this, ImageLoader); + + return _possibleConstructorReturn(this, (ImageLoader.__proto__ || Object.getPrototypeOf(ImageLoader)).call(this, componentNames.IMAGE_LOADER, graphics)); + } + + /** + * Load image from url + * @param {?string} imageName - File name + * @param {?(fabric.Image|string)} img - fabric.Image instance or URL of an image + * @returns {jQuery.Deferred} deferred + */ + + + _createClass(ImageLoader, [{ + key: 'load', + value: function load(imageName, img) { + var _this2 = this; + + var promise = void 0; + + if (!imageName && !img) { + // Back to the initial state, not error. + var canvas = this.getCanvas(); + + canvas.backgroundImage = null; + canvas.renderAll(); + + promise = new _promise2.default(function (resolve) { + _this2.setCanvasImage('', null); + resolve(); + }); + } else { + promise = this._setBackgroundImage(img).then(function (oImage) { + _this2.setCanvasImage(imageName, oImage); + _this2.adjustCanvasDimension(); + + return oImage; + }); + } + + return promise; + } + + /** + * Set background image + * @param {?(fabric.Image|String)} img fabric.Image instance or URL of an image to set background to + * @returns {$.Deferred} deferred + * @private + */ + + }, { + key: '_setBackgroundImage', + value: function _setBackgroundImage(img) { + var _this3 = this; + + if (!img) { + return _promise2.default.reject(rejectMessages.loadImage); + } + + return new _promise2.default(function (resolve, reject) { + var canvas = _this3.getCanvas(); + + canvas.setBackgroundImage(img, function () { + var oImage = canvas.backgroundImage; + + if (oImage.getElement()) { + resolve(oImage); + } else { + reject(rejectMessages.loadingImageFailed); + } + }, imageOption); + }); + } + }]); + + return ImageLoader; + }(_component2.default); + + module.exports = ImageLoader; + +/***/ }), +/* 76 */ +/***/ (function(module, exports) { + + "use strict"; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + /** + * @author NHN Ent. FE Development Team + * @fileoverview Component interface + */ + + /** + * Component interface + * @class + * @param {string} name - component name + * @param {Graphics} graphics - Graphics instance + * @ignore + */ + var Component = function () { + function Component(name, graphics) { + _classCallCheck(this, Component); + + /** + * Component name + * @type {string} + */ + this.name = name; + + /** + * Graphics instance + * @type {Graphics} + */ + this.graphics = graphics; + } + + /** + * Fire Graphics event + * @param {Array} args - arguments + * @returns {Object} return value + */ + + + _createClass(Component, [{ + key: "fire", + value: function fire() { + var context = this.graphics; + + for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; + } + + return this.graphics.fire.apply(context, args); + } + + /** + * Save image(background) of canvas + * @param {string} name - Name of image + * @param {fabric.Image} oImage - Fabric image instance + */ + + }, { + key: "setCanvasImage", + value: function setCanvasImage(name, oImage) { + this.graphics.setCanvasImage(name, oImage); + } + + /** + * Returns canvas element of fabric.Canvas[[lower-canvas]] + * @returns {HTMLCanvasElement} + */ + + }, { + key: "getCanvasElement", + value: function getCanvasElement() { + return this.graphics.getCanvasElement(); + } + + /** + * Get fabric.Canvas instance + * @returns {fabric.Canvas} + */ + + }, { + key: "getCanvas", + value: function getCanvas() { + return this.graphics.getCanvas(); + } + + /** + * Get canvasImage (fabric.Image instance) + * @returns {fabric.Image} + */ + + }, { + key: "getCanvasImage", + value: function getCanvasImage() { + return this.graphics.getCanvasImage(); + } + + /** + * Get image name + * @returns {string} + */ + + }, { + key: "getImageName", + value: function getImageName() { + return this.graphics.getImageName(); + } + + /** + * Get image editor + * @returns {ImageEditor} + */ + + }, { + key: "getEditor", + value: function getEditor() { + return this.graphics.getEditor(); + } + + /** + * Return component name + * @returns {string} + */ + + }, { + key: "getName", + value: function getName() { + return this.name; + } + + /** + * Set image properties + * @param {Object} setting - Image properties + * @param {boolean} [withRendering] - If true, The changed image will be reflected in the canvas + */ + + }, { + key: "setImageProperties", + value: function setImageProperties(setting, withRendering) { + this.graphics.setImageProperties(setting, withRendering); + } + + /** + * Set canvas dimension - css only + * @param {Object} dimension - Canvas css dimension + */ + + }, { + key: "setCanvasCssDimension", + value: function setCanvasCssDimension(dimension) { + this.graphics.setCanvasCssDimension(dimension); + } + + /** + * Set canvas dimension - css only + * @param {Object} dimension - Canvas backstore dimension + */ + + }, { + key: "setCanvasBackstoreDimension", + value: function setCanvasBackstoreDimension(dimension) { + this.graphics.setCanvasBackstoreDimension(dimension); + } + + /** + * Adjust canvas dimension with scaling image + */ + + }, { + key: "adjustCanvasDimension", + value: function adjustCanvasDimension() { + this.graphics.adjustCanvasDimension(); + } + }]); + + return Component; + }(); + + module.exports = Component; + +/***/ }), +/* 77 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _fabric = __webpack_require__(74); + + var _component = __webpack_require__(76); + + var _component2 = _interopRequireDefault(_component); + + var _cropzone = __webpack_require__(78); + + var _cropzone2 = _interopRequireDefault(_cropzone); + + var _consts = __webpack_require__(72); + + var _util = __webpack_require__(71); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /** + * @author NHN Ent. FE Development Team + * @fileoverview Image crop module (start cropping, end cropping) + */ + + + var MOUSE_MOVE_THRESHOLD = 10; + + /** + * Cropper components + * @param {Graphics} graphics - Graphics instance + * @extends {Component} + * @class Cropper + * @ignore + */ + + var Cropper = function (_Component) { + _inherits(Cropper, _Component); + + function Cropper(graphics) { + _classCallCheck(this, Cropper); + + /** + * Cropzone + * @type {Cropzone} + * @private + */ + var _this = _possibleConstructorReturn(this, (Cropper.__proto__ || Object.getPrototypeOf(Cropper)).call(this, _consts.componentNames.CROPPER, graphics)); + + _this._cropzone = null; + + /** + * StartX of Cropzone + * @type {number} + * @private + */ + _this._startX = null; + + /** + * StartY of Cropzone + * @type {number} + * @private + */ + _this._startY = null; + + /** + * State whether shortcut key is pressed or not + * @type {boolean} + * @private + */ + _this._withShiftKey = false; + + /** + * Listeners + * @type {object.} + * @private + */ + _this._listeners = { + keydown: _this._onKeyDown.bind(_this), + keyup: _this._onKeyUp.bind(_this), + mousedown: _this._onFabricMouseDown.bind(_this), + mousemove: _this._onFabricMouseMove.bind(_this), + mouseup: _this._onFabricMouseUp.bind(_this) + }; + return _this; + } + + /** + * Start cropping + */ + + + _createClass(Cropper, [{ + key: 'start', + value: function start() { + if (this._cropzone) { + return; + } + var canvas = this.getCanvas(); + canvas.forEachObject(function (obj) { + // {@link http://fabricjs.com/docs/fabric.Object.html#evented} + obj.evented = false; + }); + this._cropzone = new _cropzone2.default({ + left: -10, + top: -10, + width: 1, + height: 1, + strokeWidth: 0, // {@link https://github.com/kangax/fabric.js/issues/2860} + cornerSize: 10, + cornerColor: 'black', + fill: 'transparent', + hasRotatingPoint: false, + hasBorders: false, + lockScalingFlip: true, + lockRotation: true + }); + canvas.deactivateAll(); + canvas.add(this._cropzone); + canvas.on('mouse:down', this._listeners.mousedown); + canvas.selection = false; + canvas.defaultCursor = 'crosshair'; + + _fabric.fabric.util.addListener(document, 'keydown', this._listeners.keydown); + _fabric.fabric.util.addListener(document, 'keyup', this._listeners.keyup); + } + + /** + * End cropping + */ + + }, { + key: 'end', + value: function end() { + var canvas = this.getCanvas(); + var cropzone = this._cropzone; + + if (!cropzone) { + return; + } + cropzone.remove(); + canvas.selection = true; + canvas.defaultCursor = 'default'; + canvas.off('mouse:down', this._listeners.mousedown); + canvas.forEachObject(function (obj) { + obj.evented = true; + }); + + this._cropzone = null; + + _fabric.fabric.util.removeListener(document, 'keydown', this._listeners.keydown); + _fabric.fabric.util.removeListener(document, 'keyup', this._listeners.keyup); + } + + /** + * onMousedown handler in fabric canvas + * @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event + * @private + */ + + }, { + key: '_onFabricMouseDown', + value: function _onFabricMouseDown(fEvent) { + var canvas = this.getCanvas(); + + if (fEvent.target) { + return; + } + + canvas.selection = false; + var coord = canvas.getPointer(fEvent.e); + + this._startX = coord.x; + this._startY = coord.y; + + canvas.on({ + 'mouse:move': this._listeners.mousemove, + 'mouse:up': this._listeners.mouseup + }); + } + + /** + * onMousemove handler in fabric canvas + * @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event + * @private + */ + + }, { + key: '_onFabricMouseMove', + value: function _onFabricMouseMove(fEvent) { + var canvas = this.getCanvas(); + var pointer = canvas.getPointer(fEvent.e); + var x = pointer.x, + y = pointer.y; + + var cropzone = this._cropzone; + + if (Math.abs(x - this._startX) + Math.abs(y - this._startY) > MOUSE_MOVE_THRESHOLD) { + cropzone.remove(); + cropzone.set(this._calcRectDimensionFromPoint(x, y)); + + canvas.add(cropzone); + } + } + + /** + * Get rect dimension setting from Canvas-Mouse-Position(x, y) + * @param {number} x - Canvas-Mouse-Position x + * @param {number} y - Canvas-Mouse-Position Y + * @returns {{left: number, top: number, width: number, height: number}} + * @private + */ + + }, { + key: '_calcRectDimensionFromPoint', + value: function _calcRectDimensionFromPoint(x, y) { + var canvas = this.getCanvas(); + var canvasWidth = canvas.getWidth(); + var canvasHeight = canvas.getHeight(); + var startX = this._startX; + var startY = this._startY; + var left = (0, _util.clamp)(x, 0, startX); + var top = (0, _util.clamp)(y, 0, startY); + var width = (0, _util.clamp)(x, startX, canvasWidth) - left; // (startX <= x(mouse) <= canvasWidth) - left + var height = (0, _util.clamp)(y, startY, canvasHeight) - top; // (startY <= y(mouse) <= canvasHeight) - top + + if (this._withShiftKey) { + // make fixed ratio cropzone + if (width > height) { + height = width; + } else if (height > width) { + width = height; + } + + if (startX >= x) { + left = startX - width; + } + + if (startY >= y) { + top = startY - height; + } + } + + return { + left: left, + top: top, + width: width, + height: height + }; + } + + /** + * onMouseup handler in fabric canvas + * @private + */ + + }, { + key: '_onFabricMouseUp', + value: function _onFabricMouseUp() { + var cropzone = this._cropzone; + var listeners = this._listeners; + var canvas = this.getCanvas(); + + canvas.setActiveObject(cropzone); + canvas.off({ + 'mouse:move': listeners.mousemove, + 'mouse:up': listeners.mouseup + }); + } + + /** + * Get cropped image data + * @param {Object} cropRect cropzone rect + * @param {Number} cropRect.left left position + * @param {Number} cropRect.top top position + * @param {Number} cropRect.width width + * @param {Number} cropRect.height height + * @returns {?{imageName: string, url: string}} cropped Image data + */ + + }, { + key: 'getCroppedImageData', + value: function getCroppedImageData(cropRect) { + var canvas = this.getCanvas(); + var containsCropzone = canvas.contains(this._cropzone); + if (!cropRect) { + return null; + } + + if (containsCropzone) { + this._cropzone.remove(); + } + + var imageData = { + imageName: this.getImageName(), + url: canvas.toDataURL(cropRect) + }; + + if (containsCropzone) { + canvas.add(this._cropzone); + } + + return imageData; + } + + /** + * Get cropped rect + * @returns {Object} rect + */ + + }, { + key: 'getCropzoneRect', + value: function getCropzoneRect() { + var cropzone = this._cropzone; + + if (!cropzone.isValid()) { + return null; + } + + return { + left: cropzone.getLeft(), + top: cropzone.getTop(), + width: cropzone.getWidth(), + height: cropzone.getHeight() + }; + } + + /** + * Keydown event handler + * @param {KeyboardEvent} e - Event object + * @private + */ + + }, { + key: '_onKeyDown', + value: function _onKeyDown(e) { + if (e.keyCode === _consts.keyCodes.SHIFT) { + this._withShiftKey = true; + } + } + + /** + * Keyup event handler + * @param {KeyboardEvent} e - Event object + * @private + */ + + }, { + key: '_onKeyUp', + value: function _onKeyUp(e) { + if (e.keyCode === _consts.keyCodes.SHIFT) { + this._withShiftKey = false; + } + } + }]); + + return Cropper; + }(_component2.default); + + module.exports = Cropper; + +/***/ }), +/* 78 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _tuiCodeSnippet = __webpack_require__(2); + + var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + + var _fabric = __webpack_require__(74); + + var _util = __webpack_require__(71); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + var CORNER_TYPE_TOP_LEFT = 'tl'; /** + * @author NHN Ent. FE Development Team + * @fileoverview Cropzone extending fabric.Rect + */ + + var CORNER_TYPE_TOP_RIGHT = 'tr'; + var CORNER_TYPE_MIDDLE_TOP = 'mt'; + var CORNER_TYPE_MIDDLE_LEFT = 'ml'; + var CORNER_TYPE_MIDDLE_RIGHT = 'mr'; + var CORNER_TYPE_MIDDLE_BOTTOM = 'mb'; + var CORNER_TYPE_BOTTOM_LEFT = 'bl'; + var CORNER_TYPE_BOTTOM_RIGHT = 'br'; + + /** + * Cropzone object + * Issue: IE7, 8(with excanvas) + * - Cropzone is a black zone without transparency. + * @class Cropzone + * @extends {fabric.Rect} + * @ignore + */ + var Cropzone = _fabric.fabric.util.createClass(_fabric.fabric.Rect, /** @lends Cropzone.prototype */{ + /** + * Constructor + * @param {Object} options Options object + * @override + */ + initialize: function initialize(options) { + options.type = 'cropzone'; + this.callSuper('initialize', options); + this.on({ + 'moving': this._onMoving, + 'scaling': this._onScaling + }); + }, + + + /** + * Render Crop-zone + * @param {CanvasRenderingContext2D} ctx - Context + * @private + * @override + */ + _render: function _render(ctx) { + var cropzoneDashLineWidth = 7; + var cropzoneDashLineOffset = 7; + this.callSuper('_render', ctx); + + // Calc original scale + var originalFlipX = this.flipX ? -1 : 1; + var originalFlipY = this.flipY ? -1 : 1; + var originalScaleX = originalFlipX / this.scaleX; + var originalScaleY = originalFlipY / this.scaleY; + + // Set original scale + ctx.scale(originalScaleX, originalScaleY); + + // Render outer rect + this._fillOuterRect(ctx, 'rgba(0, 0, 0, 0.55)'); + + // Black dash line + this._strokeBorder(ctx, 'rgb(0, 0, 0)', cropzoneDashLineWidth); + + // White dash line + this._strokeBorder(ctx, 'rgb(255, 255, 255)', cropzoneDashLineWidth, cropzoneDashLineOffset); + + // Reset scale + ctx.scale(1 / originalScaleX, 1 / originalScaleY); + }, + + + /** + * Cropzone-coordinates with outer rectangle + * + * x0 x1 x2 x3 + * y0 +--------------------------+ + * |///////|//////////|///////| // <--- "Outer-rectangle" + * |///////|//////////|///////| + * y1 +-------+----------+-------+ + * |///////| Cropzone |///////| Cropzone is the "Inner-rectangle" + * |///////| (0, 0) |///////| Center point (0, 0) + * y2 +-------+----------+-------+ + * |///////|//////////|///////| + * |///////|//////////|///////| + * y3 +--------------------------+ + * + * @typedef {{x: Array, y: Array}} cropzoneCoordinates + * @ignore + */ + + /** + * Fill outer rectangle + * @param {CanvasRenderingContext2D} ctx - Context + * @param {string|CanvasGradient|CanvasPattern} fillStyle - Fill-style + * @private + */ + _fillOuterRect: function _fillOuterRect(ctx, fillStyle) { + var _getCoordinates = this._getCoordinates(ctx), + x = _getCoordinates.x, + y = _getCoordinates.y; + + ctx.save(); + ctx.fillStyle = fillStyle; + ctx.beginPath(); + + // Outer rectangle + // Numbers are +/-1 so that overlay edges don't get blurry. + ctx.moveTo(x[0] - 1, y[0] - 1); + ctx.lineTo(x[3] + 1, y[0] - 1); + ctx.lineTo(x[3] + 1, y[3] + 1); + ctx.lineTo(x[0] - 1, y[3] - 1); + ctx.lineTo(x[0] - 1, y[0] - 1); + ctx.closePath(); + + // Inner rectangle + ctx.moveTo(x[1], y[1]); + ctx.lineTo(x[1], y[2]); + ctx.lineTo(x[2], y[2]); + ctx.lineTo(x[2], y[1]); + ctx.lineTo(x[1], y[1]); + ctx.closePath(); + + ctx.fill(); + ctx.restore(); + }, + + + /** + * Get coordinates + * @param {CanvasRenderingContext2D} ctx - Context + * @returns {cropzoneCoordinates} - {@link cropzoneCoordinates} + * @private + */ + _getCoordinates: function _getCoordinates(ctx) { + var width = this.getWidth(), + height = this.getHeight(), + halfWidth = width / 2, + halfHeight = height / 2, + left = this.getLeft(), + top = this.getTop(), + canvasEl = ctx.canvas; // canvas element, not fabric object + + return { + x: _tuiCodeSnippet2.default.map([-(halfWidth + left), // x0 + -halfWidth, // x1 + halfWidth, // x2 + halfWidth + (canvasEl.width - left - width) // x3 + ], Math.ceil), + y: _tuiCodeSnippet2.default.map([-(halfHeight + top), // y0 + -halfHeight, // y1 + halfHeight, // y2 + halfHeight + (canvasEl.height - top - height) // y3 + ], Math.ceil) + }; + }, + + + /** + * Stroke border + * @param {CanvasRenderingContext2D} ctx - Context + * @param {string|CanvasGradient|CanvasPattern} strokeStyle - Stroke-style + * @param {number} lineDashWidth - Dash width + * @param {number} [lineDashOffset] - Dash offset + * @private + */ + _strokeBorder: function _strokeBorder(ctx, strokeStyle, lineDashWidth, lineDashOffset) { + var halfWidth = this.getWidth() / 2, + halfHeight = this.getHeight() / 2; + + ctx.save(); + ctx.strokeStyle = strokeStyle; + if (ctx.setLineDash) { + ctx.setLineDash([lineDashWidth, lineDashWidth]); + } + if (lineDashOffset) { + ctx.lineDashOffset = lineDashOffset; + } + + ctx.beginPath(); + ctx.moveTo(-halfWidth, -halfHeight); + ctx.lineTo(halfWidth, -halfHeight); + ctx.lineTo(halfWidth, halfHeight); + ctx.lineTo(-halfWidth, halfHeight); + ctx.lineTo(-halfWidth, -halfHeight); + ctx.stroke(); + + ctx.restore(); + }, + + + /** + * onMoving event listener + * @private + */ + _onMoving: function _onMoving() { + var left = this.getLeft(), + top = this.getTop(), + width = this.getWidth(), + height = this.getHeight(), + maxLeft = this.canvas.getWidth() - width, + maxTop = this.canvas.getHeight() - height; + + this.setLeft((0, _util.clamp)(left, 0, maxLeft)); + this.setTop((0, _util.clamp)(top, 0, maxTop)); + }, + + + /** + * onScaling event listener + * @param {{e: MouseEvent}} fEvent - Fabric event + * @private + */ + _onScaling: function _onScaling(fEvent) { + var pointer = this.canvas.getPointer(fEvent.e), + settings = this._calcScalingSizeFromPointer(pointer); + + // On scaling cropzone, + // change real width and height and fix scaleFactor to 1 + this.scale(1).set(settings); + }, + + + /** + * Calc scaled size from mouse pointer with selected corner + * @param {{x: number, y: number}} pointer - Mouse position + * @returns {Object} Having left or(and) top or(and) width or(and) height. + * @private + */ + _calcScalingSizeFromPointer: function _calcScalingSizeFromPointer(pointer) { + var pointerX = pointer.x, + pointerY = pointer.y, + tlScalingSize = this._calcTopLeftScalingSizeFromPointer(pointerX, pointerY), + brScalingSize = this._calcBottomRightScalingSizeFromPointer(pointerX, pointerY); + + /* + * @todo: 일반 객체에서 shift 조합키를 누르면 free size scaling이 됨 --> 확인해볼것 + * canvas.class.js // _scaleObject: function(...){...} + */ + return this._makeScalingSettings(tlScalingSize, brScalingSize); + }, + + + /** + * Calc scaling size(position + dimension) from left-top corner + * @param {number} x - Mouse position X + * @param {number} y - Mouse position Y + * @returns {{top: number, left: number, width: number, height: number}} + * @private + */ + _calcTopLeftScalingSizeFromPointer: function _calcTopLeftScalingSizeFromPointer(x, y) { + var bottom = this.getHeight() + this.top, + right = this.getWidth() + this.left, + top = (0, _util.clamp)(y, 0, bottom - 1), + // 0 <= top <= (bottom - 1) + left = (0, _util.clamp)(x, 0, right - 1); // 0 <= left <= (right - 1) + + // When scaling "Top-Left corner": It fixes right and bottom coordinates + return { + top: top, + left: left, + width: right - left, + height: bottom - top + }; + }, + + + /** + * Calc scaling size from right-bottom corner + * @param {number} x - Mouse position X + * @param {number} y - Mouse position Y + * @returns {{width: number, height: number}} + * @private + */ + _calcBottomRightScalingSizeFromPointer: function _calcBottomRightScalingSizeFromPointer(x, y) { + var _canvas = this.canvas, + maxX = _canvas.width, + maxY = _canvas.height; + var left = this.left, + top = this.top; + + // When scaling "Bottom-Right corner": It fixes left and top coordinates + + return { + width: (0, _util.clamp)(x, left + 1, maxX) - left, // (width = x - left), (left + 1 <= x <= maxX) + height: (0, _util.clamp)(y, top + 1, maxY) - top // (height = y - top), (top + 1 <= y <= maxY) + }; + }, + + + /* eslint-disable complexity */ + /** + * Make scaling settings + * @param {{width: number, height: number, left: number, top: number}} tl - Top-Left setting + * @param {{width: number, height: number}} br - Bottom-Right setting + * @returns {{width: ?number, height: ?number, left: ?number, top: ?number}} Position setting + * @private + */ + _makeScalingSettings: function _makeScalingSettings(tl, br) { + var tlWidth = tl.width; + var tlHeight = tl.height; + var brHeight = br.height; + var brWidth = br.width; + var tlLeft = tl.left; + var tlTop = tl.top; + var settings = void 0; + + switch (this.__corner) { + case CORNER_TYPE_TOP_LEFT: + settings = tl; + break; + case CORNER_TYPE_TOP_RIGHT: + settings = { + width: brWidth, + height: tlHeight, + top: tlTop + }; + break; + case CORNER_TYPE_BOTTOM_LEFT: + settings = { + width: tlWidth, + height: brHeight, + left: tlLeft + }; + break; + case CORNER_TYPE_BOTTOM_RIGHT: + settings = br; + break; + case CORNER_TYPE_MIDDLE_LEFT: + settings = { + width: tlWidth, + left: tlLeft + }; + break; + case CORNER_TYPE_MIDDLE_TOP: + settings = { + height: tlHeight, + top: tlTop + }; + break; + case CORNER_TYPE_MIDDLE_RIGHT: + settings = { + width: brWidth + }; + break; + case CORNER_TYPE_MIDDLE_BOTTOM: + settings = { + height: brHeight + }; + break; + default: + break; + } + + return settings; + }, + /* eslint-enable complexity */ + + /** + * Return the whether this cropzone is valid + * @returns {boolean} + */ + isValid: function isValid() { + return this.left >= 0 && this.top >= 0 && this.width > 0 && this.height > 0; + } + }); + + module.exports = Cropzone; + +/***/ }), +/* 79 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _tuiCodeSnippet = __webpack_require__(2); + + var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _component = __webpack_require__(76); + + var _component2 = _interopRequireDefault(_component); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /** + * @author NHN Ent. FE Development Team + * @fileoverview Image flip module + */ + + + var componentNames = _consts2.default.componentNames, + rejectMessages = _consts2.default.rejectMessages; + + /** + * Flip + * @class Flip + * @param {Graphics} graphics - Graphics instance + * @extends {Component} + * @ignore + */ + + var Flip = function (_Component) { + _inherits(Flip, _Component); + + function Flip(graphics) { + _classCallCheck(this, Flip); + + return _possibleConstructorReturn(this, (Flip.__proto__ || Object.getPrototypeOf(Flip)).call(this, componentNames.FLIP, graphics)); + } + + /** + * Get current flip settings + * @returns {{flipX: Boolean, flipY: Boolean}} + */ + + + _createClass(Flip, [{ + key: 'getCurrentSetting', + value: function getCurrentSetting() { + var canvasImage = this.getCanvasImage(); + + return { + flipX: canvasImage.flipX, + flipY: canvasImage.flipY + }; + } + + /** + * Set flipX, flipY + * @param {{flipX: Boolean, flipY: Boolean}} newSetting - Flip setting + * @returns {jQuery.Deferred} + */ + + }, { + key: 'set', + value: function set(newSetting) { + var setting = this.getCurrentSetting(); + var isChangingFlipX = setting.flipX !== newSetting.flipX; + var isChangingFlipY = setting.flipY !== newSetting.flipY; + + if (!isChangingFlipX && !isChangingFlipY) { + return _promise2.default.reject(rejectMessages.flip); + } + + _tuiCodeSnippet2.default.extend(setting, newSetting); + this.setImageProperties(setting, true); + this._invertAngle(isChangingFlipX, isChangingFlipY); + this._flipObjects(isChangingFlipX, isChangingFlipY); + + return _promise2.default.resolve({ + flipX: setting.flipX, + flipY: setting.flipY, + angle: this.getCanvasImage().angle + }); + } + + /** + * Invert image angle for flip + * @param {boolean} isChangingFlipX - Change flipX + * @param {boolean} isChangingFlipY - Change flipY + */ + + }, { + key: '_invertAngle', + value: function _invertAngle(isChangingFlipX, isChangingFlipY) { + var canvasImage = this.getCanvasImage(); + var angle = canvasImage.angle; + + + if (isChangingFlipX) { + angle *= -1; + } + if (isChangingFlipY) { + angle *= -1; + } + canvasImage.setAngle(parseFloat(angle)).setCoords(); // parseFloat for -0 to 0 + } + + /** + * Flip objects + * @param {boolean} isChangingFlipX - Change flipX + * @param {boolean} isChangingFlipY - Change flipY + * @private + */ + + }, { + key: '_flipObjects', + value: function _flipObjects(isChangingFlipX, isChangingFlipY) { + var canvas = this.getCanvas(); + + if (isChangingFlipX) { + canvas.forEachObject(function (obj) { + obj.set({ + angle: parseFloat(obj.angle * -1), // parseFloat for -0 to 0 + flipX: !obj.flipX, + left: canvas.width - obj.left + }).setCoords(); + }); + } + if (isChangingFlipY) { + canvas.forEachObject(function (obj) { + obj.set({ + angle: parseFloat(obj.angle * -1), // parseFloat for -0 to 0 + flipY: !obj.flipY, + top: canvas.height - obj.top + }).setCoords(); + }); + } + canvas.renderAll(); + } + + /** + * Reset flip settings + * @returns {jQuery.Deferred} + */ + + }, { + key: 'reset', + value: function reset() { + return this.set({ + flipX: false, + flipY: false + }); + } + + /** + * Flip x + * @returns {jQuery.Deferred} + */ + + }, { + key: 'flipX', + value: function flipX() { + var current = this.getCurrentSetting(); + + return this.set({ + flipX: !current.flipX, + flipY: current.flipY + }); + } + + /** + * Flip y + * @returns {jQuery.Deferred} + */ + + }, { + key: 'flipY', + value: function flipY() { + var current = this.getCurrentSetting(); + + return this.set({ + flipX: current.flipX, + flipY: !current.flipY + }); + } + }]); + + return Flip; + }(_component2.default); + + module.exports = Flip; + +/***/ }), +/* 80 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _fabric = __webpack_require__(74); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _component = __webpack_require__(76); + + var _component2 = _interopRequireDefault(_component); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /** + * @author NHN Ent. FE Development Team + * @fileoverview Image rotation module + */ + + + var componentNames = _consts2.default.componentNames; + + /** + * Image Rotation component + * @class Rotation + * @extends {Component} + * @param {Graphics} graphics - Graphics instance + * @ignore + */ + + var Rotation = function (_Component) { + _inherits(Rotation, _Component); + + function Rotation(graphics) { + _classCallCheck(this, Rotation); + + return _possibleConstructorReturn(this, (Rotation.__proto__ || Object.getPrototypeOf(Rotation)).call(this, componentNames.ROTATION, graphics)); + } + + /** + * Get current angle + * @returns {Number} + */ + + + _createClass(Rotation, [{ + key: 'getCurrentAngle', + value: function getCurrentAngle() { + return this.getCanvasImage().angle; + } + + /** + * Set angle of the image + * + * Do not call "this.setImageProperties" for setting angle directly. + * Before setting angle, The originX,Y of image should be set to center. + * See "http://fabricjs.com/docs/fabric.Object.html#setAngle" + * + * @param {number} angle - Angle value + * @returns {jQuery.Deferred} + */ + + }, { + key: 'setAngle', + value: function setAngle(angle) { + var oldAngle = this.getCurrentAngle() % 360; // The angle is lower than 2*PI(===360 degrees) + + angle %= 360; + + var canvasImage = this.getCanvasImage(); + var oldImageCenter = canvasImage.getCenterPoint(); + canvasImage.setAngle(angle).setCoords(); + this.adjustCanvasDimension(); + var newImageCenter = canvasImage.getCenterPoint(); + this._rotateForEachObject(oldImageCenter, newImageCenter, angle - oldAngle); + + return _promise2.default.resolve(angle); + } + + /** + * Rotate for each object + * @param {fabric.Point} oldImageCenter - Image center point before rotation + * @param {fabric.Point} newImageCenter - Image center point after rotation + * @param {number} angleDiff - Image angle difference after rotation + * @private + */ + + }, { + key: '_rotateForEachObject', + value: function _rotateForEachObject(oldImageCenter, newImageCenter, angleDiff) { + var canvas = this.getCanvas(); + var centerDiff = { + x: oldImageCenter.x - newImageCenter.x, + y: oldImageCenter.y - newImageCenter.y + }; + + canvas.forEachObject(function (obj) { + var objCenter = obj.getCenterPoint(); + var radian = _fabric.fabric.util.degreesToRadians(angleDiff); + var newObjCenter = _fabric.fabric.util.rotatePoint(objCenter, oldImageCenter, radian); + + obj.set({ + left: newObjCenter.x - centerDiff.x, + top: newObjCenter.y - centerDiff.y, + angle: (obj.angle + angleDiff) % 360 + }); + obj.setCoords(); + }); + canvas.renderAll(); + } + + /** + * Rotate the image + * @param {number} additionalAngle - Additional angle + * @returns {jQuery.Deferred} + */ + + }, { + key: 'rotate', + value: function rotate(additionalAngle) { + var current = this.getCurrentAngle(); + + return this.setAngle(current + additionalAngle); + } + }]); + + return Rotation; + }(_component2.default); + + module.exports = Rotation; + +/***/ }), +/* 81 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _fabric = __webpack_require__(74); + + var _component = __webpack_require__(76); + + var _component2 = _interopRequireDefault(_component); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /** + * @author NHN Ent. FE Development Team + * @fileoverview Free drawing module, Set brush + */ + + + /** + * FreeDrawing + * @class FreeDrawing + * @param {Graphics} graphics - Graphics instance + * @extends {Component} + * @ignore + */ + var FreeDrawing = function (_Component) { + _inherits(FreeDrawing, _Component); + + function FreeDrawing(graphics) { + _classCallCheck(this, FreeDrawing); + + /** + * Brush width + * @type {number} + */ + var _this = _possibleConstructorReturn(this, (FreeDrawing.__proto__ || Object.getPrototypeOf(FreeDrawing)).call(this, _consts2.default.componentNames.FREE_DRAWING, graphics)); + + _this.width = 12; + + /** + * fabric.Color instance for brush color + * @type {fabric.Color} + */ + _this.oColor = new _fabric.fabric.Color('rgba(0, 0, 0, 0.5)'); + return _this; + } + + /** + * Start free drawing mode + * @param {{width: ?number, color: ?string}} [setting] - Brush width & color + */ + + + _createClass(FreeDrawing, [{ + key: 'start', + value: function start(setting) { + var canvas = this.getCanvas(); + + canvas.isDrawingMode = true; + this.setBrush(setting); + } + + /** + * Set brush + * @param {{width: ?number, color: ?string}} [setting] - Brush width & color + */ + + }, { + key: 'setBrush', + value: function setBrush(setting) { + var brush = this.getCanvas().freeDrawingBrush; + + setting = setting || {}; + this.width = setting.width || this.width; + if (setting.color) { + this.oColor = new _fabric.fabric.Color(setting.color); + } + brush.width = this.width; + brush.color = this.oColor.toRgba(); + } + + /** + * End free drawing mode + */ + + }, { + key: 'end', + value: function end() { + var canvas = this.getCanvas(); + + canvas.isDrawingMode = false; + } + }]); + + return FreeDrawing; + }(_component2.default); + + module.exports = FreeDrawing; + +/***/ }), +/* 82 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _fabric = __webpack_require__(74); + + var _component = __webpack_require__(76); + + var _component2 = _interopRequireDefault(_component); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /** + * @author NHN Ent. FE Development Team + * @fileoverview Free drawing module, Set brush + */ + + + var eventNames = _consts2.default.eventNames; + + /** + * Line + * @class Line + * @param {Graphics} graphics - Graphics instance + * @extends {Component} + * @ignore + */ + + var Line = function (_Component) { + _inherits(Line, _Component); + + function Line(graphics) { + _classCallCheck(this, Line); + + /** + * Brush width + * @type {number} + * @private + */ + var _this = _possibleConstructorReturn(this, (Line.__proto__ || Object.getPrototypeOf(Line)).call(this, _consts2.default.componentNames.LINE, graphics)); + + _this._width = 12; + + /** + * fabric.Color instance for brush color + * @type {fabric.Color} + * @private + */ + _this._oColor = new _fabric.fabric.Color('rgba(0, 0, 0, 0.5)'); + + /** + * Listeners + * @type {object.} + * @private + */ + _this._listeners = { + mousedown: _this._onFabricMouseDown.bind(_this), + mousemove: _this._onFabricMouseMove.bind(_this), + mouseup: _this._onFabricMouseUp.bind(_this) + }; + return _this; + } + + /** + * Start drawing line mode + * @param {{width: ?number, color: ?string}} [setting] - Brush width & color + */ + + + _createClass(Line, [{ + key: 'start', + value: function start(setting) { + var canvas = this.getCanvas(); + + canvas.defaultCursor = 'crosshair'; + canvas.selection = false; + + this.setBrush(setting); + + canvas.forEachObject(function (obj) { + obj.set({ + evented: false + }); + }); + + canvas.on({ + 'mouse:down': this._listeners.mousedown + }); + } + + /** + * Set brush + * @param {{width: ?number, color: ?string}} [setting] - Brush width & color + */ + + }, { + key: 'setBrush', + value: function setBrush(setting) { + var brush = this.getCanvas().freeDrawingBrush; + + setting = setting || {}; + this._width = setting.width || this._width; + + if (setting.color) { + this._oColor = new _fabric.fabric.Color(setting.color); + } + brush.width = this._width; + brush.color = this._oColor.toRgba(); + } + + /** + * End drawing line mode + */ + + }, { + key: 'end', + value: function end() { + var canvas = this.getCanvas(); + + canvas.defaultCursor = 'default'; + canvas.selection = true; + + canvas.forEachObject(function (obj) { + obj.set({ + evented: true + }); + }); + + canvas.off('mouse:down', this._listeners.mousedown); + } + + /** + * Mousedown event handler in fabric canvas + * @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event object + * @private + */ + + }, { + key: '_onFabricMouseDown', + value: function _onFabricMouseDown(fEvent) { + var canvas = this.getCanvas(); + var pointer = canvas.getPointer(fEvent.e); + var points = [pointer.x, pointer.y, pointer.x, pointer.y]; + + this._line = new _fabric.fabric.Line(points, { + stroke: this._oColor.toRgba(), + strokeWidth: this._width, + evented: false + }); + + this._line.set(_consts2.default.fObjectOptions.SELECTION_STYLE); + + canvas.add(this._line); + + canvas.on({ + 'mouse:move': this._listeners.mousemove, + 'mouse:up': this._listeners.mouseup + }); + } + + /** + * Mousemove event handler in fabric canvas + * @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event object + * @private + */ + + }, { + key: '_onFabricMouseMove', + value: function _onFabricMouseMove(fEvent) { + var canvas = this.getCanvas(); + var pointer = canvas.getPointer(fEvent.e); + + this._line.set({ + x2: pointer.x, + y2: pointer.y + }); + + this._line.setCoords(); + + canvas.renderAll(); + } + + /** + * Mouseup event handler in fabric canvas + * @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event object + * @private + */ + + }, { + key: '_onFabricMouseUp', + value: function _onFabricMouseUp() { + var canvas = this.getCanvas(); + var params = this.graphics.createObjectProperties(this._line); + + this.fire(eventNames.ADD_OBJECT, params); + + this._line = null; + + canvas.off({ + 'mouse:move': this._listeners.mousemove, + 'mouse:up': this._listeners.mouseup + }); + } + }]); + + return Line; + }(_component2.default); + + module.exports = Line; + +/***/ }), +/* 83 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _fabric = __webpack_require__(74); + + var _tuiCodeSnippet = __webpack_require__(2); + + var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _component = __webpack_require__(76); + + var _component2 = _interopRequireDefault(_component); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + var _util = __webpack_require__(71); + + var _util2 = _interopRequireDefault(_util); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /** + * @author NHN Ent. FE Development Team + * @fileoverview Text module + */ + + + var events = _consts2.default.eventNames; + + var defaultStyles = { + fill: '#000000', + left: 0, + top: 0 + }; + var resetStyles = { + fill: '#000000', + fontStyle: 'normal', + fontWeight: 'normal', + textAlign: 'left', + textDecoraiton: '' + }; + var browser = _tuiCodeSnippet2.default.browser; + + + var TEXTAREA_CLASSNAME = 'tui-image-eidtor-textarea'; + var TEXTAREA_STYLES = _util2.default.makeStyleText({ + position: 'absolute', + padding: 0, + display: 'none', + border: '1px dotted red', + overflow: 'hidden', + resize: 'none', + outline: 'none', + 'border-radius': 0, + 'background-color': 'transparent', + '-webkit-appearance': 'none', + 'z-index': 9999, + 'white-space': 'pre' + }); + var EXTRA_PIXEL_LINEHEIGHT = 0.1; + var DBCLICK_TIME = 500; + + /** + * Text + * @class Text + * @param {Graphics} graphics - Graphics instance + * @extends {Component} + * @ignore + */ + + var Text = function (_Component) { + _inherits(Text, _Component); + + function Text(graphics) { + _classCallCheck(this, Text); + + /** + * Default text style + * @type {Object} + */ + var _this = _possibleConstructorReturn(this, (Text.__proto__ || Object.getPrototypeOf(Text)).call(this, _consts2.default.componentNames.TEXT, graphics)); + + _this._defaultStyles = defaultStyles; + + /** + * Selected state + * @type {boolean} + */ + _this._isSelected = false; + + /** + * Selected text object + * @type {Object} + */ + _this._selectedObj = {}; + + /** + * Editing text object + * @type {Object} + */ + _this._editingObj = {}; + + /** + * Listeners for fabric event + * @type {Object} + */ + _this._listeners = { + mousedown: _this._onFabricMouseDown.bind(_this), + select: _this._onFabricSelect.bind(_this), + selectClear: _this._onFabricSelectClear.bind(_this), + scaling: _this._onFabricScaling.bind(_this) + }; + + /** + * Textarea element for editing + * @type {HTMLElement} + */ + _this._textarea = null; + + /** + * Ratio of current canvas + * @type {number} + */ + _this._ratio = 1; + + /** + * Last click time + * @type {Date} + */ + _this._lastClickTime = new Date().getTime(); + + /** + * Text object infos before editing + * @type {Object} + */ + _this._editingObjInfos = {}; + + /** + * Previous state of editing + * @type {boolean} + */ + _this.isPrevEditing = false; + return _this; + } + + /** + * Start input text mode + */ + + + _createClass(Text, [{ + key: 'start', + value: function start() { + var canvas = this.getCanvas(); + + canvas.selection = false; + canvas.defaultCursor = 'text'; + canvas.on({ + 'mouse:down': this._listeners.mousedown, + 'object:selected': this._listeners.select, + 'before:selection:cleared': this._listeners.selectClear, + 'object:scaling': this._listeners.scaling + }); + + this._createTextarea(); + + this.setCanvasRatio(); + } + + /** + * End input text mode + */ + + }, { + key: 'end', + value: function end() { + var canvas = this.getCanvas(); + + canvas.selection = true; + canvas.defaultCursor = 'default'; + canvas.deactivateAllWithDispatch(); // action for undo stack + canvas.off({ + 'mouse:down': this._listeners.mousedown, + 'object:selected': this._listeners.select, + 'before:selection:cleared': this._listeners.selectClear, + 'object:scaling': this._listeners.scaling + }); + + this._removeTextarea(); + } + + /** + * Add new text on canvas image + * @param {string} text - Initial input text + * @param {Object} options - Options for generating text + * @param {Object} [options.styles] Initial styles + * @param {string} [options.styles.fill] Color + * @param {string} [options.styles.fontFamily] Font type for text + * @param {number} [options.styles.fontSize] Size + * @param {string} [options.styles.fontStyle] Type of inclination (normal / italic) + * @param {string} [options.styles.fontWeight] Type of thicker or thinner looking (normal / bold) + * @param {string} [options.styles.textAlign] Type of text align (left / center / right) + * @param {string} [options.styles.textDecoraiton] Type of line (underline / line-throgh / overline) + * @param {{x: number, y: number}} [options.position] - Initial position + * @returns {Promise} + */ + + }, { + key: 'add', + value: function add(text, options) { + var _this2 = this; + + return new _promise2.default(function (resolve) { + var canvas = _this2.getCanvas(); + var styles = _this2._defaultStyles; + + _this2._setInitPos(options.position); + + if (options.styles) { + styles = _tuiCodeSnippet2.default.extend(options.styles, styles); + } + + var newText = new _fabric.fabric.Text(text, styles); + newText.set(_consts2.default.fObjectOptions.SELECTION_STYLE); + newText.on({ + mouseup: _this2._onFabricMouseUp.bind(_this2) + }); + + canvas.add(newText); + + if (!canvas.getActiveObject()) { + canvas.setActiveObject(newText); + } + + _this2.isPrevEditing = true; + resolve(_this2.graphics.createObjectProperties(newText)); + }); + } + + /** + * Change text of activate object on canvas image + * @param {Object} activeObj - Current selected text object + * @param {string} text - Changed text + * @returns {Promise} + */ + + }, { + key: 'change', + value: function change(activeObj, text) { + var _this3 = this; + + return new _promise2.default(function (resolve) { + activeObj.set('text', text); + + _this3.getCanvas().renderAll(); + resolve(); + }); + } + + /** + * Set style + * @param {Object} activeObj - Current selected text object + * @param {Object} styleObj - Initial styles + * @param {string} [styleObj.fill] Color + * @param {string} [styleObj.fontFamily] Font type for text + * @param {number} [styleObj.fontSize] Size + * @param {string} [styleObj.fontStyle] Type of inclination (normal / italic) + * @param {string} [styleObj.fontWeight] Type of thicker or thinner looking (normal / bold) + * @param {string} [styleObj.textAlign] Type of text align (left / center / right) + * @param {string} [styleObj.textDecoraiton] Type of line (underline / line-throgh / overline) + * @returns {Promise} + */ + + }, { + key: 'setStyle', + value: function setStyle(activeObj, styleObj) { + var _this4 = this; + + return new _promise2.default(function (resolve) { + _tuiCodeSnippet2.default.forEach(styleObj, function (val, key) { + if (activeObj[key] === val) { + styleObj[key] = resetStyles[key] || ''; + } + }, _this4); + + activeObj.set(styleObj); + + _this4.getCanvas().renderAll(); + resolve(); + }); + } + + /** + * Get the text + * @param {Object} activeObj - Current selected text object + * @returns {String} text + */ + + }, { + key: 'getText', + value: function getText(activeObj) { + return activeObj.getText(); + } + + /** + * Set infos of the current selected object + * @param {fabric.Text} obj - Current selected text object + * @param {boolean} state - State of selecting + */ + + }, { + key: 'setSelectedInfo', + value: function setSelectedInfo(obj, state) { + this._selectedObj = obj; + this._isSelected = state; + } + + /** + * Whether object is selected or not + * @returns {boolean} State of selecting + */ + + }, { + key: 'isSelected', + value: function isSelected() { + return this._isSelected; + } + + /** + * Get current selected text object + * @returns {fabric.Text} Current selected text object + */ + + }, { + key: 'getSelectedObj', + value: function getSelectedObj() { + return this._selectedObj; + } + + /** + * Set ratio value of canvas + */ + + }, { + key: 'setCanvasRatio', + value: function setCanvasRatio() { + var canvasElement = this.getCanvasElement(); + var cssWidth = parseInt(canvasElement.style.maxWidth, 10); + var originWidth = canvasElement.width; + var ratio = originWidth / cssWidth; + + this._ratio = ratio; + } + + /** + * Get ratio value of canvas + * @returns {number} Ratio value + */ + + }, { + key: 'getCanvasRatio', + value: function getCanvasRatio() { + return this._ratio; + } + + /** + * Set initial position on canvas image + * @param {{x: number, y: number}} [position] - Selected position + * @private + */ + + }, { + key: '_setInitPos', + value: function _setInitPos(position) { + position = position || this.getCanvasImage().getCenterPoint(); + + this._defaultStyles.left = position.x; + this._defaultStyles.top = position.y; + } + + /** + * Create textarea element on canvas container + * @private + */ + + }, { + key: '_createTextarea', + value: function _createTextarea() { + var container = this.getCanvasElement().parentNode; + var textarea = document.createElement('textarea'); + + textarea.className = TEXTAREA_CLASSNAME; + textarea.setAttribute('style', TEXTAREA_STYLES); + textarea.setAttribute('wrap', 'off'); + + container.appendChild(textarea); + + this._textarea = textarea; + + this._listeners = _tuiCodeSnippet2.default.extend(this._listeners, { + input: this._onInput.bind(this), + keydown: this._onKeyDown.bind(this), + blur: this._onBlur.bind(this), + scroll: this._onScroll.bind(this) + }); + + if (browser.msie && browser.version === 9) { + _fabric.fabric.util.addListener(textarea, 'keydown', this._listeners.keydown); + } else { + _fabric.fabric.util.addListener(textarea, 'input', this._listeners.input); + } + _fabric.fabric.util.addListener(textarea, 'blur', this._listeners.blur); + _fabric.fabric.util.addListener(textarea, 'scroll', this._listeners.scroll); + } + + /** + * Remove textarea element on canvas container + * @private + */ + + }, { + key: '_removeTextarea', + value: function _removeTextarea() { + var container = this.getCanvasElement().parentNode; + var textarea = container.querySelector('textarea'); + + container.removeChild(textarea); + + this._textarea = null; + + if (browser.msie && browser.version < 10) { + _fabric.fabric.util.removeListener(textarea, 'keydown', this._listeners.keydown); + } else { + _fabric.fabric.util.removeListener(textarea, 'input', this._listeners.input); + } + _fabric.fabric.util.removeListener(textarea, 'blur', this._listeners.blur); + _fabric.fabric.util.removeListener(textarea, 'scroll', this._listeners.scroll); + } + + /** + * Input event handler + * @private + */ + + }, { + key: '_onInput', + value: function _onInput() { + var ratio = this.getCanvasRatio(); + var obj = this._editingObj; + var textareaStyle = this._textarea.style; + + textareaStyle.width = Math.ceil(obj.getWidth() / ratio) + 'px'; + textareaStyle.height = Math.ceil(obj.getHeight() / ratio) + 'px'; + } + + /** + * Keydown event handler + * @private + */ + + }, { + key: '_onKeyDown', + value: function _onKeyDown() { + var _this5 = this; + + var ratio = this.getCanvasRatio(); + var obj = this._editingObj; + var textareaStyle = this._textarea.style; + + setTimeout(function () { + obj.setText(_this5._textarea.value); + + textareaStyle.width = Math.ceil(obj.getWidth() / ratio) + 'px'; + textareaStyle.height = Math.ceil(obj.getHeight() / ratio) + 'px'; + }, 0); + } + + /** + * Blur event handler + * @private + */ + + }, { + key: '_onBlur', + value: function _onBlur() { + var ratio = this.getCanvasRatio(); + var editingObj = this._editingObj; + var editingObjInfos = this._editingObjInfos; + var textContent = this._textarea.value; + var transWidth = editingObj.getWidth() / ratio - editingObjInfos.width / ratio; + var transHeight = editingObj.getHeight() / ratio - editingObjInfos.height / ratio; + + if (ratio === 1) { + transWidth /= 2; + transHeight /= 2; + } + + this._textarea.style.display = 'none'; + + editingObj.set({ + left: editingObjInfos.left + transWidth, + top: editingObjInfos.top + transHeight + }); + + if (textContent.length) { + this.getCanvas().add(editingObj); + + var params = { + id: _tuiCodeSnippet2.default.stamp(editingObj), + type: editingObj.type, + text: textContent + }; + + this.fire(events.TEXT_CHANGED, params); + } + } + + /** + * Scroll event handler + * @private + */ + + }, { + key: '_onScroll', + value: function _onScroll() { + this._textarea.scrollLeft = 0; + this._textarea.scrollTop = 0; + } + + /** + * Fabric scaling event handler + * @param {fabric.Event} fEvent - Current scaling event on selected object + * @private + */ + + }, { + key: '_onFabricScaling', + value: function _onFabricScaling(fEvent) { + var obj = fEvent.target; + var scalingSize = obj.getFontSize() * obj.getScaleY(); + + obj.setFontSize(scalingSize); + obj.setScaleX(1); + obj.setScaleY(1); + } + + /** + * onSelectClear handler in fabric canvas + * @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event + * @private + */ + + }, { + key: '_onFabricSelectClear', + value: function _onFabricSelectClear(fEvent) { + var obj = this.getSelectedObj(); + + this.isPrevEditing = true; + + this.setSelectedInfo(fEvent.target, false); + + if (obj) { + // obj is empty object at initial time, will be set fabric object + if (obj.text === '') { + obj.remove(); + } + } + } + + /** + * onSelect handler in fabric canvas + * @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event + * @private + */ + + }, { + key: '_onFabricSelect', + value: function _onFabricSelect(fEvent) { + this.isPrevEditing = true; + + this.setSelectedInfo(fEvent.target, true); + } + + /** + * Fabric 'mousedown' event handler + * @param {fabric.Event} fEvent - Current mousedown event on selected object + * @private + */ + + }, { + key: '_onFabricMouseDown', + value: function _onFabricMouseDown(fEvent) { + var obj = fEvent.target; + if (obj && !obj.isType('text')) { + return; + } + + if (this.isPrevEditing) { + this.isPrevEditing = false; + + return; + } + + this._fireAddText(fEvent); + } + + /** + * Fire 'addText' event if object is not selected. + * @param {fabric.Event} fEvent - Current mousedown event on selected object + * @private + */ + + }, { + key: '_fireAddText', + value: function _fireAddText(fEvent) { + var obj = fEvent.target; + var e = fEvent.e || {}; + var originPointer = this.getCanvas().getPointer(e); + + if (!obj) { + this.fire(events.ADD_TEXT, { + originPosition: { + x: originPointer.x, + y: originPointer.y + }, + clientPosition: { + x: e.clientX || 0, + y: e.clientY || 0 + } + }); + } + } + + /** + * Fabric mouseup event handler + * @param {fabric.Event} fEvent - Current mousedown event on selected object + * @private + */ + + }, { + key: '_onFabricMouseUp', + value: function _onFabricMouseUp(fEvent) { + var newClickTime = new Date().getTime(); + + if (this._isDoubleClick(newClickTime)) { + this._changeToEditingMode(fEvent.target); + this.fire(events.TEXT_EDITING); // fire editing text event + } + + this._lastClickTime = newClickTime; + } + + /** + * Get state of firing double click event + * @param {Date} newClickTime - Current clicked time + * @returns {boolean} Whether double clicked or not + * @private + */ + + }, { + key: '_isDoubleClick', + value: function _isDoubleClick(newClickTime) { + return newClickTime - this._lastClickTime < DBCLICK_TIME; + } + + /** + * Change state of text object for editing + * @param {fabric.Text} obj - Text object fired event + * @private + */ + + }, { + key: '_changeToEditingMode', + value: function _changeToEditingMode(obj) { + var ratio = this.getCanvasRatio(); + var textareaStyle = this._textarea.style; + + this.isPrevEditing = true; + + obj.remove(); + + this._editingObj = obj; + this._textarea.value = obj.getText(); + + this._editingObjInfos = { + left: this._editingObj.getLeft(), + top: this._editingObj.getTop(), + width: this._editingObj.getWidth(), + height: this._editingObj.getHeight() + }; + + textareaStyle.display = 'block'; + textareaStyle.left = obj.oCoords.tl.x / ratio + 'px'; + textareaStyle.top = obj.oCoords.tl.y / ratio + 'px'; + textareaStyle.width = Math.ceil(obj.getWidth() / ratio) + 'px'; + textareaStyle.height = Math.ceil(obj.getHeight() / ratio) + 'px'; + textareaStyle.transform = 'rotate(' + obj.getAngle() + 'deg)'; + textareaStyle.color = obj.getFill(); + + textareaStyle['font-size'] = obj.getFontSize() / ratio + 'px'; + textareaStyle['font-family'] = obj.getFontFamily(); + textareaStyle['font-style'] = obj.getFontStyle(); + textareaStyle['font-weight'] = obj.getFontWeight(); + textareaStyle['text-align'] = obj.getTextAlign(); + textareaStyle['line-height'] = obj.getLineHeight() + EXTRA_PIXEL_LINEHEIGHT; + textareaStyle['transform-origin'] = 'left top'; + + this._textarea.focus(); + } + }]); + + return Text; + }(_component2.default); + + module.exports = Text; + +/***/ }), +/* 84 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _fabric = __webpack_require__(74); + + var _tuiCodeSnippet = __webpack_require__(2); + + var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _component = __webpack_require__(76); + + var _component2 = _interopRequireDefault(_component); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /** + * @author NHN Ent. FE Development Team + * @fileoverview Add icon module + */ + + + var rejectMessages = _consts2.default.rejectMessages; + + + var pathMap = { + arrow: 'M 0 90 H 105 V 120 L 160 60 L 105 0 V 30 H 0 Z', + 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' + }; + + /** + * Icon + * @class Icon + * @param {Graphics} graphics - Graphics instance + * @extends {Component} + * @ignore + */ + + var Icon = function (_Component) { + _inherits(Icon, _Component); + + function Icon(graphics) { + _classCallCheck(this, Icon); + + /** + * Default icon color + * @type {string} + */ + var _this = _possibleConstructorReturn(this, (Icon.__proto__ || Object.getPrototypeOf(Icon)).call(this, _consts2.default.componentNames.ICON, graphics)); + + _this._oColor = '#000000'; + + /** + * Path value of each icon type + * @type {Object} + */ + _this._pathMap = pathMap; + return _this; + } + + /** + * Add icon + * @param {string} type - Icon type + * @param {Object} options - Icon options + * @param {string} [options.fill] - Icon foreground color + * @param {string} [options.left] - Icon x position + * @param {string} [options.top] - Icon y position + * @returns {Promise} + */ + + + _createClass(Icon, [{ + key: 'add', + value: function add(type, options) { + var _this2 = this; + + return new _promise2.default(function (resolve, reject) { + var canvas = _this2.getCanvas(); + var path = _this2._pathMap[type]; + var selectionStyle = _consts2.default.fObjectOptions.SELECTION_STYLE; + + if (!path) { + reject(rejectMessages.invalidParameters); + } + + var icon = _this2._createIcon(path); + + icon.set(_tuiCodeSnippet2.default.extend({ + type: 'icon', + fill: _this2._oColor + }, selectionStyle, options)); + + canvas.add(icon).setActiveObject(icon); + resolve(_this2.graphics.createObjectProperties(icon)); + }); + } + + /** + * Register icon paths + * @param {{key: string, value: string}} pathInfos - Path infos + */ + + }, { + key: 'registerPaths', + value: function registerPaths(pathInfos) { + var _this3 = this; + + _tuiCodeSnippet2.default.forEach(pathInfos, function (path, type) { + _this3._pathMap[type] = path; + }, this); + } + + /** + * Set icon object color + * @param {string} color - Color to set + * @param {fabric.Path}[obj] - Current activated path object + */ + + }, { + key: 'setColor', + value: function setColor(color, obj) { + this._oColor = color; + + if (obj && obj.get('type') === 'icon') { + obj.setFill(this._oColor); + this.getCanvas().renderAll(); + } + } + + /** + * Get icon color + * @param {fabric.Path}[obj] - Current activated path object + * @returns {string} color + */ + + }, { + key: 'getColor', + value: function getColor(obj) { + return obj.fill; + } + + /** + * Create icon object + * @param {string} path - Path value to create icon + * @returns {fabric.Path} Path object + */ + + }, { + key: '_createIcon', + value: function _createIcon(path) { + return new _fabric.fabric.Path(path); + } + }]); + + return Icon; + }(_component2.default); + + module.exports = Icon; + +/***/ }), +/* 85 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _tuiCodeSnippet = __webpack_require__(2); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _fabric = __webpack_require__(74); + + var _component = __webpack_require__(76); + + var _component2 = _interopRequireDefault(_component); + + var _mask = __webpack_require__(86); + + var _mask2 = _interopRequireDefault(_mask); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + var _blur = __webpack_require__(87); + + var _blur2 = _interopRequireDefault(_blur); + + var _sharpen = __webpack_require__(88); + + var _sharpen2 = _interopRequireDefault(_sharpen); + + var _emboss = __webpack_require__(89); + + var _emboss2 = _interopRequireDefault(_emboss); + + var _colorFilter = __webpack_require__(90); + + var _colorFilter2 = _interopRequireDefault(_colorFilter); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /** + * @author NHN Ent. FE Development Team + * @fileoverview Add filter module + */ + + + var rejectMessages = _consts2.default.rejectMessages; + var filters = _fabric.fabric.Image.filters; + + filters.Mask = _mask2.default; + filters.Blur = _blur2.default; + filters.Sharpen = _sharpen2.default; + filters.Emboss = _emboss2.default; + filters.ColorFilter = _colorFilter2.default; + + /** + * Filter + * @class Filter + * @param {Graphics} graphics - Graphics instance + * @extends {Component} + * @ignore + */ + + var Filter = function (_Component) { + _inherits(Filter, _Component); + + function Filter(graphics) { + _classCallCheck(this, Filter); + + return _possibleConstructorReturn(this, (Filter.__proto__ || Object.getPrototypeOf(Filter)).call(this, _consts2.default.componentNames.FILTER, graphics)); + } + + /** + * Add filter to source image (a specific filter is added on fabric.js) + * @param {string} type - Filter type + * @param {Object} [options] - Options of filter + * @returns {Promise} + */ + + + _createClass(Filter, [{ + key: 'add', + value: function add(type, options) { + var _this2 = this; + + return new _promise2.default(function (resolve, reject) { + var sourceImg = _this2._getSourceImage(); + var canvas = _this2.getCanvas(); + var imgFilter = _this2._getFilter(sourceImg, type); + if (!imgFilter) { + imgFilter = _this2._createFilter(sourceImg, type, options); + } + + if (!imgFilter) { + reject(rejectMessages.invalidParameters); + } + + _this2._changeFilterValues(imgFilter, options); + + _this2._apply(sourceImg, function () { + canvas.renderAll(); + resolve({ + type: type, + action: 'add' + }); + }); + }); + } + + /** + * Remove filter to source image + * @param {string} type - Filter type + * @returns {Promise} + */ + + }, { + key: 'remove', + value: function remove(type) { + var _this3 = this; + + return new _promise2.default(function (resolve, reject) { + var sourceImg = _this3._getSourceImage(); + var canvas = _this3.getCanvas(); + + if (!sourceImg.filters.length) { + reject(rejectMessages.unsupportedOperation); + } + + _this3._removeFilter(sourceImg, type); + + _this3._apply(sourceImg, function () { + canvas.renderAll(); + resolve({ + type: type, + action: 'remove' + }); + }); + }); + } + + /** + * Whether this has the filter or not + * @param {string} type - Filter type + * @returns {boolean} true if it has the filter + */ + + }, { + key: 'hasFilter', + value: function hasFilter(type) { + return !!this._getFilter(this._getSourceImage(), type); + } + + /** + * Get a filter options + * @param {string} type - Filter type + * @returns {Object} filter options or null if there is no that filter + */ + + }, { + key: 'getOptions', + value: function getOptions(type) { + var sourceImg = this._getSourceImage(); + var imgFilter = this._getFilter(sourceImg, type); + if (!imgFilter) { + return null; + } + + return (0, _tuiCodeSnippet.extend)({}, imgFilter.options); + } + + /** + * Change filter values + * @param {Object} imgFilter object of filter + * @param {Object} options object + * @private + */ + + }, { + key: '_changeFilterValues', + value: function _changeFilterValues(imgFilter, options) { + (0, _tuiCodeSnippet.forEach)(options, function (value, key) { + if (!(0, _tuiCodeSnippet.isUndefined)(imgFilter[key])) { + imgFilter[key] = value; + } + }); + (0, _tuiCodeSnippet.forEach)(imgFilter.options, function (value, key) { + if (!(0, _tuiCodeSnippet.isUndefined)(options[key])) { + imgFilter.options[key] = options[key]; + } + }); + } + + /** + * Apply filter + * @param {fabric.Image} sourceImg - Source image to apply filter + * @param {function} callback - Executed function after applying filter + * @private + */ + + }, { + key: '_apply', + value: function _apply(sourceImg, callback) { + sourceImg.applyFilters(callback); + } + + /** + * Get source image on canvas + * @returns {fabric.Image} Current source image on canvas + * @private + */ + + }, { + key: '_getSourceImage', + value: function _getSourceImage() { + return this.getCanvasImage(); + } + + /** + * Create filter instance + * @param {fabric.Image} sourceImg - Source image to apply filter + * @param {string} type - Filter type + * @param {Object} [options] - Options of filter + * @returns {Object} Fabric object of filter + * @private + */ + + }, { + key: '_createFilter', + value: function _createFilter(sourceImg, type, options) { + var filterObj = void 0; + // capitalize first letter for matching with fabric image filter name + var fabricType = this._getFabricFilterType(type); + var ImageFilter = _fabric.fabric.Image.filters[fabricType]; + if (ImageFilter) { + filterObj = new ImageFilter(options); + filterObj.options = options; + sourceImg.filters.push(filterObj); + } + + return filterObj; + } + + /** + * Get applied filter instance + * @param {fabric.Image} sourceImg - Source image to apply filter + * @param {string} type - Filter type + * @returns {Object} Fabric object of filter + * @private + */ + + }, { + key: '_getFilter', + value: function _getFilter(sourceImg, type) { + var imgFilter = null; + + if (sourceImg) { + var fabricType = this._getFabricFilterType(type); + var length = sourceImg.filters.length; + + var item = void 0, + i = void 0; + + for (i = 0; i < length; i += 1) { + item = sourceImg.filters[i]; + if (item.type === fabricType) { + imgFilter = item; + break; + } + } + } + + return imgFilter; + } + + /** + * Remove applied filter instance + * @param {fabric.Image} sourceImg - Source image to apply filter + * @param {string} type - Filter type + * @private + */ + + }, { + key: '_removeFilter', + value: function _removeFilter(sourceImg, type) { + var fabricType = this._getFabricFilterType(type); + sourceImg.filters = (0, _tuiCodeSnippet.filter)(sourceImg.filters, function (value) { + return value.type !== fabricType; + }); + } + + /** + * Change filter class name to fabric's, especially capitalizing first letter + * @param {string} type - Filter type + * @example + * 'grayscale' -> 'Grayscale' + * @returns {string} Fabric filter class name + */ + + }, { + key: '_getFabricFilterType', + value: function _getFabricFilterType(type) { + return type.charAt(0).toUpperCase() + type.slice(1); + } + }]); + + return Filter; + }(_component2.default); + + module.exports = Filter; + +/***/ }), +/* 86 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _fabric = __webpack_require__(74); + + /** + * Mask object + * @class Mask + * @extends {fabric.Image.filters.Mask} + * @ignore + */ + var Mask = _fabric.fabric.util.createClass(_fabric.fabric.Image.filters.Mask, /** @lends Mask.prototype */{ + /** + * Apply filter to canvas element + * @param {Object} canvasEl - Canvas element to apply filter + * @override + */ + applyTo: function applyTo(canvasEl) { + if (!this.mask) { + return; + } + + var width = canvasEl.width, + height = canvasEl.height; + + var maskCanvasEl = this._createCanvasOfMask(width, height); + var ctx = canvasEl.getContext('2d'); + var maskCtx = maskCanvasEl.getContext('2d'); + var imageData = ctx.getImageData(0, 0, width, height); + + this._drawMask(maskCtx, canvasEl, ctx); + this._mapData(maskCtx, imageData, width, height); + + ctx.putImageData(imageData, 0, 0); + }, + + + /** + * Create canvas of mask image + * @param {number} width - Width of main canvas + * @param {number} height - Height of main canvas + * @returns {HTMLElement} Canvas element + * @private + */ + _createCanvasOfMask: function _createCanvasOfMask(width, height) { + var maskCanvasEl = _fabric.fabric.util.createCanvasElement(); + + maskCanvasEl.width = width; + maskCanvasEl.height = height; + + return maskCanvasEl; + }, + + + /** + * Draw mask image on canvas element + * @param {Object} maskCtx - Context of mask canvas + * @private + */ + _drawMask: function _drawMask(maskCtx) { + var mask = this.mask; + + var maskImg = mask.getElement(); + + var left = mask.getLeft(); + var top = mask.getTop(); + var angle = mask.getAngle(); + + maskCtx.save(); + maskCtx.translate(left, top); + maskCtx.rotate(angle * Math.PI / 180); + maskCtx.scale(mask.scaleX, mask.scaleY); + maskCtx.drawImage(maskImg, -maskImg.width / 2, -maskImg.height / 2); + maskCtx.restore(); + }, + + + /** + * Map mask image data to source image data + * @param {Object} maskCtx - Context of mask canvas + * @param {Object} imageData - Data of source image + * @param {number} width - Width of main canvas + * @param {number} height - Height of main canvas + * @private + */ + _mapData: function _mapData(maskCtx, imageData, width, height) { + var sourceData = imageData.data; + var maskData = maskCtx.getImageData(0, 0, width, height).data; + var channel = this.channel; + + var len = imageData.width * imageData.height * 4; + + for (var i = 0; i < len; i += 4) { + sourceData[i + 3] = maskData[i + channel]; // adjust value of alpha data + } + } + }); /** + * @author NHN Ent. FE Development Team + * @fileoverview Mask extending fabric.Image.filters.Mask + */ + + + module.exports = Mask; + +/***/ }), +/* 87 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _fabric = __webpack_require__(74); + + /** + * Blur object + * @class Blur + * @extends {fabric.Image.filters.Convolute} + * @ignore + */ + var Blur = _fabric.fabric.util.createClass(_fabric.fabric.Image.filters.Convolute, /** @lends Convolute.prototype */{ + /** + * Filter type + * @param {String} type + * @default + */ + type: 'Blur', + + /** + * constructor + * @override + */ + initialize: function initialize() { + var matrix = [1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9, 1 / 9]; + this.matrix = matrix; + } + }); /** + * @author NHN Ent. FE Development Team + * @fileoverview Blur extending fabric.Image.filters.Convolute + */ + + + module.exports = Blur; + +/***/ }), +/* 88 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _fabric = __webpack_require__(74); + + /** + * Sharpen object + * @class Sharpen + * @extends {fabric.Image.filters.Convolute} + * @ignore + */ + var Sharpen = _fabric.fabric.util.createClass(_fabric.fabric.Image.filters.Convolute, /** @lends Convolute.prototype */{ + /** + * Filter type + * @param {String} type + * @default + */ + type: 'Sharpen', + + /** + * constructor + * @override + */ + initialize: function initialize() { + var matrix = [0, -1, 0, -1, 5, -1, 0, -1, 0]; + this.matrix = matrix; + } + }); /** + * @author NHN Ent. FE Development Team + * @fileoverview Sharpen extending fabric.Image.filters.Convolute + */ + + + module.exports = Sharpen; + +/***/ }), +/* 89 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _fabric = __webpack_require__(74); + + /** + * Emboss object + * @class Emboss + * @extends {fabric.Image.filters.Convolute} + * @ignore + */ + var Emboss = _fabric.fabric.util.createClass(_fabric.fabric.Image.filters.Convolute, /** @lends Convolute.prototype */{ + /** + * Filter type + * @param {String} type + * @default + */ + type: 'Emboss', + + /** + * constructor + * @override + */ + initialize: function initialize() { + var matrix = [1, 1, 1, 1, 0.7, -1, -1, -1, -1]; + this.matrix = matrix; + } + }); /** + * @author NHN Ent. FE Development Team + * @fileoverview Emboss extending fabric.Image.filters.Convolute + */ + + + module.exports = Emboss; + +/***/ }), +/* 90 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _fabric = __webpack_require__(74); + + /** + * ColorFilter object + * @class ColorFilter + * @extends {fabric.Image.filters.BaseFilter} + * @ignore + */ + var ColorFilter = _fabric.fabric.util.createClass(_fabric.fabric.Image.filters.BaseFilter, /** @lends BaseFilter.prototype */{ + /** + * Filter type + * @param {String} type + * @default + */ + type: 'ColorFilter', + + /** + * Constructor + * @member fabric.Image.filters.ColorFilter.prototype + * @param {Object} [options] Options object + * @param {Number} [options.color='#FFFFFF'] Value of color (0...255) + * @param {Number} [options.threshold=45] Value of threshold (0...255) + * @override + */ + initialize: function initialize(options) { + if (!options) { + options = {}; + } + this.color = options.color || '#FFFFFF'; + this.threshold = options.threshold || 45; + this.x = options.x || null; + this.y = options.y || null; + }, + + + /** + * Applies filter to canvas element + * @param {Object} canvasEl Canvas element to apply filter to + */ + applyTo: function applyTo(canvasEl) { + var context = canvasEl.getContext('2d'); + var imageData = context.getImageData(0, 0, canvasEl.width, canvasEl.height); + var data = imageData.data; + var threshold = this.threshold; + + var filterColor = _fabric.fabric.Color.sourceFromHex(this.color); + var i = void 0, + len = void 0; + + if (this.x && this.y) { + filterColor = this._getColor(imageData, this.x, this.y); + } + + for (i = 0, len = data.length; i < len; i += 4) { + if (this._isOutsideThreshold(data[i], filterColor[0], threshold) || this._isOutsideThreshold(data[i + 1], filterColor[1], threshold) || this._isOutsideThreshold(data[i + 2], filterColor[2], threshold)) { + continue; + } + data[i] = data[i + 1] = data[i + 2] = data[i + 3] = 0; + } + context.putImageData(imageData, 0, 0); + }, + + + /** + * Check color if it is within threshold + * @param {Number} color1 source color + * @param {Number} color2 filtering color + * @param {Number} threshold threshold + * @returns {boolean} true if within threshold or false + */ + _isOutsideThreshold: function _isOutsideThreshold(color1, color2, threshold) { + var diff = color1 - color2; + + return Math.abs(diff) > threshold; + }, + + + /** + * Get color at (x, y) + * @param {Object} imageData of canvas + * @param {Number} x left position + * @param {Number} y top position + * @returns {Array} color array + */ + _getColor: function _getColor(imageData, x, y) { + var color = [0, 0, 0, 0]; + var data = imageData.data, + width = imageData.width; + + var bytes = 4; + var position = (width * y + x) * bytes; + + color[0] = data[position]; + color[1] = data[position + 1]; + color[2] = data[position + 2]; + color[3] = data[position + 3]; + + return color; + } + }); /** + * @author NHN Ent. FE Development Team + * @fileoverview ColorFilter extending fabric.Image.filters.BaseFilter + */ + + + module.exports = ColorFilter; + +/***/ }), +/* 91 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _fabric = __webpack_require__(74); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _component = __webpack_require__(76); + + var _component2 = _interopRequireDefault(_component); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + var _shapeResizeHelper = __webpack_require__(92); + + var _shapeResizeHelper2 = _interopRequireDefault(_shapeResizeHelper); + + var _tuiCodeSnippet = __webpack_require__(2); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /** + * @author NHN Ent. FE Development Team + * @fileoverview Shape component + */ + + + var rejectMessages = _consts2.default.rejectMessages, + eventNames = _consts2.default.eventNames; + + var KEY_CODES = _consts2.default.keyCodes; + var DEFAULT_TYPE = 'rect'; + var DEFAULT_OPTIONS = { + strokeWidth: 1, + stroke: '#000000', + fill: '#ffffff', + width: 1, + height: 1, + rx: 0, + ry: 0, + lockSkewingX: true, + lockSkewingY: true, + lockUniScaling: false, + bringForward: true, + isRegular: false + }; + + var shapeType = ['rect', 'circle', 'triangle']; + + /** + * Shape + * @class Shape + * @param {Graphics} graphics - Graphics instance + * @extends {Component} + * @ignore + */ + + var Shape = function (_Component) { + _inherits(Shape, _Component); + + function Shape(graphics) { + _classCallCheck(this, Shape); + + /** + * Object of The drawing shape + * @type {fabric.Object} + * @private + */ + var _this = _possibleConstructorReturn(this, (Shape.__proto__ || Object.getPrototypeOf(Shape)).call(this, _consts2.default.componentNames.SHAPE, graphics)); + + _this._shapeObj = null; + + /** + * Type of the drawing shape + * @type {string} + * @private + */ + _this._type = DEFAULT_TYPE; + + /** + * Options to draw the shape + * @type {Object} + * @private + */ + _this._options = (0, _tuiCodeSnippet.extend)({}, DEFAULT_OPTIONS); + + /** + * Whether the shape object is selected or not + * @type {boolean} + * @private + */ + _this._isSelected = false; + + /** + * Pointer for drawing shape (x, y) + * @type {Object} + * @private + */ + _this._startPoint = {}; + + /** + * Using shortcut on drawing shape + * @type {boolean} + * @private + */ + _this._withShiftKey = false; + + /** + * Event handler list + * @type {Object} + * @private + */ + _this._handlers = { + mousedown: _this._onFabricMouseDown.bind(_this), + mousemove: _this._onFabricMouseMove.bind(_this), + mouseup: _this._onFabricMouseUp.bind(_this), + keydown: _this._onKeyDown.bind(_this), + keyup: _this._onKeyUp.bind(_this) + }; + return _this; + } + + /** + * Start to draw the shape on canvas + * @ignore + */ + + + _createClass(Shape, [{ + key: 'start', + value: function start() { + var canvas = this.getCanvas(); + + this._isSelected = false; + + canvas.defaultCursor = 'crosshair'; + canvas.selection = false; + canvas.uniScaleTransform = true; + canvas.on({ + 'mouse:down': this._handlers.mousedown + }); + + _fabric.fabric.util.addListener(document, 'keydown', this._handlers.keydown); + _fabric.fabric.util.addListener(document, 'keyup', this._handlers.keyup); + } + + /** + * End to draw the shape on canvas + * @ignore + */ + + }, { + key: 'end', + value: function end() { + var canvas = this.getCanvas(); + + this._isSelected = false; + + canvas.defaultCursor = 'default'; + canvas.selection = true; + canvas.uniScaleTransform = false; + canvas.off({ + 'mouse:down': this._handlers.mousedown + }); + + _fabric.fabric.util.removeListener(document, 'keydown', this._handlers.keydown); + _fabric.fabric.util.removeListener(document, 'keyup', this._handlers.keyup); + } + + /** + * Set states of the current drawing shape + * @ignore + * @param {string} type - Shape type (ex: 'rect', 'circle') + * @param {Object} [options] - Shape options + * @param {string} [options.fill] - Shape foreground color (ex: '#fff', 'transparent') + * @param {string} [options.stoke] - Shape outline color + * @param {number} [options.strokeWidth] - Shape outline width + * @param {number} [options.width] - Width value (When type option is 'rect', this options can use) + * @param {number} [options.height] - Height value (When type option is 'rect', this options can use) + * @param {number} [options.rx] - Radius x value (When type option is 'circle', this options can use) + * @param {number} [options.ry] - Radius y value (When type option is 'circle', this options can use) + */ + + }, { + key: 'setStates', + value: function setStates(type, options) { + this._type = type; + + if (options) { + this._options = (0, _tuiCodeSnippet.extend)(this._options, options); + } + } + + /** + * Add the shape + * @ignore + * @param {string} type - Shape type (ex: 'rect', 'circle') + * @param {Object} options - Shape options + * @param {string} [options.fill] - Shape foreground color (ex: '#fff', 'transparent') + * @param {string} [options.stroke] - Shape outline color + * @param {number} [options.strokeWidth] - Shape outline width + * @param {number} [options.width] - Width value (When type option is 'rect', this options can use) + * @param {number} [options.height] - Height value (When type option is 'rect', this options can use) + * @param {number} [options.rx] - Radius x value (When type option is 'circle', this options can use) + * @param {number} [options.ry] - Radius y value (When type option is 'circle', this options can use) + * @param {number} [options.isRegular] - Whether scaling shape has 1:1 ratio or not + * @returns {Promise} + */ + + }, { + key: 'add', + value: function add(type, options) { + var _this2 = this; + + return new _promise2.default(function (resolve) { + var canvas = _this2.getCanvas(); + options = _this2._createOptions(options); + var shapeObj = _this2._createInstance(type, options); + + _this2._bindEventOnShape(shapeObj); + + canvas.add(shapeObj).setActiveObject(shapeObj); + resolve(_this2.graphics.createObjectProperties(shapeObj)); + }); + } + + /** + * Change the shape + * @ignore + * @param {fabric.Object} shapeObj - Selected shape object on canvas + * @param {Object} options - Shape options + * @param {string} [options.fill] - Shape foreground color (ex: '#fff', 'transparent') + * @param {string} [options.stroke] - Shape outline color + * @param {number} [options.strokeWidth] - Shape outline width + * @param {number} [options.width] - Width value (When type option is 'rect', this options can use) + * @param {number} [options.height] - Height value (When type option is 'rect', this options can use) + * @param {number} [options.rx] - Radius x value (When type option is 'circle', this options can use) + * @param {number} [options.ry] - Radius y value (When type option is 'circle', this options can use) + * @param {number} [options.isRegular] - Whether scaling shape has 1:1 ratio or not + * @returns {Promise} + */ + + }, { + key: 'change', + value: function change(shapeObj, options) { + var _this3 = this; + + return new _promise2.default(function (resolve, reject) { + if ((0, _tuiCodeSnippet.inArray)(shapeObj.get('type'), shapeType) < 0) { + reject(rejectMessages.unsupportedType); + } + + shapeObj.set(options); + _this3.getCanvas().renderAll(); + resolve(); + }); + } + + /** + * Create the instance of shape + * @param {string} type - Shape type + * @param {Object} options - Options to creat the shape + * @returns {fabric.Object} Shape instance + * @private + */ + + }, { + key: '_createInstance', + value: function _createInstance(type, options) { + var instance = void 0; + + switch (type) { + case 'rect': + instance = new _fabric.fabric.Rect(options); + break; + case 'circle': + instance = new _fabric.fabric.Ellipse((0, _tuiCodeSnippet.extend)({ + type: 'circle' + }, options)); + break; + case 'triangle': + instance = new _fabric.fabric.Triangle(options); + break; + default: + instance = {}; + } + + return instance; + } + + /** + * Get the options to create the shape + * @param {Object} options - Options to creat the shape + * @returns {Object} Shape options + * @private + */ + + }, { + key: '_createOptions', + value: function _createOptions(options) { + var selectionStyles = _consts2.default.fObjectOptions.SELECTION_STYLE; + + options = (0, _tuiCodeSnippet.extend)({}, DEFAULT_OPTIONS, this._options, selectionStyles, options); + + if (options.isRegular) { + options.lockUniScaling = true; + } + + return options; + } + + /** + * Bind fabric events on the creating shape object + * @param {fabric.Object} shapeObj - Shape object + * @private + */ + + }, { + key: '_bindEventOnShape', + value: function _bindEventOnShape(shapeObj) { + var self = this; + var canvas = this.getCanvas(); + + shapeObj.on({ + added: function added() { + self._shapeObj = this; + _shapeResizeHelper2.default.setOrigins(self._shapeObj); + }, + selected: function selected() { + self._isSelected = true; + self._shapeObj = this; + canvas.uniScaleTransform = true; + canvas.defaultCursor = 'default'; + _shapeResizeHelper2.default.setOrigins(self._shapeObj); + }, + deselected: function deselected() { + self._isSelected = false; + self._shapeObj = null; + canvas.defaultCursor = 'crosshair'; + canvas.uniScaleTransform = false; + }, + modified: function modified() { + var currentObj = self._shapeObj; + + _shapeResizeHelper2.default.adjustOriginToCenter(currentObj); + _shapeResizeHelper2.default.setOrigins(currentObj); + }, + scaling: function scaling(fEvent) { + var pointer = canvas.getPointer(fEvent.e); + var currentObj = self._shapeObj; + + canvas.setCursor('crosshair'); + _shapeResizeHelper2.default.resize(currentObj, pointer, true); + } + }); + } + + /** + * MouseDown event handler on canvas + * @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event object + * @private + */ + + }, { + key: '_onFabricMouseDown', + value: function _onFabricMouseDown(fEvent) { + if (!this._isSelected && !this._shapeObj) { + var canvas = this.getCanvas(); + this._startPoint = canvas.getPointer(fEvent.e); + + canvas.on({ + 'mouse:move': this._handlers.mousemove, + 'mouse:up': this._handlers.mouseup + }); + } + } + + /** + * MouseDown event handler on canvas + * @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event object + * @private + */ + + }, { + key: '_onFabricMouseMove', + value: function _onFabricMouseMove(fEvent) { + var _this4 = this; + + var canvas = this.getCanvas(); + var pointer = canvas.getPointer(fEvent.e); + var startPointX = this._startPoint.x; + var startPointY = this._startPoint.y; + var width = startPointX - pointer.x; + var height = startPointY - pointer.y; + var shape = this._shapeObj; + + if (!shape) { + this.add(this._type, { + left: startPointX, + top: startPointY, + width: width, + height: height + }).then(function (objectProps) { + _this4.fire(eventNames.ADD_OBJECT, objectProps); + }); + } else { + this._shapeObj.set({ + isRegular: this._withShiftKey + }); + _shapeResizeHelper2.default.resize(shape, pointer); + canvas.renderAll(); + } + } + + /** + * MouseUp event handler on canvas + * @private + */ + + }, { + key: '_onFabricMouseUp', + value: function _onFabricMouseUp() { + var canvas = this.getCanvas(); + var shape = this._shapeObj; + + if (shape) { + _shapeResizeHelper2.default.adjustOriginToCenter(shape); + } + + canvas.off({ + 'mouse:move': this._handlers.mousemove, + 'mouse:up': this._handlers.mouseup + }); + } + + /** + * Keydown event handler on document + * @param {KeyboardEvent} e - Event object + * @private + */ + + }, { + key: '_onKeyDown', + value: function _onKeyDown(e) { + if (e.keyCode === KEY_CODES.SHIFT) { + this._withShiftKey = true; + + if (this._shapeObj) { + this._shapeObj.isRegular = true; + } + } + } + + /** + * Keyup event handler on document + * @param {KeyboardEvent} e - Event object + * @private + */ + + }, { + key: '_onKeyUp', + value: function _onKeyUp(e) { + if (e.keyCode === KEY_CODES.SHIFT) { + this._withShiftKey = false; + + if (this._shapeObj) { + this._shapeObj.isRegular = false; + } + } + } + }]); + + return Shape; + }(_component2.default); + + module.exports = Shape; + +/***/ }), +/* 92 */ +/***/ (function(module, exports) { + + 'use strict'; + + /** + * @author NHN Ent. FE Development Team + * @fileoverview Shape resize helper + */ + var DIVISOR = { + rect: 1, + circle: 2, + triangle: 1 + }; + var DIMENSION_KEYS = { + rect: { + w: 'width', + h: 'height' + }, + circle: { + w: 'rx', + h: 'ry' + }, + triangle: { + w: 'width', + h: 'height' + } + }; + + /** + * Set the start point value to the shape object + * @param {fabric.Object} shape - Shape object + * @ignore + */ + function setStartPoint(shape) { + var originX = shape.getOriginX(); + var originY = shape.getOriginY(); + var originKey = originX.substring(0, 1) + originY.substring(0, 1); + + shape.startPoint = shape.origins[originKey]; + } + + /** + * Get the positions of ratated origin by the pointer value + * @param {{x: number, y: number}} origin - Origin value + * @param {{x: number, y: number}} pointer - Pointer value + * @param {number} angle - Rotating angle + * @returns {Object} Postions of origin + * @ignore + */ + function getPositionsOfRotatedOrigin(origin, pointer, angle) { + var sx = origin.x; + var sy = origin.y; + var px = pointer.x; + var py = pointer.y; + var r = angle * Math.PI / 180; + var rx = (px - sx) * Math.cos(r) - (py - sy) * Math.sin(r) + sx; + var ry = (px - sx) * Math.sin(r) + (py - sy) * Math.cos(r) + sy; + + return { + originX: sx > rx ? 'right' : 'left', + originY: sy > ry ? 'bottom' : 'top' + }; + } + + /** + * Whether the shape has the center origin or not + * @param {fabric.Object} shape - Shape object + * @returns {boolean} State + * @ignore + */ + function hasCenterOrigin(shape) { + return shape.getOriginX() === 'center' && shape.getOriginY() === 'center'; + } + + /** + * Adjust the origin of shape by the start point + * @param {{x: number, y: number}} pointer - Pointer value + * @param {fabric.Object} shape - Shape object + * @ignore + */ + function adjustOriginByStartPoint(pointer, shape) { + var centerPoint = shape.getPointByOrigin('center', 'center'); + var angle = -shape.getAngle(); + var originPositions = getPositionsOfRotatedOrigin(centerPoint, pointer, angle); + var originX = originPositions.originX, + originY = originPositions.originY; + + var origin = shape.getPointByOrigin(originX, originY); + var left = shape.getLeft() - (centerPoint.x - origin.x); + var top = shape.getTop() - (centerPoint.x - origin.y); + + shape.set({ + originX: originX, + originY: originY, + left: left, + top: top + }); + + shape.setCoords(); + } + + /** + * Adjust the origin of shape by the moving pointer value + * @param {{x: number, y: number}} pointer - Pointer value + * @param {fabric.Object} shape - Shape object + * @ignore + */ + function adjustOriginByMovingPointer(pointer, shape) { + var origin = shape.startPoint; + var angle = -shape.getAngle(); + var originPositions = getPositionsOfRotatedOrigin(origin, pointer, angle); + var originX = originPositions.originX, + originY = originPositions.originY; + + + shape.setPositionByOrigin(origin, originX, originY); + } + + /** + * Adjust the dimension of shape on firing scaling event + * @param {fabric.Object} shape - Shape object + * @ignore + */ + function adjustDimensionOnScaling(shape) { + var type = shape.type, + scaleX = shape.scaleX, + scaleY = shape.scaleY; + + var dimensionKeys = DIMENSION_KEYS[type]; + var width = shape[dimensionKeys.w] * scaleX; + var height = shape[dimensionKeys.h] * scaleY; + + if (shape.isRegular) { + var maxScale = Math.max(scaleX, scaleY); + + width = shape[dimensionKeys.w] * maxScale; + height = shape[dimensionKeys.h] * maxScale; + } + + var options = { + hasControls: false, + hasBorders: false, + scaleX: 1, + scaleY: 1 + }; + + options[dimensionKeys.w] = width; + options[dimensionKeys.h] = height; + + shape.set(options); + } + + /** + * Adjust the dimension of shape on firing mouse move event + * @param {{x: number, y: number}} pointer - Pointer value + * @param {fabric.Object} shape - Shape object + * @ignore + */ + function adjustDimensionOnMouseMove(pointer, shape) { + var type = shape.type, + strokeWidth = shape.strokeWidth, + origin = shape.startPoint; + + var divisor = DIVISOR[type]; + var dimensionKeys = DIMENSION_KEYS[type]; + var isTriangle = !!(shape.type === 'triangle'); + var options = {}; + var width = Math.abs(origin.x - pointer.x) / divisor; + var height = Math.abs(origin.y - pointer.y) / divisor; + + if (width > strokeWidth) { + width -= strokeWidth / divisor; + } + + if (height > strokeWidth) { + height -= strokeWidth / divisor; + } + + if (shape.isRegular) { + width = height = Math.max(width, height); + + if (isTriangle) { + height = Math.sqrt(3) / 2 * width; + } + } + + options[dimensionKeys.w] = width; + options[dimensionKeys.h] = height; + + shape.set(options); + } + + module.exports = { + /** + * Set each origin value to shape + * @param {fabric.Object} shape - Shape object + */ + setOrigins: function setOrigins(shape) { + var leftTopPoint = shape.getPointByOrigin('left', 'top'); + var rightTopPoint = shape.getPointByOrigin('right', 'top'); + var rightBottomPoint = shape.getPointByOrigin('right', 'bottom'); + var leftBottomPoint = shape.getPointByOrigin('left', 'bottom'); + + shape.origins = { + lt: leftTopPoint, + rt: rightTopPoint, + rb: rightBottomPoint, + lb: leftBottomPoint + }; + }, + + + /** + * Resize the shape + * @param {fabric.Object} shape - Shape object + * @param {{x: number, y: number}} pointer - Mouse pointer values on canvas + * @param {boolean} isScaling - Whether the resizing action is scaling or not + */ + resize: function resize(shape, pointer, isScaling) { + if (hasCenterOrigin(shape)) { + adjustOriginByStartPoint(pointer, shape); + setStartPoint(shape); + } + + if (isScaling) { + adjustDimensionOnScaling(shape, pointer); + } else { + adjustDimensionOnMouseMove(pointer, shape); + } + + adjustOriginByMovingPointer(pointer, shape); + }, + + + /** + * Adjust the origin position of shape to center + * @param {fabric.Object} shape - Shape object + */ + adjustOriginToCenter: function adjustOriginToCenter(shape) { + var centerPoint = shape.getPointByOrigin('center', 'center'); + var originX = shape.getOriginX(); + var originY = shape.getOriginY(); + var origin = shape.getPointByOrigin(originX, originY); + var left = shape.getLeft() + (centerPoint.x - origin.x); + var top = shape.getTop() + (centerPoint.y - origin.y); + + shape.set({ + hasControls: true, + hasBorders: true, + originX: 'center', + originY: 'center', + left: left, + top: top + }); + + shape.setCoords(); // For left, top properties + } + }; + +/***/ }), +/* 93 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _drawingMode = __webpack_require__(94); + + var _drawingMode2 = _interopRequireDefault(_drawingMode); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /** + * @author NHN Ent. FE Development Team + * @fileoverview CropperDrawingMode class + */ + + + var drawingModes = _consts2.default.drawingModes; + + var components = _consts2.default.componentNames; + + /** + * CropperDrawingMode class + * @class + * @ignore + */ + + var CropperDrawingMode = function (_DrawingMode) { + _inherits(CropperDrawingMode, _DrawingMode); + + function CropperDrawingMode() { + _classCallCheck(this, CropperDrawingMode); + + return _possibleConstructorReturn(this, (CropperDrawingMode.__proto__ || Object.getPrototypeOf(CropperDrawingMode)).call(this, drawingModes.CROPPER)); + } + + /** + * start this drawing mode + * @param {Graphics} graphics - Graphics instance + * @override + */ + + + _createClass(CropperDrawingMode, [{ + key: 'start', + value: function start(graphics) { + var cropper = graphics.getComponent(components.CROPPER); + cropper.start(); + } + + /** + * stop this drawing mode + * @param {Graphics} graphics - Graphics instance + * @override + */ + + }, { + key: 'end', + value: function end(graphics) { + var cropper = graphics.getComponent(components.CROPPER); + cropper.end(); + } + }]); + + return CropperDrawingMode; + }(_drawingMode2.default); + + module.exports = CropperDrawingMode; + +/***/ }), +/* 94 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); /** + * @author NHN Ent. FE Development Team + * @fileoverview DrawingMode interface + */ + + + var _errorMessage = __webpack_require__(70); + + var _errorMessage2 = _interopRequireDefault(_errorMessage); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + var createMessage = _errorMessage2.default.create; + var errorTypes = _errorMessage2.default.types; + + /** + * DrawingMode interface + * @class + * @param {string} name - drawing mode name + * @ignore + */ + + var DrawingMode = function () { + function DrawingMode(name) { + _classCallCheck(this, DrawingMode); + + /** + * the name of drawing mode + * @type {string} + */ + this.name = name; + } + + /** + * Get this drawing mode name; + * @returns {string} drawing mode name + */ + + + _createClass(DrawingMode, [{ + key: 'getName', + value: function getName() { + return this.name; + } + + /** + * start this drawing mode + * @param {Object} options - drawing mode options + * @abstract + */ + + }, { + key: 'start', + value: function start() { + throw new Error(createMessage(errorTypes.UN_IMPLEMENTATION, 'start')); + } + + /** + * stop this drawing mode + * @abstract + */ + + }, { + key: 'stop', + value: function stop() { + throw new Error(createMessage(errorTypes.UN_IMPLEMENTATION, 'stop')); + } + }]); + + return DrawingMode; + }(); + + module.exports = DrawingMode; + +/***/ }), +/* 95 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _drawingMode = __webpack_require__(94); + + var _drawingMode2 = _interopRequireDefault(_drawingMode); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /** + * @author NHN Ent. FE Development Team + * @fileoverview FreeDrawingMode class + */ + + + var drawingModes = _consts2.default.drawingModes; + + var components = _consts2.default.componentNames; + + /** + * FreeDrawingMode class + * @class + * @ignore + */ + + var FreeDrawingMode = function (_DrawingMode) { + _inherits(FreeDrawingMode, _DrawingMode); + + function FreeDrawingMode() { + _classCallCheck(this, FreeDrawingMode); + + return _possibleConstructorReturn(this, (FreeDrawingMode.__proto__ || Object.getPrototypeOf(FreeDrawingMode)).call(this, drawingModes.FREE_DRAWING)); + } + + /** + * start this drawing mode + * @param {Graphics} graphics - Graphics instance + * @param {{width: ?number, color: ?string}} [options] - Brush width & color + * @override + */ + + + _createClass(FreeDrawingMode, [{ + key: 'start', + value: function start(graphics, options) { + var freeDrawing = graphics.getComponent(components.FREE_DRAWING); + freeDrawing.start(options); + } + + /** + * stop this drawing mode + * @param {Graphics} graphics - Graphics instance + * @override + */ + + }, { + key: 'end', + value: function end(graphics) { + var freeDrawing = graphics.getComponent(components.FREE_DRAWING); + freeDrawing.end(); + } + }]); + + return FreeDrawingMode; + }(_drawingMode2.default); + + module.exports = FreeDrawingMode; + +/***/ }), +/* 96 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _drawingMode = __webpack_require__(94); + + var _drawingMode2 = _interopRequireDefault(_drawingMode); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /** + * @author NHN Ent. FE Development Team + * @fileoverview LineDrawingMode class + */ + + + var drawingModes = _consts2.default.drawingModes; + + var components = _consts2.default.componentNames; + + /** + * LineDrawingMode class + * @class + * @ignore + */ + + var LineDrawingMode = function (_DrawingMode) { + _inherits(LineDrawingMode, _DrawingMode); + + function LineDrawingMode() { + _classCallCheck(this, LineDrawingMode); + + return _possibleConstructorReturn(this, (LineDrawingMode.__proto__ || Object.getPrototypeOf(LineDrawingMode)).call(this, drawingModes.LINE_DRAWING)); + } + + /** + * start this drawing mode + * @param {Graphics} graphics - Graphics instance + * @param {{width: ?number, color: ?string}} [options] - Brush width & color + * @override + */ + + + _createClass(LineDrawingMode, [{ + key: 'start', + value: function start(graphics, options) { + var lineDrawing = graphics.getComponent(components.LINE); + lineDrawing.start(options); + } + + /** + * stop this drawing mode + * @param {Graphics} graphics - Graphics instance + * @override + */ + + }, { + key: 'end', + value: function end(graphics) { + var lineDrawing = graphics.getComponent(components.LINE); + lineDrawing.end(); + } + }]); + + return LineDrawingMode; + }(_drawingMode2.default); + + module.exports = LineDrawingMode; + +/***/ }), +/* 97 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _drawingMode = __webpack_require__(94); + + var _drawingMode2 = _interopRequireDefault(_drawingMode); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /** + * @author NHN Ent. FE Development Team + * @fileoverview ShapeDrawingMode class + */ + + + var drawingModes = _consts2.default.drawingModes; + + var components = _consts2.default.componentNames; + + /** + * ShapeDrawingMode class + * @class + * @ignore + */ + + var ShapeDrawingMode = function (_DrawingMode) { + _inherits(ShapeDrawingMode, _DrawingMode); + + function ShapeDrawingMode() { + _classCallCheck(this, ShapeDrawingMode); + + return _possibleConstructorReturn(this, (ShapeDrawingMode.__proto__ || Object.getPrototypeOf(ShapeDrawingMode)).call(this, drawingModes.SHAPE)); + } + + /** + * start this drawing mode + * @param {Graphics} graphics - Graphics instance + * @override + */ + + + _createClass(ShapeDrawingMode, [{ + key: 'start', + value: function start(graphics) { + var shape = graphics.getComponent(components.SHAPE); + shape.start(); + } + + /** + * stop this drawing mode + * @param {Graphics} graphics - Graphics instance + * @override + */ + + }, { + key: 'end', + value: function end(graphics) { + var shape = graphics.getComponent(components.SHAPE); + shape.end(); + } + }]); + + return ShapeDrawingMode; + }(_drawingMode2.default); + + module.exports = ShapeDrawingMode; + +/***/ }), +/* 98 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _drawingMode = __webpack_require__(94); + + var _drawingMode2 = _interopRequireDefault(_drawingMode); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /** + * @author NHN Ent. FE Development Team + * @fileoverview TextDrawingMode class + */ + + + var drawingModes = _consts2.default.drawingModes; + + var components = _consts2.default.componentNames; + + /** + * TextDrawingMode class + * @class + * @ignore + */ + + var TextDrawingMode = function (_DrawingMode) { + _inherits(TextDrawingMode, _DrawingMode); + + function TextDrawingMode() { + _classCallCheck(this, TextDrawingMode); + + return _possibleConstructorReturn(this, (TextDrawingMode.__proto__ || Object.getPrototypeOf(TextDrawingMode)).call(this, drawingModes.TEXT)); + } + + /** + * start this drawing mode + * @param {Graphics} graphics - Graphics instance + * @override + */ + + + _createClass(TextDrawingMode, [{ + key: 'start', + value: function start(graphics) { + var text = graphics.getComponent(components.TEXT); + text.start(); + } + + /** + * stop this drawing mode + * @param {Graphics} graphics - Graphics instance + * @override + */ + + }, { + key: 'end', + value: function end(graphics) { + var text = graphics.getComponent(components.TEXT); + text.end(); + } + }]); + + return TextDrawingMode; + }(_drawingMode2.default); + + module.exports = TextDrawingMode; + +/***/ }), +/* 99 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _command = __webpack_require__(68); + + var _command2 = _interopRequireDefault(_command); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + var componentNames = _consts2.default.componentNames, + commandNames = _consts2.default.commandNames; /** + * @author NHN Ent. FE Development Team + * @fileoverview Add an icon + */ + + var ICON = componentNames.ICON; + + + var command = { + name: commandNames.ADD_ICON, + + /** + * Add an icon + * @param {Graphics} graphics - Graphics instance + * @param {string} type - Icon type ('arrow', 'cancel', custom icon name) + * @param {Object} options - Icon options + * @param {string} [options.fill] - Icon foreground color + * @param {string} [options.left] - Icon x position + * @param {string} [options.top] - Icon y position + * @returns {Promise} + */ + execute: function execute(graphics, type, options) { + var _this = this; + + var iconComp = graphics.getComponent(ICON); + + return iconComp.add(type, options).then(function (objectProps) { + _this.undoData.object = graphics.getObject(objectProps.id); + + return objectProps; + }); + }, + + /** + * @param {Graphics} graphics - Graphics instance + * @returns {Promise} + */ + undo: function undo(graphics) { + graphics.remove(this.undoData.object); + + return _promise2.default.resolve(); + } + }; + + _command2.default.register(command); + + module.exports = command; + +/***/ }), +/* 100 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _command = __webpack_require__(68); + + var _command2 = _interopRequireDefault(_command); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + var commandNames = _consts2.default.commandNames; /** + * @author NHN Ent. FE Development Team + * @fileoverview Add an image object + */ + + var command = { + name: commandNames.ADD_IMAGE_OBJECT, + + /** + * Add an image object + * @param {Graphics} graphics - Graphics instance + * @param {string} imgUrl - Image url to make object + * @returns {Promise} + */ + execute: function execute(graphics, imgUrl) { + var _this = this; + + return graphics.addImageObject(imgUrl).then(function (objectProps) { + _this.undoData.object = graphics.getObject(objectProps.id); + + return objectProps; + }); + }, + + /** + * @param {Graphics} graphics - Graphics instance + * @returns {Promise} + */ + undo: function undo(graphics) { + graphics.remove(this.undoData.object); + + return _promise2.default.resolve(); + } + }; + + _command2.default.register(command); + + module.exports = command; + +/***/ }), +/* 101 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _command = __webpack_require__(68); + + var _command2 = _interopRequireDefault(_command); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + var commandNames = _consts2.default.commandNames, + rejectMessages = _consts2.default.rejectMessages; /** + * @author NHN Ent. FE Development Team + * @fileoverview Add an object + */ + + var command = { + name: commandNames.ADD_OBJECT, + + /** + * Add an object + * @param {Graphics} graphics - Graphics instance + * @param {Object} object - Fabric object + * @returns {Promise} + */ + execute: function execute(graphics, object) { + return new _promise2.default(function (resolve, reject) { + if (!graphics.contains(object)) { + graphics.add(object); + resolve(object); + } else { + reject(rejectMessages.addedObject); + } + }); + }, + + /** + * @param {Graphics} graphics - Graphics instance + * @param {Object} object - Fabric object + * @returns {Promise} + */ + undo: function undo(graphics, object) { + return new _promise2.default(function (resolve, reject) { + if (graphics.contains(object)) { + graphics.remove(object); + resolve(object); + } else { + reject(rejectMessages.noObject); + } + }); + } + }; + + _command2.default.register(command); + + module.exports = command; + +/***/ }), +/* 102 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _command = __webpack_require__(68); + + var _command2 = _interopRequireDefault(_command); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + var componentNames = _consts2.default.componentNames, + commandNames = _consts2.default.commandNames; /** + * @author NHN Ent. FE Development Team + * @fileoverview Add a shape + */ + + var SHAPE = componentNames.SHAPE; + + + var command = { + name: commandNames.ADD_SHAPE, + + /** + * Add a shape + * @param {Graphics} graphics - Graphics instance + * @param {string} type - Shape type (ex: 'rect', 'circle', 'triangle') + * @param {Object} options - Shape options + * @param {string} [options.fill] - Shape foreground color (ex: '#fff', 'transparent') + * @param {string} [options.stroke] - Shape outline color + * @param {number} [options.strokeWidth] - Shape outline width + * @param {number} [options.width] - Width value (When type option is 'rect', this options can use) + * @param {number} [options.height] - Height value (When type option is 'rect', this options can use) + * @param {number} [options.rx] - Radius x value (When type option is 'circle', this options can use) + * @param {number} [options.ry] - Radius y value (When type option is 'circle', this options can use) + * @param {number} [options.left] - Shape x position + * @param {number} [options.top] - Shape y position + * @param {number} [options.isRegular] - Whether resizing shape has 1:1 ratio or not + * @returns {Promise} + */ + execute: function execute(graphics, type, options) { + var _this = this; + + var shapeComp = graphics.getComponent(SHAPE); + + return shapeComp.add(type, options).then(function (objectProps) { + _this.undoData.object = graphics.getObject(objectProps.id); + + return objectProps; + }); + }, + + /** + * @param {Graphics} graphics - Graphics instance + * @returns {Promise} + */ + undo: function undo(graphics) { + graphics.remove(this.undoData.object); + + return _promise2.default.resolve(); + } + }; + + _command2.default.register(command); + + module.exports = command; + +/***/ }), +/* 103 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _command = __webpack_require__(68); + + var _command2 = _interopRequireDefault(_command); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + var componentNames = _consts2.default.componentNames, + commandNames = _consts2.default.commandNames; /** + * @author NHN Ent. FE Development Team + * @fileoverview Add a text object + */ + + var TEXT = componentNames.TEXT; + + + var command = { + name: commandNames.ADD_TEXT, + + /** + * Add a text object + * @param {Graphics} graphics - Graphics instance + * @param {string} text - Initial input text + * @param {Object} [options] Options for text styles + * @param {Object} [options.styles] Initial styles + * @param {string} [options.styles.fill] Color + * @param {string} [options.styles.fontFamily] Font type for text + * @param {number} [options.styles.fontSize] Size + * @param {string} [options.styles.fontStyle] Type of inclination (normal / italic) + * @param {string} [options.styles.fontWeight] Type of thicker or thinner looking (normal / bold) + * @param {string} [options.styles.textAlign] Type of text align (left / center / right) + * @param {string} [options.styles.textDecoraiton] Type of line (underline / line-throgh / overline) + * @param {{x: number, y: number}} [options.position] - Initial position + * @returns {Promise} + */ + execute: function execute(graphics, text, options) { + var _this = this; + + var textComp = graphics.getComponent(TEXT); + + return textComp.add(text, options).then(function (objectProps) { + _this.undoData.object = graphics.getObject(objectProps.id); + + return objectProps; + }); + }, + + /** + * @param {Graphics} graphics - Graphics instance + * @returns {Promise} + */ + undo: function undo(graphics) { + graphics.remove(this.undoData.object); + + return _promise2.default.resolve(); + } + }; + + _command2.default.register(command); + + module.exports = command; + +/***/ }), +/* 104 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _command = __webpack_require__(68); + + var _command2 = _interopRequireDefault(_command); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + /** + * @author NHN Ent. FE Development Team + * @fileoverview Apply a filter into an image + */ + var componentNames = _consts2.default.componentNames, + rejectMessages = _consts2.default.rejectMessages, + commandNames = _consts2.default.commandNames; + var FILTER = componentNames.FILTER; + + + var command = { + name: commandNames.APPLY_FILTER, + + /** + * Apply a filter into an image + * @param {Graphics} graphics - Graphics instance + * @param {string} type - Filter type + * @param {Object} options - Filter options + * @param {number} options.maskObjId - masking image object id + * @returns {Promise} + */ + execute: function execute(graphics, type, options) { + var filterComp = graphics.getComponent(FILTER); + + if (type === 'mask') { + var maskObj = graphics.getObject(options.maskObjId); + + if (!(maskObj && maskObj.isType('image'))) { + return Promise.reject(rejectMessages.invalidParameters); + } + + options = { + mask: maskObj + }; + } + + if (type === 'mask') { + this.undoData.object = options.mask; + graphics.remove(options.mask); + } else { + this.undoData.options = filterComp.getOptions(type); + } + + return filterComp.add(type, options); + }, + + /** + * @param {Graphics} graphics - Graphics instance + * @param {string} type - Filter type + * @returns {Promise} + */ + undo: function undo(graphics, type) { + var filterComp = graphics.getComponent(FILTER); + + if (type === 'mask') { + var mask = this.undoData.object; + graphics.add(mask); + graphics.setActiveObject(mask); + + return filterComp.remove(type); + } + + // options changed case + if (this.undoData.options) { + return filterComp.add(type, this.undoData.options); + } + + // filter added case + return filterComp.remove(type); + } + }; + + _command2.default.register(command); + + module.exports = command; + +/***/ }), +/* 105 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _command = __webpack_require__(68); + + var _command2 = _interopRequireDefault(_command); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + var componentNames = _consts2.default.componentNames, + rejectMessages = _consts2.default.rejectMessages, + commandNames = _consts2.default.commandNames; /** + * @author NHN Ent. FE Development Team + * @fileoverview Change icon color + */ + + var ICON = componentNames.ICON; + + + var command = { + name: commandNames.CHANGE_ICON_COLOR, + + /** + * Change icon color + * @param {Graphics} graphics - Graphics instance + * @param {number} id - object id + * @param {string} color - Color for icon + * @returns {Promise} + */ + execute: function execute(graphics, id, color) { + var _this = this; + + return new _promise2.default(function (resolve, reject) { + var iconComp = graphics.getComponent(ICON); + var targetObj = graphics.getObject(id); + + if (!targetObj) { + reject(rejectMessages.noObject); + } + + _this.undoData.object = targetObj; + _this.undoData.color = iconComp.getColor(targetObj); + iconComp.setColor(color, targetObj); + resolve(); + }); + }, + + /** + * @param {Graphics} graphics - Graphics instance + * @returns {Promise} + */ + undo: function undo(graphics) { + var iconComp = graphics.getComponent(ICON); + var _undoData$object = this.undoData.object, + icon = _undoData$object.object, + color = _undoData$object.color; + + + iconComp.setColor(color, icon); + + return _promise2.default.resolve(); + } + }; + + _command2.default.register(command); + + module.exports = command; + +/***/ }), +/* 106 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _tuiCodeSnippet = __webpack_require__(2); + + var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + + var _command = __webpack_require__(68); + + var _command2 = _interopRequireDefault(_command); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + /** + * @author NHN Ent. FE Development Team + * @fileoverview change a shape + */ + var componentNames = _consts2.default.componentNames, + rejectMessages = _consts2.default.rejectMessages, + commandNames = _consts2.default.commandNames; + var SHAPE = componentNames.SHAPE; + + + var command = { + name: commandNames.CHANGE_SHAPE, + + /** + * Change a shape + * @param {Graphics} graphics - Graphics instance + * @param {number} id - object id + * @param {Object} options - Shape options + * @param {string} [options.fill] - Shape foreground color (ex: '#fff', 'transparent') + * @param {string} [options.stroke] - Shape outline color + * @param {number} [options.strokeWidth] - Shape outline width + * @param {number} [options.width] - Width value (When type option is 'rect', this options can use) + * @param {number} [options.height] - Height value (When type option is 'rect', this options can use) + * @param {number} [options.rx] - Radius x value (When type option is 'circle', this options can use) + * @param {number} [options.ry] - Radius y value (When type option is 'circle', this options can use) + * @param {number} [options.left] - Shape x position + * @param {number} [options.top] - Shape y position + * @param {number} [options.isRegular] - Whether resizing shape has 1:1 ratio or not + * @returns {Promise} + */ + execute: function execute(graphics, id, options) { + var _this = this; + + var shapeComp = graphics.getComponent(SHAPE); + var targetObj = graphics.getObject(id); + + if (!targetObj) { + return _promise2.default.reject(rejectMessages.noObject); + } + + this.undoData.object = targetObj; + this.undoData.options = {}; + _tuiCodeSnippet2.default.forEachOwnProperties(options, function (value, key) { + _this.undoData.options[key] = targetObj[key]; + }); + + return shapeComp.change(targetObj, options); + }, + + /** + * @param {Graphics} graphics - Graphics instance + * @returns {Promise} + */ + undo: function undo(graphics) { + var shapeComp = graphics.getComponent(SHAPE); + var _undoData = this.undoData, + shape = _undoData.object, + options = _undoData.options; + + + return shapeComp.change(shape, options); + } + }; + + _command2.default.register(command); + + module.exports = command; + +/***/ }), +/* 107 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _command = __webpack_require__(68); + + var _command2 = _interopRequireDefault(_command); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + var componentNames = _consts2.default.componentNames, + rejectMessages = _consts2.default.rejectMessages, + commandNames = _consts2.default.commandNames; /** + * @author NHN Ent. FE Development Team + * @fileoverview Change a text + */ + + var TEXT = componentNames.TEXT; + + + var command = { + name: commandNames.CHANGE_TEXT, + + /** + * Change a text + * @param {Graphics} graphics - Graphics instance + * @param {number} id - object id + * @param {string} text - Changing text + * @returns {Promise} + */ + execute: function execute(graphics, id, text) { + var textComp = graphics.getComponent(TEXT); + var targetObj = graphics.getObject(id); + + if (!targetObj) { + return _promise2.default.reject(rejectMessages.noObject); + } + + this.undoData.object = targetObj; + this.undoData.text = textComp.getText(targetObj); + + return textComp.change(targetObj, text); + }, + + /** + * @param {Graphics} graphics - Graphics instance + * @returns {Promise} + */ + undo: function undo(graphics) { + var textComp = graphics.getComponent(TEXT); + var _undoData = this.undoData, + textObj = _undoData.object, + text = _undoData.text; + + + return textComp.change(textObj, text); + } + }; + + _command2.default.register(command); + + module.exports = command; + +/***/ }), +/* 108 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _tuiCodeSnippet = __webpack_require__(2); + + var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + + var _command = __webpack_require__(68); + + var _command2 = _interopRequireDefault(_command); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + /** + * @author NHN Ent. FE Development Team + * @fileoverview Change text styles + */ + var componentNames = _consts2.default.componentNames, + rejectMessages = _consts2.default.rejectMessages, + commandNames = _consts2.default.commandNames; + var TEXT = componentNames.TEXT; + + + var command = { + name: commandNames.CHANGE_TEXT_STYLE, + + /** + * Change text styles + * @param {Graphics} graphics - Graphics instance + * @param {number} id - object id + * @param {Object} styles - text styles + * @param {string} [styles.fill] Color + * @param {string} [styles.fontFamily] Font type for text + * @param {number} [styles.fontSize] Size + * @param {string} [styles.fontStyle] Type of inclination (normal / italic) + * @param {string} [styles.fontWeight] Type of thicker or thinner looking (normal / bold) + * @param {string} [styles.textAlign] Type of text align (left / center / right) + * @param {string} [styles.textDecoraiton] Type of line (underline / line-throgh / overline) + * @returns {Promise} + */ + execute: function execute(graphics, id, styles) { + var _this = this; + + var textComp = graphics.getComponent(TEXT); + var targetObj = graphics.getObject(id); + + if (!targetObj) { + return _promise2.default.reject(rejectMessages.noObject); + } + + this.undoData.object = targetObj; + this.undoData.styles = {}; + _tuiCodeSnippet2.default.forEachOwnProperties(styles, function (value, key) { + _this.undoData.styles[key] = targetObj[key]; + }); + + return textComp.setStyle(targetObj, styles); + }, + + /** + * @param {Graphics} graphics - Graphics instance + * @returns {Promise} + */ + undo: function undo(graphics) { + var textComp = graphics.getComponent(TEXT); + var _undoData = this.undoData, + textObj = _undoData.object, + styles = _undoData.styles; + + + return textComp.setStyle(textObj, styles); + } + }; + + _command2.default.register(command); + + module.exports = command; + +/***/ }), +/* 109 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _command = __webpack_require__(68); + + var _command2 = _interopRequireDefault(_command); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + var commandNames = _consts2.default.commandNames; /** + * @author NHN Ent. FE Development Team + * @fileoverview Clear all objects + */ + + var command = { + name: commandNames.CLEAR_OBJECTS, + + /** + * Clear all objects without background (main) image + * @param {Graphics} graphics - Graphics instance + * @returns {Promise} + */ + execute: function execute(graphics) { + var _this = this; + + return new _promise2.default(function (resolve) { + _this.undoData.objects = graphics.removeAll(); + resolve(); + }); + }, + + /** + * @param {Graphics} graphics - Graphics instance + * @returns {Promise} + * @ignore + */ + undo: function undo(graphics) { + graphics.add(this.undoData.objects); + + return _promise2.default.resolve(); + } + }; + + _command2.default.register(command); + + module.exports = command; + +/***/ }), +/* 110 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _command = __webpack_require__(68); + + var _command2 = _interopRequireDefault(_command); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + /** + * @author NHN Ent. FE Development Team + * @fileoverview Flip an image + */ + var componentNames = _consts2.default.componentNames, + commandNames = _consts2.default.commandNames; + var FLIP = componentNames.FLIP; + + + var command = { + name: commandNames.FLIP_IMAGE, + + /** + * flip an image + * @param {Graphics} graphics - Graphics instance + * @param {string} type - 'flipX' or 'flipY' or 'reset' + * @returns {Promise} + */ + execute: function execute(graphics, type) { + var flipComp = graphics.getComponent(FLIP); + + this.undoData.setting = flipComp.getCurrentSetting(); + + return flipComp[type](); + }, + + /** + * @param {Graphics} graphics - Graphics instance + * @returns {Promise} + */ + undo: function undo(graphics) { + var flipComp = graphics.getComponent(FLIP); + + return flipComp.set(this.undoData.setting); + } + }; + + _command2.default.register(command); + + module.exports = command; + +/***/ }), +/* 111 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _command = __webpack_require__(68); + + var _command2 = _interopRequireDefault(_command); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + /** + * @author NHN Ent. FE Development Team + * @fileoverview Load a background (main) image + */ + var componentNames = _consts2.default.componentNames, + commandNames = _consts2.default.commandNames; + var IMAGE_LOADER = componentNames.IMAGE_LOADER; + + + var command = { + name: commandNames.LOAD_IMAGE, + + /** + * Load a background (main) image + * @param {Graphics} graphics - Graphics instance + * @param {string} imageName - Image name + * @param {string} imgUrl - Image Url + * @returns {Promise} + */ + execute: function execute(graphics, imageName, imgUrl) { + var loader = graphics.getComponent(IMAGE_LOADER); + var prevImage = loader.getCanvasImage(); + var prevImageWidth = prevImage ? prevImage.width : 0; + var prevImageHeight = prevImage ? prevImage.height : 0; + + this.undoData = { + name: loader.getImageName(), + image: prevImage, + objects: graphics.removeAll(true) + }; + + return loader.load(imageName, imgUrl).then(function (newImage) { + return { + oldWidth: prevImageWidth, + oldHeight: prevImageHeight, + newWidth: newImage.width, + newHeight: newImage.height + }; + }); + }, + + /** + * @param {Graphics} graphics - Graphics instance + * @returns {Promise} + */ + undo: function undo(graphics) { + var loader = graphics.getComponent(IMAGE_LOADER); + var _undoData = this.undoData, + objects = _undoData.objects, + name = _undoData.name, + image = _undoData.image; + + + graphics.removeAll(true); + graphics.add(objects); + + return loader.load(name, image); + } + }; + + _command2.default.register(command); + + module.exports = command; + +/***/ }), +/* 112 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _command = __webpack_require__(68); + + var _command2 = _interopRequireDefault(_command); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + /** + * @author NHN Ent. FE Development Team + * @fileoverview Remove a filter from an image + */ + var componentNames = _consts2.default.componentNames, + commandNames = _consts2.default.commandNames; + var FILTER = componentNames.FILTER; + + + var command = { + name: commandNames.REMOVE_FILTER, + + /** + * Remove a filter from an image + * @param {Graphics} graphics - Graphics instance + * @param {string} type - Filter type + * @returns {Promise} + */ + execute: function execute(graphics, type) { + var filterComp = graphics.getComponent(FILTER); + + this.undoData.options = filterComp.getOptions(type); + + return filterComp.remove(type); + }, + + /** + * @param {Graphics} graphics - Graphics instance + * @param {string} type - Filter type + * @returns {Promise} + */ + undo: function undo(graphics, type) { + var filterComp = graphics.getComponent(FILTER); + var options = this.undoData.options; + + + return filterComp.add(type, options); + } + }; + + _command2.default.register(command); + + module.exports = command; + +/***/ }), +/* 113 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _command = __webpack_require__(68); + + var _command2 = _interopRequireDefault(_command); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + var commandNames = _consts2.default.commandNames, + rejectMessages = _consts2.default.rejectMessages; /** + * @author NHN Ent. FE Development Team + * @fileoverview Remove an object + */ + + var command = { + name: commandNames.REMOVE_OBJECT, + + /** + * Remove an object + * @param {Graphics} graphics - Graphics instance + * @param {number} id - object id + * @returns {Promise} + */ + execute: function execute(graphics, id) { + var _this = this; + + return new _promise2.default(function (resolve, reject) { + _this.undoData.objects = graphics.removeObjectById(id); + if (_this.undoData.objects.length) { + resolve(); + } else { + reject(rejectMessages.noObject); + } + }); + }, + + /** + * @param {Graphics} graphics - Graphics instance + * @returns {Promise} + */ + undo: function undo(graphics) { + graphics.add(this.undoData.objects); + + return _promise2.default.resolve(); + } + }; + + _command2.default.register(command); + + module.exports = command; + +/***/ }), +/* 114 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _command = __webpack_require__(68); + + var _command2 = _interopRequireDefault(_command); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + var commandNames = _consts2.default.commandNames; /** + * @author NHN Ent. FE Development Team + * @fileoverview Resize a canvas + */ + + var command = { + name: commandNames.RESIZE_CANVAS_DIMENSION, + + /** + * resize the canvas with given dimension + * @param {Graphics} graphics - Graphics instance + * @param {{width: number, height: number}} dimension - Max width & height + * @returns {Promise} + */ + execute: function execute(graphics, dimension) { + var _this = this; + + return new _promise2.default(function (resolve) { + _this.undoData.size = { + width: graphics.cssMaxWidth, + height: graphics.cssMaxHeight + }; + + graphics.setCssMaxDimension(dimension); + graphics.adjustCanvasDimension(); + resolve(); + }); + }, + + /** + * @param {Graphics} graphics - Graphics instance + * @returns {Promise} + */ + undo: function undo(graphics) { + graphics.setCssMaxDimension(this.undoData.size); + graphics.adjustCanvasDimension(); + + return _promise2.default.resolve(); + } + }; + + _command2.default.register(command); + + module.exports = command; + +/***/ }), +/* 115 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _command = __webpack_require__(68); + + var _command2 = _interopRequireDefault(_command); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + /** + * @author NHN Ent. FE Development Team + * @fileoverview Rotate an image + */ + var componentNames = _consts2.default.componentNames, + commandNames = _consts2.default.commandNames; + var ROTATION = componentNames.ROTATION; + + + var command = { + name: commandNames.ROTATE_IMAGE, + + /** + * Rotate an image + * @param {Graphics} graphics - Graphics instance + * @param {string} type - 'rotate' or 'setAngle' + * @param {number} angle - angle value (degree) + * @returns {Promise} + */ + execute: function execute(graphics, type, angle) { + var rotationComp = graphics.getComponent(ROTATION); + + this.undoData.angle = rotationComp.getCurrentAngle(); + + return rotationComp[type](angle); + }, + + /** + * @param {Graphics} graphics - Graphics instance + * @returns {Promise} + */ + undo: function undo(graphics) { + var rotationComp = graphics.getComponent(ROTATION); + var angle = this.undoData.angle; + + + return rotationComp.setAngle(angle); + } + }; + + _command2.default.register(command); + + module.exports = command; + +/***/ }), +/* 116 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _tuiCodeSnippet = __webpack_require__(2); + + var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + + var _command = __webpack_require__(68); + + var _command2 = _interopRequireDefault(_command); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + /** + * @author NHN Ent. FE Development Team + * @fileoverview Set object properties + */ + var commandNames = _consts2.default.commandNames, + rejectMessages = _consts2.default.rejectMessages; + + + var command = { + name: commandNames.SET_OBJECT_PROPERTIES, + + /** + * Set object properties + * @param {Graphics} graphics - Graphics instance + * @param {number} id - object id + * @param {Object} props - properties + * @param {string} [props.fill] Color + * @param {string} [props.fontFamily] Font type for text + * @param {number} [props.fontSize] Size + * @param {string} [props.fontStyle] Type of inclination (normal / italic) + * @param {string} [props.fontWeight] Type of thicker or thinner looking (normal / bold) + * @param {string} [props.textAlign] Type of text align (left / center / right) + * @param {string} [props.textDecoraiton] Type of line (underline / line-throgh / overline) + * @returns {Promise} + */ + execute: function execute(graphics, id, props) { + var _this = this; + + var targetObj = graphics.getObject(id); + + if (!targetObj) { + return _promise2.default.reject(rejectMessages.noObject); + } + + this.undoData.props = {}; + _tuiCodeSnippet2.default.forEachOwnProperties(props, function (value, key) { + _this.undoData.props[key] = targetObj[key]; + }); + + graphics.setObjectProperties(id, props); + + return _promise2.default.resolve(); + }, + + /** + * @param {Graphics} graphics - Graphics instance + * @param {number} id - object id + * @returns {Promise} + */ + undo: function undo(graphics, id) { + var props = this.undoData.props; + + + graphics.setObjectProperties(id, props); + + return _promise2.default.resolve(); + } + }; + + _command2.default.register(command); + + module.exports = command; + +/***/ }), +/* 117 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _command = __webpack_require__(68); + + var _command2 = _interopRequireDefault(_command); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _consts = __webpack_require__(72); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + var commandNames = _consts2.default.commandNames, + rejectMessages = _consts2.default.rejectMessages; /** + * @author NHN Ent. FE Development Team + * @fileoverview Set object properties + */ + + var command = { + name: commandNames.SET_OBJECT_POSITION, + + /** + * Set object properties + * @param {Graphics} graphics - Graphics instance + * @param {number} id - object id + * @param {Object} posInfo - position object + * @param {number} posInfo.x - x position + * @param {number} posInfo.y - y position + * @param {string} posInfo.originX - can be 'left', 'center', 'right' + * @param {string} posInfo.originY - can be 'top', 'center', 'bottom' + * @returns {Promise} + */ + execute: function execute(graphics, id, posInfo) { + var targetObj = graphics.getObject(id); + + if (!targetObj) { + return _promise2.default.reject(rejectMessages.noObject); + } + + this.undoData.objectId = id; + this.undoData.props = graphics.getObjectProperties(id, ['left', 'top']); + + graphics.setObjectPosition(id, posInfo); + graphics.renderAll(); + + return _promise2.default.resolve(); + }, + + /** + * @param {Graphics} graphics - Graphics instance + * @returns {Promise} + */ + undo: function undo(graphics) { + var _undoData = this.undoData, + objectId = _undoData.objectId, + props = _undoData.props; + + + graphics.setObjectProperties(objectId, props); + graphics.renderAll(); + + return _promise2.default.resolve(); + } + }; + + _command2.default.register(command); + + module.exports = command; + +/***/ }) +/******/ ]) +}); +; \ No newline at end of file diff --git a/dist/tui-image-editor.min.js b/dist/tui-image-editor.min.js new file mode 100644 index 000000000..5619334a6 --- /dev/null +++ b/dist/tui-image-editor.min.js @@ -0,0 +1,10 @@ +/*! + * tui-image-editor.min.js + * @version 3.0.0 + * @author NHNEnt FE Development Lab + * @license MIT + */ +!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("fabric"),require("tui-code-snippet")):"function"==typeof define&&define.amd?define(["fabric","tui-code-snippet"],t):"object"==typeof exports?exports.ImageEditor=t(require("fabric"),require("tui-code-snippet")):(e.tui=e.tui||{},e.tui.ImageEditor=t(e.fabric,e.tui&&e.tui.util))}(this,function(e,t){return function(e){function t(r){if(n[r])return n[r].exports;var i=n[r]={exports:{},id:r,loaded:!1};return e[r].call(i.exports,i,i.exports,t),i.loaded=!0,i.exports}var n={};return t.m=e,t.c=n,t.p="dist",t(0)}([function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(83),o=r(i);n(41),n(42),n(43),n(44),n(45),n(46),n(47),n(48),n(49),n(50),n(51),n(52),n(53),n(54),n(55),n(56),n(57),n(59),n(58),e.exports=o.default},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(9),o=r(i);e.exports={componentNames:o.default.keyMirror("IMAGE_LOADER","CROPPER","FLIP","ROTATION","FREE_DRAWING","LINE","TEXT","ICON","FILTER","SHAPE"),commandNames:{CLEAR_OBJECTS:"clearObjects",LOAD_IMAGE:"loadImage",FLIP_IMAGE:"flip",ROTATE_IMAGE:"rotate",ADD_OBJECT:"addObject",REMOVE_OBJECT:"removeObject",APPLY_FILTER:"applyFilter",REMOVE_FILTER:"removeFilter",ADD_ICON:"addIcon",CHANGE_ICON_COLOR:"changeIconColor",ADD_SHAPE:"addShape",CHANGE_SHAPE:"changeShape",ADD_TEXT:"addText",CHANGE_TEXT:"changeText",CHANGE_TEXT_STYLE:"changeTextStyle",ADD_IMAGE_OBJECT:"addImageObject",RESIZE_CANVAS_DIMENSION:"resizeCanvasDimension",SET_OBJECT_PROPERTIES:"setObjectProperties",SET_OBJECT_POSITION:"setObjectPosition"},eventNames:{OBJECT_ACTIVATED:"objectActivated",OBJECT_MOVED:"objectMoved",OBJECT_SCALED:"objectScaled",TEXT_EDITING:"textEditing",TEXT_CHANGED:"textChanged",ADD_TEXT:"addText",ADD_OBJECT:"addObject",MOUSE_DOWN:"mousedown",REDO_STACK_CHANGED:"redoStackChanged",UNDO_STACK_CHANGED:"undoStackChanged"},drawingModes:o.default.keyMirror("NORMAL","CROPPER","FREE_DRAWING","LINE_DRAWING","TEXT","SHAPE"),keyCodes:{Z:90,Y:89,SHIFT:16,BACKSPACE:8,DEL:46},fObjectOptions:{SELECTION_STYLE:{borderColor:"red",cornerColor:"green",cornerSize:10,originX:"center",originY:"center",transparentCorners:!1}},rejectMessages:{flip:"The flipX and flipY setting values are not changed.",rotation:"The current angle is same the old angle.",loadImage:"The background image is empty.",isLock:"The executing command state is locked.",undo:"The promise of undo command is reject.",redo:"The promise of redo command is reject.",invalidDrawingMode:"This operation is not supported in the drawing mode",invalidParameters:"Invalid parameters",noActiveObject:"There is no active object.",unsupportedType:"Unsupported object type",noObject:"The object is not in canvas.",addedObject:"The object is already added."}}},function(e,t,n){n(114),n(116),n(117),n(115),e.exports=n(13).Promise},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e){var t=u[e];if(t){for(var n=arguments.length,r=Array(n>1?n-1:0),i=1;in&&(r=t,t=n,n=r),o(t,i(e,n))},keyMirror:function(){for(var e={},t=arguments.length,n=Array(t),i=0;i0?r:n)(e)}},function(e,t,n){var r=n(92),i=n(22);e.exports=function(e){return r(i(e))}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(9),s=(0,a.keyMirror)("UN_IMPLEMENTATION","NO_COMPONENT_NAME"),u={UN_IMPLEMENTATION:"Should implement a method: ",NO_COMPONENT_NAME:"Should set a component name"},c={UN_IMPLEMENTATION:function(e){return u.UN_IMPLEMENTATION+e},NO_COMPONENT_NAME:function(){return u.NO_COMPONENT_NAME}};e.exports={types:o.default.extend({},s),create:function(e){e=e.toLowerCase();for(var t=c[e],n=arguments.length,r=Array(n>1?n-1:0),i=1;in;)t.push(arguments[n++]);return g[++v]=function(){s("function"==typeof e?e:Function(e),t)},r(v),v},d=function(e){delete g[e]},"process"==n(16)(f)?r=function(e){f.nextTick(a(y,e,1))}:p?(i=new p,o=i.port2,i.port1.onmessage=m,r=a(o.postMessage,o,1)):l.addEventListener&&"function"==typeof postMessage&&!l.importScripts?(r=function(e){l.postMessage(e+"","*")},l.addEventListener("message",m,!1)):r=_ in c("script")?function(e){u.appendChild(c("script"))[_]=function(){u.removeChild(this),y.call(e)}}:function(e){setTimeout(a(y,e,1),0)}),e.exports={set:h,clear:d}},function(e,t,n){var r=n(26),i=Math.min;e.exports=function(e){return e>0?i(r(e),9007199254740991):0}},function(e,t){var n=0,r=Math.random();e.exports=function(e){return"Symbol(".concat(void 0===e?"":e,")_",(++n+r).toString(36))}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.commandNames,h=l.ICON,d={name:f.ADD_ICON,execute:function(e,t,n){var r=this,i=e.getComponent(h);return i.add(t,n).then(function(t){return r.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(d),e.exports=d},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f={name:l.ADD_IMAGE_OBJECT,execute:function(e,t){var n=this;return e.addImageObject(t).then(function(t){return n.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f=c.default.rejectMessages,h={name:l.ADD_OBJECT,execute:function(e,t){return new s.default(function(n,r){e.contains(t)?r(f.addedObject):(e.add(t),n(t))})},undo:function(e,t){return new s.default(function(n,r){e.contains(t)?(e.remove(t),n(t)):r(f.noObject)})}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.commandNames,h=l.SHAPE,d={name:f.ADD_SHAPE,execute:function(e,t,n){var r=this,i=e.getComponent(h);return i.add(t,n).then(function(t){return r.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(d),e.exports=d},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.commandNames,h=l.TEXT,d={name:f.ADD_TEXT,execute:function(e,t,n){var r=this,i=e.getComponent(h);return i.add(t,n).then(function(t){return r.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(d),e.exports=d},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.rejectMessages,l=s.default.commandNames,f=u.FILTER,h={name:l.APPLY_FILTER,execute:function(e,t,n){var r=e.getComponent(f);if("mask"===t){var i=e.getObject(n.maskObjId);if(!i||!i.isType("image"))return Promise.reject(c.invalidParameters);n={mask:i}}return"mask"===t?(this.undoData.object=n.mask,e.remove(n.mask)):this.undoData.options=r.getOptions(t),r.add(t,n)},undo:function(e,t){var n=e.getComponent(f);if("mask"===t){var r=this.undoData.object;return e.add(r),e.setActiveObject(r),n.remove(t)}return this.undoData.options?n.add(t,this.undoData.options):n.remove(t)}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.rejectMessages,h=c.default.commandNames,d=l.ICON,p={name:h.CHANGE_ICON_COLOR,execute:function(e,t,n){var r=this;return new s.default(function(i,o){var a=e.getComponent(d),s=e.getObject(t);s||o(f.noObject),r.undoData.object=s,r.undoData.color=a.getColor(s),a.setColor(n,s),i()})},undo:function(e){var t=e.getComponent(d),n=this.undoData.object,r=n.object,i=n.color;return t.setColor(i,r),s.default.resolve()}};o.default.register(p),e.exports=p},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(3),s=r(a),u=n(2),c=r(u),l=n(1),f=r(l),h=f.default.componentNames,d=f.default.rejectMessages,p=f.default.commandNames,v=h.SHAPE,g={name:p.CHANGE_SHAPE,execute:function(e,t,n){var r=this,i=e.getComponent(v),a=e.getObject(t);return a?(this.undoData.object=a,this.undoData.options={},o.default.forEachOwnProperties(n,function(e,t){r.undoData.options[t]=a[t]}),i.change(a,n)):c.default.reject(d.noObject)},undo:function(e){var t=e.getComponent(v),n=this.undoData,r=n.object,i=n.options;return t.change(r,i)}};s.default.register(g),e.exports=g},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.rejectMessages,h=c.default.commandNames,d=l.TEXT,p={name:h.CHANGE_TEXT,execute:function(e,t,n){var r=e.getComponent(d),i=e.getObject(t);return i?(this.undoData.object=i,this.undoData.text=r.getText(i),r.change(i,n)):s.default.reject(f.noObject)},undo:function(e){var t=e.getComponent(d),n=this.undoData,r=n.object,i=n.text;return t.change(r,i)}};o.default.register(p),e.exports=p},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(3),s=r(a),u=n(2),c=r(u),l=n(1),f=r(l),h=f.default.componentNames,d=f.default.rejectMessages,p=f.default.commandNames,v=h.TEXT,g={name:p.CHANGE_TEXT_STYLE,execute:function(e,t,n){var r=this,i=e.getComponent(v),a=e.getObject(t);return a?(this.undoData.object=a,this.undoData.styles={},o.default.forEachOwnProperties(n,function(e,t){r.undoData.styles[t]=a[t]}),i.setStyle(a,n)):c.default.reject(d.noObject)},undo:function(e){var t=e.getComponent(v),n=this.undoData,r=n.object,i=n.styles;return t.setStyle(r,i)}};s.default.register(g),e.exports=g},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f={name:l.CLEAR_OBJECTS,execute:function(e){var t=this;return new s.default(function(n){t.undoData.objects=e.removeAll(),n()})},undo:function(e){return e.add(this.undoData.objects),s.default.resolve()}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.FLIP,f={name:c.FLIP_IMAGE,execute:function(e,t){var n=e.getComponent(l);return this.undoData.setting=n.getCurrentSetting(),n[t]()},undo:function(e){var t=e.getComponent(l);return t.set(this.undoData.setting)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.IMAGE_LOADER,f={name:c.LOAD_IMAGE,execute:function(e,t,n){var r=e.getComponent(l),i=r.getCanvasImage(),o=i?i.width:0,a=i?i.height:0;return this.undoData={name:r.getImageName(),image:i,objects:e.removeAll(!0)},r.load(t,n).then(function(e){return{oldWidth:o,oldHeight:a,newWidth:e.width,newHeight:e.height}})},undo:function(e){var t=e.getComponent(l),n=this.undoData,r=n.objects,i=n.name,o=n.image;return e.removeAll(!0),e.add(r),t.load(i,o)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.FILTER,f={name:c.REMOVE_FILTER,execute:function(e,t){var n=e.getComponent(l);return this.undoData.options=n.getOptions(t),n.remove(t)},undo:function(e,t){var n=e.getComponent(l),r=this.undoData.options;return n.add(t,r)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f=c.default.rejectMessages,h={name:l.REMOVE_OBJECT,execute:function(e,t){var n=this;return new s.default(function(r,i){n.undoData.objects=e.removeObjectById(t),n.undoData.objects.length?r():i(f.noObject)})},undo:function(e){return e.add(this.undoData.objects),s.default.resolve()}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f={name:l.RESIZE_CANVAS_DIMENSION,execute:function(e,t){var n=this;return new s.default(function(r){n.undoData.size={width:e.cssMaxWidth,height:e.cssMaxHeight},e.setCssMaxDimension(t),e.adjustCanvasDimension(),r()})},undo:function(e){return e.setCssMaxDimension(this.undoData.size),e.adjustCanvasDimension(),s.default.resolve()}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.ROTATION,f={name:c.ROTATE_IMAGE,execute:function(e,t,n){var r=e.getComponent(l);return this.undoData.angle=r.getCurrentAngle(),r[t](n)},undo:function(e){var t=e.getComponent(l),n=this.undoData.angle;return t.setAngle(n)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f=c.default.rejectMessages,h={name:l.SET_OBJECT_POSITION,execute:function(e,t,n){var r=e.getObject(t);return r?(this.undoData.objectId=t,this.undoData.props=e.getObjectProperties(t,["left","top"]),e.setObjectPosition(t,n),e.renderAll(),s.default.resolve()):s.default.reject(f.noObject)},undo:function(e){var t=this.undoData,n=t.objectId,r=t.props;return e.setObjectProperties(n,r),e.renderAll(),s.default.resolve()}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(3),s=r(a),u=n(2),c=r(u),l=n(1),f=r(l),h=f.default.commandNames,d=f.default.rejectMessages,p={name:h.SET_OBJECT_PROPERTIES,execute:function(e,t,n){var r=this,i=e.getObject(t);return i?(this.undoData.props={},o.default.forEachOwnProperties(n,function(e,t){r.undoData.props[t]=i[t]}),e.setObjectProperties(t,n),c.default.resolve()):c.default.reject(d.noObject)},undo:function(e,t){var n=this.undoData.props;return e.setObjectProperties(t,n),c.default.resolve()}};s.default.register(p),e.exports=p},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;nv&&(o.remove(),o.set(this._calcRectDimensionFromPoint(r,i)),t.add(o))}},{key:"_calcRectDimensionFromPoint",value:function(e,t){var n=this.getCanvas(),r=n.getWidth(),i=n.getHeight(),o=this._startX,a=this._startY,s=(0,p.clamp)(e,0,o),u=(0,p.clamp)(t,0,a),c=(0,p.clamp)(e,o,r)-s,l=(0,p.clamp)(t,a,i)-u;return this._withShiftKey&&(c>l?l=c:l>c&&(c=l),o>=e&&(s=o-c),a>=t&&(u=a-l)),{left:s,top:u,width:c,height:l}}},{key:"_onFabricMouseUp",value:function(){var e=this._cropzone,t=this._listeners,n=this.getCanvas();n.setActiveObject(e),n.off({"mouse:move":t.mousemove,"mouse:up":t.mouseup})}},{key:"getCroppedImageData",value:function(e){var t=this.getCanvas(),n=t.contains(this._cropzone);if(!e)return null;n&&this._cropzone.remove();var r={imageName:this.getImageName(),url:t.toDataURL(e)};return n&&t.add(this._cropzone),r}},{key:"getCropzoneRect",value:function(){var e=this._cropzone;return e.isValid()?{left:e.getLeft(),top:e.getTop(),width:e.getWidth(),height:e.getHeight()}:null}},{key:"_onKeyDown",value:function(e){e.keyCode===d.keyCodes.SHIFT&&(this._withShiftKey=!0)}},{key:"_onKeyUp",value:function(e){e.keyCode===d.keyCodes.SHIFT&&(this._withShiftKey=!1)}}]),t}(l.default);e.exports=g},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;nn},_getColor:function(e,t,n){var r=[0,0,0,0],i=e.data,o=e.width,a=4,s=(o*n+t)*a;return r[0]=i[s],r[1]=i[s+1],r[2]=i[s+2],r[3]=i[s+3],r}});e.exports=i},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(4),s=n(9),u="tl",c="tr",l="mt",f="ml",h="mr",d="mb",p="bl",v="br",g=a.fabric.util.createClass(a.fabric.Rect,{initialize:function(e){e.type="cropzone",this.callSuper("initialize",e),this.on({moving:this._onMoving,scaling:this._onScaling})},_render:function(e){var t=7,n=7;this.callSuper("_render",e);var r=this.flipX?-1:1,i=this.flipY?-1:1,o=r/this.scaleX,a=i/this.scaleY;e.scale(o,a),this._fillOuterRect(e,"rgba(0, 0, 0, 0.55)"),this._strokeBorder(e,"rgb(0, 0, 0)",t),this._strokeBorder(e,"rgb(255, 255, 255)",t,n),e.scale(1/o,1/a)},_fillOuterRect:function(e,t){var n=this._getCoordinates(e),r=n.x,i=n.y;e.save(),e.fillStyle=t,e.beginPath(),e.moveTo(r[0]-1,i[0]-1),e.lineTo(r[3]+1,i[0]-1),e.lineTo(r[3]+1,i[3]+1),e.lineTo(r[0]-1,i[3]-1),e.lineTo(r[0]-1,i[0]-1),e.closePath(),e.moveTo(r[1],i[1]),e.lineTo(r[1],i[2]),e.lineTo(r[2],i[2]),e.lineTo(r[2],i[1]),e.lineTo(r[1],i[1]),e.closePath(),e.fill(),e.restore()},_getCoordinates:function(e){var t=this.getWidth(),n=this.getHeight(),r=t/2,i=n/2,a=this.getLeft(),s=this.getTop(),u=e.canvas;return{x:o.default.map([-(r+a),-r,r,r+(u.width-a-t)],Math.ceil),y:o.default.map([-(i+s),-i,i,i+(u.height-s-n)],Math.ceil)}},_strokeBorder:function(e,t,n,r){var i=this.getWidth()/2,o=this.getHeight()/2;e.save(),e.strokeStyle=t,e.setLineDash&&e.setLineDash([n,n]),r&&(e.lineDashOffset=r),e.beginPath(),e.moveTo(-i,-o),e.lineTo(i,-o),e.lineTo(i,o),e.lineTo(-i,o),e.lineTo(-i,-o),e.stroke(),e.restore()},_onMoving:function(){var e=this.getLeft(),t=this.getTop(),n=this.getWidth(),r=this.getHeight(),i=this.canvas.getWidth()-n,o=this.canvas.getHeight()-r;this.setLeft((0,s.clamp)(e,0,i)),this.setTop((0,s.clamp)(t,0,o))},_onScaling:function(e){var t=this.canvas.getPointer(e.e),n=this._calcScalingSizeFromPointer(t);this.scale(1).set(n)},_calcScalingSizeFromPointer:function(e){var t=e.x,n=e.y,r=this._calcTopLeftScalingSizeFromPointer(t,n),i=this._calcBottomRightScalingSizeFromPointer(t,n); +return this._makeScalingSettings(r,i)},_calcTopLeftScalingSizeFromPointer:function(e,t){var n=this.getHeight()+this.top,r=this.getWidth()+this.left,i=(0,s.clamp)(t,0,n-1),o=(0,s.clamp)(e,0,r-1);return{top:i,left:o,width:r-o,height:n-i}},_calcBottomRightScalingSizeFromPointer:function(e,t){var n=this.canvas,r=n.width,i=n.height,o=this.left,a=this.top;return{width:(0,s.clamp)(e,o+1,r)-o,height:(0,s.clamp)(t,a+1,i)-a}},_makeScalingSettings:function(e,t){var n=e.width,r=e.height,i=t.height,o=t.width,a=e.left,s=e.top,g=void 0;switch(this.__corner){case u:g=e;break;case c:g={width:o,height:r,top:s};break;case p:g={width:n,height:i,left:a};break;case v:g=t;break;case f:g={width:n,left:a};break;case l:g={height:r,top:s};break;case h:g={width:o};break;case d:g={height:i}}return g},isValid:function(){return this.left>=0&&this.top>=0&&this.width>0&&this.height>0}});e.exports=g},function(e,t,n){"use strict";var r=n(4),i=r.fabric.util.createClass(r.fabric.Image.filters.Convolute,{type:"Emboss",initialize:function(){var e=[1,1,1,1,.7,-1,-1,-1,-1];this.matrix=e}});e.exports=i},function(e,t,n){"use strict";var r=n(4),i=r.fabric.util.createClass(r.fabric.Image.filters.Mask,{applyTo:function(e){if(this.mask){var t=e.width,n=e.height,r=this._createCanvasOfMask(t,n),i=e.getContext("2d"),o=r.getContext("2d"),a=i.getImageData(0,0,t,n);this._drawMask(o,e,i),this._mapData(o,a,t,n),i.putImageData(a,0,0)}},_createCanvasOfMask:function(e,t){var n=r.fabric.util.createCanvasElement();return n.width=e,n.height=t,n},_drawMask:function(e){var t=this.mask,n=t.getElement(),r=t.getLeft(),i=t.getTop(),o=t.getAngle();e.save(),e.translate(r,i),e.rotate(o*Math.PI/180),e.scale(t.scaleX,t.scaleY),e.drawImage(n,-n.width/2,-n.height/2),e.restore()},_mapData:function(e,t,n,r){for(var i=t.data,o=e.getImageData(0,0,n,r).data,a=this.channel,s=t.width*t.height*4,u=0;uu?"right":"left",originY:i>c?"bottom":"top"}}function i(e){return"center"===e.getOriginX()&&"center"===e.getOriginY()}function o(e,t){var n=t.getPointByOrigin("center","center"),i=-t.getAngle(),o=r(n,e,i),a=o.originX,s=o.originY,u=t.getPointByOrigin(a,s),c=t.getLeft()-(n.x-u.x),l=t.getTop()-(n.x-u.y);t.set({originX:a,originY:s,left:c,top:l}),t.setCoords()}function a(e,t){var n=t.startPoint,i=-t.getAngle(),o=r(n,e,i),a=o.originX,s=o.originY;t.setPositionByOrigin(n,a,s)}function s(e){var t=e.type,n=e.scaleX,r=e.scaleY,i=l[t],o=e[i.w]*n,a=e[i.h]*r;if(e.isRegular){var s=Math.max(n,r);o=e[i.w]*s,a=e[i.h]*s}var u={hasControls:!1,hasBorders:!1,scaleX:1,scaleY:1};u[i.w]=o,u[i.h]=a,e.set(u)}function u(e,t){var n=t.type,r=t.strokeWidth,i=t.startPoint,o=c[n],a=l[n],s=!("triangle"!==t.type),u={},f=Math.abs(i.x-e.x)/o,h=Math.abs(i.y-e.y)/o;f>r&&(f-=r/o),h>r&&(h-=r/o),t.isRegular&&(f=h=Math.max(f,h),s&&(h=Math.sqrt(3)/2*f)),u[a.w]=f,u[a.h]=h,t.set(u)}var c={rect:1,circle:2,triangle:1},l={rect:{w:"width",h:"height"},circle:{w:"rx",h:"ry"},triangle:{w:"width",h:"height"}};e.exports={setOrigins:function(e){var t=e.getPointByOrigin("left","top"),n=e.getPointByOrigin("right","top"),r=e.getPointByOrigin("right","bottom"),i=e.getPointByOrigin("left","bottom");e.origins={lt:t,rt:n,rb:r,lb:i}},resize:function(e,t,r){i(e)&&(o(t,e),n(e)),r?s(e,t):u(t,e),a(t,e)},adjustOriginToCenter:function(e){var t=e.getPointByOrigin("center","center"),n=e.getOriginX(),r=e.getOriginY(),i=e.getPointByOrigin(n,r),o=e.getLeft()+(t.x-i.x),a=e.getTop()+(t.y-i.y);e.set({hasControls:!0,hasBorders:!0,originX:"center",originY:"center",left:o,top:a}),e.setCoords()}}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var o=function(){function e(e,t){for(var n=0;n1?n-1:0),i=1;il;)if(s=u[l++],s!=s)return!0}else for(;c>l;l++)if((e||l in u)&&u[l]===n)return e||l||0;return!e&&-1}}},function(e,t,n){var r=n(17),i=n(94),o=n(93),a=n(10),s=n(39),u=n(112),c={},l={},t=e.exports=function(e,t,n,f,h){var d,p,v,g,_=h?function(){return e}:u(e),y=r(n,f,t?2:1),m=0;if("function"!=typeof _)throw TypeError(e+" is not iterable!");if(o(_)){for(d=s(e.length);d>m;m++)if(g=t?y(a(p=e[m])[0],p[1]):y(e[m]),g===c||g===l)return g}else for(v=_.call(e);!(p=v.next()).done;)if(g=i(v,y,p.value,t),g===c||g===l)return g};t.BREAK=c,t.RETURN=l},function(e,t,n){e.exports=!n(14)&&!n(32)(function(){return 7!=Object.defineProperty(n(23)("div"),"a",{get:function(){return 7}}).a})},function(e,t){e.exports=function(e,t,n){var r=void 0===n;switch(t.length){case 0:return r?e():e.call(n);case 1:return r?e(t[0]):e.call(n,t[0]);case 2:return r?e(t[0],t[1]):e.call(n,t[0],t[1]);case 3:return r?e(t[0],t[1],t[2]):e.call(n,t[0],t[1],t[2]);case 4:return r?e(t[0],t[1],t[2],t[3]):e.call(n,t[0],t[1],t[2],t[3])}return e.apply(n,t)}},function(e,t,n){var r=n(16);e.exports=Object("z").propertyIsEnumerable(0)?Object:function(e){return"String"==r(e)?e.split(""):Object(e)}},function(e,t,n){var r=n(15),i=n(6)("iterator"),o=Array.prototype;e.exports=function(e){return void 0!==e&&(r.Array===e||o[i]===e)}},function(e,t,n){var r=n(10);e.exports=function(e,t,n,i){try{return i?t(r(n)[0],n[1]):t(n)}catch(t){var o=e.return;throw void 0!==o&&r(o.call(e)),t}}},function(e,t,n){"use strict";var r=n(99),i=n(36),o=n(24),a={};n(11)(a,n(6)("iterator"),function(){return this}),e.exports=function(e,t,n){e.prototype=r(a,{next:i(1,n)}),o(e,t+" Iterator")}},function(e,t,n){var r=n(6)("iterator"),i=!1;try{var o=[7][r]();o.return=function(){i=!0},Array.from(o,function(){throw 2})}catch(e){}e.exports=function(e,t){if(!t&&!i)return!1;var n=!1;try{var o=[7],a=o[r]();a.next=function(){return{done:n=!0}},o[r]=function(){return a},e(o)}catch(e){}return n}},function(e,t){e.exports=function(e,t){return{value:t,done:!!e}}},function(e,t,n){var r=n(8),i=n(38).set,o=r.MutationObserver||r.WebKitMutationObserver,a=r.process,s=r.Promise,u="process"==n(16)(a);e.exports=function(){var e,t,n,c=function(){var r,i;for(u&&(r=a.domain)&&r.exit();e;){i=e.fn,e=e.next;try{i()}catch(r){throw e?n():t=void 0,r}}t=void 0,r&&r.enter()};if(u)n=function(){a.nextTick(c)};else if(o){var l=!0,f=document.createTextNode("");new o(c).observe(f,{characterData:!0}),n=function(){f.data=l=!l}}else if(s&&s.resolve){var h=s.resolve();n=function(){h.then(c)}}else n=function(){i.call(r,c)};return function(r){var i={fn:r,next:void 0};t&&(t.next=i),e||(e=i,n()),t=i}}},function(e,t,n){var r=n(10),i=n(100),o=n(30),a=n(25)("IE_PROTO"),s=function(){},u="prototype",c=function(){var e,t=n(23)("iframe"),r=o.length,i="<",a=">";for(t.style.display="none",n(33).appendChild(t),t.src="javascript:",e=t.contentWindow.document,e.open(),e.write(i+"script"+a+"document.F=Object"+i+"/script"+a),e.close(),c=e.F;r--;)delete c[u][o[r]];return c()};e.exports=Object.create||function(e,t){var n;return null!==e?(s[u]=r(e),n=new s,s[u]=null,n[a]=e):n=c(),void 0===t?n:i(n,t)}},function(e,t,n){var r=n(20),i=n(10),o=n(103);e.exports=n(14)?Object.defineProperties:function(e,t){i(e);for(var n,a=o(t),s=a.length,u=0;s>u;)r.f(e,n=a[u++],t[n]);return e}},function(e,t,n){var r=n(18),i=n(110),o=n(25)("IE_PROTO"),a=Object.prototype;e.exports=Object.getPrototypeOf||function(e){return e=i(e),r(e,o)?e[o]:"function"==typeof e.constructor&&e instanceof e.constructor?e.constructor.prototype:e instanceof Object?a:null}},function(e,t,n){var r=n(18),i=n(27),o=n(88)(!1),a=n(25)("IE_PROTO");e.exports=function(e,t){var n,s=i(e),u=0,c=[];for(n in s)n!=a&&r(s,n)&&c.push(n);for(;t.length>u;)r(s,n=t[u++])&&(~o(c,n)||c.push(n));return c}},function(e,t,n){var r=n(102),i=n(30);e.exports=Object.keys||function(e){return r(e,i)}},function(e,t,n){var r=n(11);e.exports=function(e,t,n){for(var i in t)n&&e[i]?e[i]=t[i]:r(e,i,t[i]);return e}},function(e,t,n){e.exports=n(11)},function(e,t,n){"use strict";var r=n(8),i=n(13),o=n(20),a=n(14),s=n(6)("species");e.exports=function(e){var t="function"==typeof i[e]?i[e]:r[e];a&&t&&!t[s]&&o.f(t,s,{configurable:!0,get:function(){return this}})}},function(e,t,n){var r=n(10),i=n(21),o=n(6)("species");e.exports=function(e,t){var n,a=r(e).constructor;return void 0===a||void 0==(n=r(a)[o])?t:i(n)}},function(e,t,n){var r=n(26),i=n(22);e.exports=function(e){return function(t,n){var o,a,s=String(i(t)),u=r(n),c=s.length;return u<0||u>=c?e?"":void 0:(o=s.charCodeAt(u),o<55296||o>56319||u+1===c||(a=s.charCodeAt(u+1))<56320||a>57343?e?s.charAt(u):o:e?s.slice(u,u+2):(o-55296<<10)+(a-56320)+65536)}}},function(e,t,n){var r=n(26),i=Math.max,o=Math.min;e.exports=function(e,t){return e=r(e),e<0?i(e+t,0):o(e,t)}},function(e,t,n){var r=n(22);e.exports=function(e){return Object(r(e))}},function(e,t,n){var r=n(19);e.exports=function(e,t){if(!r(e))return e;var n,i;if(t&&"function"==typeof(n=e.toString)&&!r(i=n.call(e)))return i;if("function"==typeof(n=e.valueOf)&&!r(i=n.call(e)))return i;if(!t&&"function"==typeof(n=e.toString)&&!r(i=n.call(e)))return i;throw TypeError("Can't convert object to primitive value")}},function(e,t,n){var r=n(29),i=n(6)("iterator"),o=n(15);e.exports=n(13).getIteratorMethod=function(e){if(void 0!=e)return e[i]||e["@@iterator"]||o[r(e)]}},function(e,t,n){"use strict";var r=n(86),i=n(97),o=n(15),a=n(27);e.exports=n(34)(Array,"Array",function(e,t){this._t=a(e),this._i=0,this._k=t},function(){ +var e=this._t,t=this._k,n=this._i++;return!e||n>=e.length?(this._t=void 0,i(1)):"keys"==t?i(0,n):"values"==t?i(0,e[n]):i(0,[n,e[n]])},"values"),o.Arguments=o.Array,r("keys"),r("values"),r("entries")},function(e,t){},function(e,t,n){"use strict";var r,i,o,a=n(35),s=n(8),u=n(17),c=n(29),l=n(31),f=n(19),h=n(21),d=n(87),p=n(89),v=n(107),g=n(38).set,_=n(98)(),y="Promise",m=s.TypeError,b=s.process,O=s[y],b=s.process,k="process"==c(b),w=function(){},C=!!function(){try{var e=O.resolve(1),t=(e.constructor={})[n(6)("species")]=function(e){e(w,w)};return(k||"function"==typeof PromiseRejectionEvent)&&e.then(w)instanceof t}catch(e){}}(),E=function(e,t){return e===t||e===O&&t===o},j=function(e){var t;return!(!f(e)||"function"!=typeof(t=e.then))&&t},x=function(e){return E(O,e)?new T(e):new i(e)},T=i=function(e){var t,n;this.promise=new e(function(e,r){if(void 0!==t||void 0!==n)throw m("Bad Promise constructor");t=e,n=r}),this.resolve=h(t),this.reject=h(n)},S=function(e){try{e()}catch(e){return{error:e}}},M=function(e,t){if(!e._n){e._n=!0;var n=e._c;_(function(){for(var r=e._v,i=1==e._s,o=0,a=function(t){var n,o,a=i?t.ok:t.fail,s=t.resolve,u=t.reject,c=t.domain;try{a?(i||(2==e._h&&D(e),e._h=1),a===!0?n=r:(c&&c.enter(),n=a(r),c&&c.exit()),n===t.promise?u(m("Promise-chain cycle")):(o=j(n))?o.call(n,s,u):s(n)):u(r)}catch(e){u(e)}};n.length>o;)a(n[o++]);e._c=[],e._n=!1,t&&!e._h&&P(e)})}},P=function(e){g.call(s,function(){var t,n,r,i=e._v;if(A(e)&&(t=S(function(){k?b.emit("unhandledRejection",i,e):(n=s.onunhandledrejection)?n({promise:e,reason:i}):(r=s.console)&&r.error&&r.error("Unhandled promise rejection",i)}),e._h=k||A(e)?2:1),e._a=void 0,t)throw t.error})},A=function(e){if(1==e._h)return!1;for(var t,n=e._a||e._c,r=0;n.length>r;)if(t=n[r++],t.fail||!A(t.promise))return!1;return!0},D=function(e){g.call(s,function(){var t;k?b.emit("rejectionHandled",e):(t=s.onrejectionhandled)&&t({promise:e,reason:e._v})})},I=function(e){var t=this;t._d||(t._d=!0,t=t._w||t,t._v=e,t._s=2,t._a||(t._a=t._c.slice()),M(t,!0))},N=function(e){var t,n=this;if(!n._d){n._d=!0,n=n._w||n;try{if(n===e)throw m("Promise can't be resolved itself");(t=j(e))?_(function(){var r={_w:n,_d:!1};try{t.call(e,u(N,r,1),u(I,r,1))}catch(e){I.call(r,e)}}):(n._v=e,n._s=1,M(n,!1))}catch(e){I.call({_w:n,_d:!1},e)}}};C||(O=function(e){d(this,O,y,"_h"),h(e),r.call(this);try{e(u(N,this,1),u(I,this,1))}catch(e){I.call(this,e)}},r=function(e){this._c=[],this._a=void 0,this._s=0,this._d=!1,this._v=void 0,this._h=0,this._n=!1},r.prototype=n(104)(O.prototype,{then:function(e,t){var n=x(v(this,O));return n.ok="function"!=typeof e||e,n.fail="function"==typeof t&&t,n.domain=k?b.domain:void 0,this._c.push(n),this._a&&this._a.push(n),this._s&&M(this,!1),n.promise},catch:function(e){return this.then(void 0,e)}}),T=function(){var e=new r;this.promise=e,this.resolve=u(N,e,1),this.reject=u(I,e,1)}),l(l.G+l.W+l.F*!C,{Promise:O}),n(24)(O,y),n(106)(y),o=n(13)[y],l(l.S+l.F*!C,y,{reject:function(e){var t=x(this),n=t.reject;return n(e),t.promise}}),l(l.S+l.F*(a||!C),y,{resolve:function(e){if(e instanceof O&&E(e.constructor,this))return e;var t=x(this),n=t.resolve;return n(e),t.promise}}),l(l.S+l.F*!(C&&n(96)(function(e){O.all(e).catch(w)})),y,{all:function(e){var t=this,n=x(t),r=n.resolve,i=n.reject,o=S(function(){var n=[],o=0,a=1;p(e,!1,function(e){var s=o++,u=!1;n.push(void 0),a++,t.resolve(e).then(function(e){u||(u=!0,n[s]=e,--a||r(n))},i)}),--a||r(n)});return o&&i(o.error),n.promise},race:function(e){var t=this,n=x(t),r=n.reject,i=S(function(){p(e,!1,function(e){t.resolve(e).then(n.resolve,r)})});return i&&r(i.error),n.promise}})},function(e,t,n){"use strict";var r=n(108)(!0);n(34)(String,"String",function(e){this._t=String(e),this._i=0},function(){var e,t=this._t,n=this._i;return n>=t.length?{value:void 0,done:!0}:(e=r(t,n),this._i+=e.length,{value:e,done:!1})})},function(e,t,n){n(113);for(var r=n(8),i=n(11),o=n(15),a=n(6)("toStringTag"),s=["NodeList","DOMTokenList","MediaList","StyleSheetList","CSSRuleList"],u=0;u<5;u++){var c=s[u],l=r[c],f=l&&l.prototype;f&&!f[a]&&i(f,a,c),o[c]=o.Array}}])}); \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 4537fb9f5..9fe8fcb41 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4371,7 +4371,7 @@ } }, "karma-webdriver-launcher": { - "version": "git+https://github.com/nhnent/karma-webdriver-launcher.git#a9126efddabc0e20005091349a678fc211db3bcb", + "version": "git+https://github.com/nhnent/karma-webdriver-launcher.git#ed09d73cc68b21ee631426d6abff0a3315aac958", "dev": true, "requires": { "ip": "0.3.3", From bd5cff6fc15a3b81b6bf98b363cce9d0c786e48a Mon Sep 17 00:00:00 2001 From: Dongsik Yoo Date: Thu, 31 Aug 2017 18:52:09 +0900 Subject: [PATCH 02/10] chore: create bundle files for 3.0.1 --- dist/tui-image-editor.js | 128 +++++++++++++++++++++++------------ dist/tui-image-editor.min.js | 10 +-- package-lock.json | 2 +- 3 files changed, 90 insertions(+), 50 deletions(-) diff --git a/dist/tui-image-editor.js b/dist/tui-image-editor.js index 79d468ac1..dbf9eca21 100644 --- a/dist/tui-image-editor.js +++ b/dist/tui-image-editor.js @@ -1,16 +1,16 @@ /*! * tui-image-editor.js - * @version 3.0.0 + * @version 3.0.1 * @author NHNEnt FE Development Lab * @license MIT */ (function webpackUniversalModuleDefinition(root, factory) { if(typeof exports === 'object' && typeof module === 'object') - module.exports = factory(require("tui-code-snippet"), require("fabric")); + module.exports = factory(require("tui-code-snippet"), require("fabric/dist/fabric.require")); else if(typeof define === 'function' && define.amd) - define(["tui-code-snippet", "fabric"], factory); + define(["tui-code-snippet", "fabric/dist/fabric.require"], factory); else if(typeof exports === 'object') - exports["ImageEditor"] = factory(require("tui-code-snippet"), require("fabric")); + exports["ImageEditor"] = factory(require("tui-code-snippet"), require("fabric/dist/fabric.require")); else root["tui"] = root["tui"] || {}, root["tui"]["ImageEditor"] = factory((root["tui"] && root["tui"]["util"]), root["fabric"]); })(this, function(__WEBPACK_EXTERNAL_MODULE_2__, __WEBPACK_EXTERNAL_MODULE_74__) { @@ -3884,6 +3884,8 @@ return /******/ (function(modules) { // webpackBootstrap var _fabric = __webpack_require__(74); + var _fabric2 = _interopRequireDefault(_fabric); + var _imageLoader = __webpack_require__(75); var _imageLoader2 = _interopRequireDefault(_imageLoader); @@ -4515,7 +4517,7 @@ return /******/ (function(modules) { // webpackBootstrap var callback = this._callbackAfterLoadingImageObject.bind(this); return new _promise2.default(function (resolve) { - _fabric.fabric.Image.fromURL(imgUrl, function (image) { + _fabric2.default.Image.fromURL(imgUrl, function (image) { callback(image); resolve(_this.createObjectProperties(image)); }, { @@ -4803,7 +4805,7 @@ return /******/ (function(modules) { // webpackBootstrap selectedElement.appendChild(canvasElement); } - this._canvas = new _fabric.fabric.Canvas(canvasElement, { + this._canvas = new _fabric2.default.Canvas(canvasElement, { containerClass: 'tui-image-editor-canvas-container', enableRetinaScaling: false }); @@ -5458,6 +5460,8 @@ return /******/ (function(modules) { // webpackBootstrap var _fabric = __webpack_require__(74); + var _fabric2 = _interopRequireDefault(_fabric); + var _component = __webpack_require__(76); var _component2 = _interopRequireDefault(_component); @@ -5579,8 +5583,8 @@ return /******/ (function(modules) { // webpackBootstrap canvas.selection = false; canvas.defaultCursor = 'crosshair'; - _fabric.fabric.util.addListener(document, 'keydown', this._listeners.keydown); - _fabric.fabric.util.addListener(document, 'keyup', this._listeners.keyup); + _fabric2.default.util.addListener(document, 'keydown', this._listeners.keydown); + _fabric2.default.util.addListener(document, 'keyup', this._listeners.keyup); } /** @@ -5606,8 +5610,8 @@ return /******/ (function(modules) { // webpackBootstrap this._cropzone = null; - _fabric.fabric.util.removeListener(document, 'keydown', this._listeners.keydown); - _fabric.fabric.util.removeListener(document, 'keyup', this._listeners.keyup); + _fabric2.default.util.removeListener(document, 'keydown', this._listeners.keydown); + _fabric2.default.util.removeListener(document, 'keyup', this._listeners.keyup); } /** @@ -5829,6 +5833,8 @@ return /******/ (function(modules) { // webpackBootstrap var _fabric = __webpack_require__(74); + var _fabric2 = _interopRequireDefault(_fabric); + var _util = __webpack_require__(71); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } @@ -5854,7 +5860,7 @@ return /******/ (function(modules) { // webpackBootstrap * @extends {fabric.Rect} * @ignore */ - var Cropzone = _fabric.fabric.util.createClass(_fabric.fabric.Rect, /** @lends Cropzone.prototype */{ + var Cropzone = _fabric2.default.util.createClass(_fabric2.default.Rect, /** @lends Cropzone.prototype */{ /** * Constructor * @param {Object} options Options object @@ -6420,6 +6426,8 @@ return /******/ (function(modules) { // webpackBootstrap var _fabric = __webpack_require__(74); + var _fabric2 = _interopRequireDefault(_fabric); + var _promise = __webpack_require__(4); var _promise2 = _interopRequireDefault(_promise); @@ -6522,8 +6530,8 @@ return /******/ (function(modules) { // webpackBootstrap canvas.forEachObject(function (obj) { var objCenter = obj.getCenterPoint(); - var radian = _fabric.fabric.util.degreesToRadians(angleDiff); - var newObjCenter = _fabric.fabric.util.rotatePoint(objCenter, oldImageCenter, radian); + var radian = _fabric2.default.util.degreesToRadians(angleDiff); + var newObjCenter = _fabric2.default.util.rotatePoint(objCenter, oldImageCenter, radian); obj.set({ left: newObjCenter.x - centerDiff.x, @@ -6565,6 +6573,8 @@ return /******/ (function(modules) { // webpackBootstrap var _fabric = __webpack_require__(74); + var _fabric2 = _interopRequireDefault(_fabric); + var _component = __webpack_require__(76); var _component2 = _interopRequireDefault(_component); @@ -6610,7 +6620,7 @@ return /******/ (function(modules) { // webpackBootstrap * fabric.Color instance for brush color * @type {fabric.Color} */ - _this.oColor = new _fabric.fabric.Color('rgba(0, 0, 0, 0.5)'); + _this.oColor = new _fabric2.default.Color('rgba(0, 0, 0, 0.5)'); return _this; } @@ -6642,7 +6652,7 @@ return /******/ (function(modules) { // webpackBootstrap setting = setting || {}; this.width = setting.width || this.width; if (setting.color) { - this.oColor = new _fabric.fabric.Color(setting.color); + this.oColor = new _fabric2.default.Color(setting.color); } brush.width = this.width; brush.color = this.oColor.toRgba(); @@ -6676,6 +6686,8 @@ return /******/ (function(modules) { // webpackBootstrap var _fabric = __webpack_require__(74); + var _fabric2 = _interopRequireDefault(_fabric); + var _component = __webpack_require__(76); var _component2 = _interopRequireDefault(_component); @@ -6726,7 +6738,7 @@ return /******/ (function(modules) { // webpackBootstrap * @type {fabric.Color} * @private */ - _this._oColor = new _fabric.fabric.Color('rgba(0, 0, 0, 0.5)'); + _this._oColor = new _fabric2.default.Color('rgba(0, 0, 0, 0.5)'); /** * Listeners @@ -6782,7 +6794,7 @@ return /******/ (function(modules) { // webpackBootstrap this._width = setting.width || this._width; if (setting.color) { - this._oColor = new _fabric.fabric.Color(setting.color); + this._oColor = new _fabric2.default.Color(setting.color); } brush.width = this._width; brush.color = this._oColor.toRgba(); @@ -6822,7 +6834,7 @@ return /******/ (function(modules) { // webpackBootstrap var pointer = canvas.getPointer(fEvent.e); var points = [pointer.x, pointer.y, pointer.x, pointer.y]; - this._line = new _fabric.fabric.Line(points, { + this._line = new _fabric2.default.Line(points, { stroke: this._oColor.toRgba(), strokeWidth: this._width, evented: false @@ -6898,6 +6910,8 @@ return /******/ (function(modules) { // webpackBootstrap var _fabric = __webpack_require__(74); + var _fabric2 = _interopRequireDefault(_fabric); + var _tuiCodeSnippet = __webpack_require__(2); var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); @@ -7125,7 +7139,7 @@ return /******/ (function(modules) { // webpackBootstrap styles = _tuiCodeSnippet2.default.extend(options.styles, styles); } - var newText = new _fabric.fabric.Text(text, styles); + var newText = new _fabric2.default.Text(text, styles); newText.set(_consts2.default.fObjectOptions.SELECTION_STYLE); newText.on({ mouseup: _this2._onFabricMouseUp.bind(_this2) @@ -7310,12 +7324,12 @@ return /******/ (function(modules) { // webpackBootstrap }); if (browser.msie && browser.version === 9) { - _fabric.fabric.util.addListener(textarea, 'keydown', this._listeners.keydown); + _fabric2.default.util.addListener(textarea, 'keydown', this._listeners.keydown); } else { - _fabric.fabric.util.addListener(textarea, 'input', this._listeners.input); + _fabric2.default.util.addListener(textarea, 'input', this._listeners.input); } - _fabric.fabric.util.addListener(textarea, 'blur', this._listeners.blur); - _fabric.fabric.util.addListener(textarea, 'scroll', this._listeners.scroll); + _fabric2.default.util.addListener(textarea, 'blur', this._listeners.blur); + _fabric2.default.util.addListener(textarea, 'scroll', this._listeners.scroll); } /** @@ -7334,12 +7348,12 @@ return /******/ (function(modules) { // webpackBootstrap this._textarea = null; if (browser.msie && browser.version < 10) { - _fabric.fabric.util.removeListener(textarea, 'keydown', this._listeners.keydown); + _fabric2.default.util.removeListener(textarea, 'keydown', this._listeners.keydown); } else { - _fabric.fabric.util.removeListener(textarea, 'input', this._listeners.input); + _fabric2.default.util.removeListener(textarea, 'input', this._listeners.input); } - _fabric.fabric.util.removeListener(textarea, 'blur', this._listeners.blur); - _fabric.fabric.util.removeListener(textarea, 'scroll', this._listeners.scroll); + _fabric2.default.util.removeListener(textarea, 'blur', this._listeners.blur); + _fabric2.default.util.removeListener(textarea, 'scroll', this._listeners.scroll); } /** @@ -7629,6 +7643,8 @@ return /******/ (function(modules) { // webpackBootstrap var _fabric = __webpack_require__(74); + var _fabric2 = _interopRequireDefault(_fabric); + var _tuiCodeSnippet = __webpack_require__(2); var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); @@ -7785,7 +7801,7 @@ return /******/ (function(modules) { // webpackBootstrap }, { key: '_createIcon', value: function _createIcon(path) { - return new _fabric.fabric.Path(path); + return new _fabric2.default.Path(path); } }]); @@ -7810,6 +7826,8 @@ return /******/ (function(modules) { // webpackBootstrap var _fabric = __webpack_require__(74); + var _fabric2 = _interopRequireDefault(_fabric); + var _component = __webpack_require__(76); var _component2 = _interopRequireDefault(_component); @@ -7851,7 +7869,7 @@ return /******/ (function(modules) { // webpackBootstrap var rejectMessages = _consts2.default.rejectMessages; - var filters = _fabric.fabric.Image.filters; + var filters = _fabric2.default.Image.filters; filters.Mask = _mask2.default; filters.Blur = _blur2.default; @@ -8036,7 +8054,7 @@ return /******/ (function(modules) { // webpackBootstrap var filterObj = void 0; // capitalize first letter for matching with fabric image filter name var fabricType = this._getFabricFilterType(type); - var ImageFilter = _fabric.fabric.Image.filters[fabricType]; + var ImageFilter = _fabric2.default.Image.filters[fabricType]; if (ImageFilter) { filterObj = new ImageFilter(options); filterObj.options = options; @@ -8122,13 +8140,17 @@ return /******/ (function(modules) { // webpackBootstrap var _fabric = __webpack_require__(74); + var _fabric2 = _interopRequireDefault(_fabric); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + /** * Mask object * @class Mask * @extends {fabric.Image.filters.Mask} * @ignore */ - var Mask = _fabric.fabric.util.createClass(_fabric.fabric.Image.filters.Mask, /** @lends Mask.prototype */{ + var Mask = _fabric2.default.util.createClass(_fabric2.default.Image.filters.Mask, /** @lends Mask.prototype */{ /** * Apply filter to canvas element * @param {Object} canvasEl - Canvas element to apply filter @@ -8162,7 +8184,7 @@ return /******/ (function(modules) { // webpackBootstrap * @private */ _createCanvasOfMask: function _createCanvasOfMask(width, height) { - var maskCanvasEl = _fabric.fabric.util.createCanvasElement(); + var maskCanvasEl = _fabric2.default.util.createCanvasElement(); maskCanvasEl.width = width; maskCanvasEl.height = height; @@ -8229,13 +8251,17 @@ return /******/ (function(modules) { // webpackBootstrap var _fabric = __webpack_require__(74); + var _fabric2 = _interopRequireDefault(_fabric); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + /** * Blur object * @class Blur * @extends {fabric.Image.filters.Convolute} * @ignore */ - var Blur = _fabric.fabric.util.createClass(_fabric.fabric.Image.filters.Convolute, /** @lends Convolute.prototype */{ + var Blur = _fabric2.default.util.createClass(_fabric2.default.Image.filters.Convolute, /** @lends Convolute.prototype */{ /** * Filter type * @param {String} type @@ -8267,13 +8293,17 @@ return /******/ (function(modules) { // webpackBootstrap var _fabric = __webpack_require__(74); + var _fabric2 = _interopRequireDefault(_fabric); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + /** * Sharpen object * @class Sharpen * @extends {fabric.Image.filters.Convolute} * @ignore */ - var Sharpen = _fabric.fabric.util.createClass(_fabric.fabric.Image.filters.Convolute, /** @lends Convolute.prototype */{ + var Sharpen = _fabric2.default.util.createClass(_fabric2.default.Image.filters.Convolute, /** @lends Convolute.prototype */{ /** * Filter type * @param {String} type @@ -8305,13 +8335,17 @@ return /******/ (function(modules) { // webpackBootstrap var _fabric = __webpack_require__(74); + var _fabric2 = _interopRequireDefault(_fabric); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + /** * Emboss object * @class Emboss * @extends {fabric.Image.filters.Convolute} * @ignore */ - var Emboss = _fabric.fabric.util.createClass(_fabric.fabric.Image.filters.Convolute, /** @lends Convolute.prototype */{ + var Emboss = _fabric2.default.util.createClass(_fabric2.default.Image.filters.Convolute, /** @lends Convolute.prototype */{ /** * Filter type * @param {String} type @@ -8343,13 +8377,17 @@ return /******/ (function(modules) { // webpackBootstrap var _fabric = __webpack_require__(74); + var _fabric2 = _interopRequireDefault(_fabric); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + /** * ColorFilter object * @class ColorFilter * @extends {fabric.Image.filters.BaseFilter} * @ignore */ - var ColorFilter = _fabric.fabric.util.createClass(_fabric.fabric.Image.filters.BaseFilter, /** @lends BaseFilter.prototype */{ + var ColorFilter = _fabric2.default.util.createClass(_fabric2.default.Image.filters.BaseFilter, /** @lends BaseFilter.prototype */{ /** * Filter type * @param {String} type @@ -8386,7 +8424,7 @@ return /******/ (function(modules) { // webpackBootstrap var data = imageData.data; var threshold = this.threshold; - var filterColor = _fabric.fabric.Color.sourceFromHex(this.color); + var filterColor = _fabric2.default.Color.sourceFromHex(this.color); var i = void 0, len = void 0; @@ -8458,6 +8496,8 @@ return /******/ (function(modules) { // webpackBootstrap var _fabric = __webpack_require__(74); + var _fabric2 = _interopRequireDefault(_fabric); + var _promise = __webpack_require__(4); var _promise2 = _interopRequireDefault(_promise); @@ -8603,8 +8643,8 @@ return /******/ (function(modules) { // webpackBootstrap 'mouse:down': this._handlers.mousedown }); - _fabric.fabric.util.addListener(document, 'keydown', this._handlers.keydown); - _fabric.fabric.util.addListener(document, 'keyup', this._handlers.keyup); + _fabric2.default.util.addListener(document, 'keydown', this._handlers.keydown); + _fabric2.default.util.addListener(document, 'keyup', this._handlers.keyup); } /** @@ -8626,8 +8666,8 @@ return /******/ (function(modules) { // webpackBootstrap 'mouse:down': this._handlers.mousedown }); - _fabric.fabric.util.removeListener(document, 'keydown', this._handlers.keydown); - _fabric.fabric.util.removeListener(document, 'keyup', this._handlers.keyup); + _fabric2.default.util.removeListener(document, 'keydown', this._handlers.keydown); + _fabric2.default.util.removeListener(document, 'keyup', this._handlers.keyup); } /** @@ -8734,15 +8774,15 @@ return /******/ (function(modules) { // webpackBootstrap switch (type) { case 'rect': - instance = new _fabric.fabric.Rect(options); + instance = new _fabric2.default.Rect(options); break; case 'circle': - instance = new _fabric.fabric.Ellipse((0, _tuiCodeSnippet.extend)({ + instance = new _fabric2.default.Ellipse((0, _tuiCodeSnippet.extend)({ type: 'circle' }, options)); break; case 'triangle': - instance = new _fabric.fabric.Triangle(options); + instance = new _fabric2.default.Triangle(options); break; default: instance = {}; diff --git a/dist/tui-image-editor.min.js b/dist/tui-image-editor.min.js index 5619334a6..4e10453b9 100644 --- a/dist/tui-image-editor.min.js +++ b/dist/tui-image-editor.min.js @@ -1,10 +1,10 @@ /*! * tui-image-editor.min.js - * @version 3.0.0 + * @version 3.0.1 * @author NHNEnt FE Development Lab * @license MIT */ -!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("fabric"),require("tui-code-snippet")):"function"==typeof define&&define.amd?define(["fabric","tui-code-snippet"],t):"object"==typeof exports?exports.ImageEditor=t(require("fabric"),require("tui-code-snippet")):(e.tui=e.tui||{},e.tui.ImageEditor=t(e.fabric,e.tui&&e.tui.util))}(this,function(e,t){return function(e){function t(r){if(n[r])return n[r].exports;var i=n[r]={exports:{},id:r,loaded:!1};return e[r].call(i.exports,i,i.exports,t),i.loaded=!0,i.exports}var n={};return t.m=e,t.c=n,t.p="dist",t(0)}([function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(83),o=r(i);n(41),n(42),n(43),n(44),n(45),n(46),n(47),n(48),n(49),n(50),n(51),n(52),n(53),n(54),n(55),n(56),n(57),n(59),n(58),e.exports=o.default},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(9),o=r(i);e.exports={componentNames:o.default.keyMirror("IMAGE_LOADER","CROPPER","FLIP","ROTATION","FREE_DRAWING","LINE","TEXT","ICON","FILTER","SHAPE"),commandNames:{CLEAR_OBJECTS:"clearObjects",LOAD_IMAGE:"loadImage",FLIP_IMAGE:"flip",ROTATE_IMAGE:"rotate",ADD_OBJECT:"addObject",REMOVE_OBJECT:"removeObject",APPLY_FILTER:"applyFilter",REMOVE_FILTER:"removeFilter",ADD_ICON:"addIcon",CHANGE_ICON_COLOR:"changeIconColor",ADD_SHAPE:"addShape",CHANGE_SHAPE:"changeShape",ADD_TEXT:"addText",CHANGE_TEXT:"changeText",CHANGE_TEXT_STYLE:"changeTextStyle",ADD_IMAGE_OBJECT:"addImageObject",RESIZE_CANVAS_DIMENSION:"resizeCanvasDimension",SET_OBJECT_PROPERTIES:"setObjectProperties",SET_OBJECT_POSITION:"setObjectPosition"},eventNames:{OBJECT_ACTIVATED:"objectActivated",OBJECT_MOVED:"objectMoved",OBJECT_SCALED:"objectScaled",TEXT_EDITING:"textEditing",TEXT_CHANGED:"textChanged",ADD_TEXT:"addText",ADD_OBJECT:"addObject",MOUSE_DOWN:"mousedown",REDO_STACK_CHANGED:"redoStackChanged",UNDO_STACK_CHANGED:"undoStackChanged"},drawingModes:o.default.keyMirror("NORMAL","CROPPER","FREE_DRAWING","LINE_DRAWING","TEXT","SHAPE"),keyCodes:{Z:90,Y:89,SHIFT:16,BACKSPACE:8,DEL:46},fObjectOptions:{SELECTION_STYLE:{borderColor:"red",cornerColor:"green",cornerSize:10,originX:"center",originY:"center",transparentCorners:!1}},rejectMessages:{flip:"The flipX and flipY setting values are not changed.",rotation:"The current angle is same the old angle.",loadImage:"The background image is empty.",isLock:"The executing command state is locked.",undo:"The promise of undo command is reject.",redo:"The promise of redo command is reject.",invalidDrawingMode:"This operation is not supported in the drawing mode",invalidParameters:"Invalid parameters",noActiveObject:"There is no active object.",unsupportedType:"Unsupported object type",noObject:"The object is not in canvas.",addedObject:"The object is already added."}}},function(e,t,n){n(114),n(116),n(117),n(115),e.exports=n(13).Promise},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e){var t=u[e];if(t){for(var n=arguments.length,r=Array(n>1?n-1:0),i=1;in&&(r=t,t=n,n=r),o(t,i(e,n))},keyMirror:function(){for(var e={},t=arguments.length,n=Array(t),i=0;i0?r:n)(e)}},function(e,t,n){var r=n(92),i=n(22);e.exports=function(e){return r(i(e))}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(9),s=(0,a.keyMirror)("UN_IMPLEMENTATION","NO_COMPONENT_NAME"),u={UN_IMPLEMENTATION:"Should implement a method: ",NO_COMPONENT_NAME:"Should set a component name"},c={UN_IMPLEMENTATION:function(e){return u.UN_IMPLEMENTATION+e},NO_COMPONENT_NAME:function(){return u.NO_COMPONENT_NAME}};e.exports={types:o.default.extend({},s),create:function(e){e=e.toLowerCase();for(var t=c[e],n=arguments.length,r=Array(n>1?n-1:0),i=1;in;)t.push(arguments[n++]);return g[++v]=function(){s("function"==typeof e?e:Function(e),t)},r(v),v},d=function(e){delete g[e]},"process"==n(16)(f)?r=function(e){f.nextTick(a(y,e,1))}:p?(i=new p,o=i.port2,i.port1.onmessage=m,r=a(o.postMessage,o,1)):l.addEventListener&&"function"==typeof postMessage&&!l.importScripts?(r=function(e){l.postMessage(e+"","*")},l.addEventListener("message",m,!1)):r=_ in c("script")?function(e){u.appendChild(c("script"))[_]=function(){u.removeChild(this),y.call(e)}}:function(e){setTimeout(a(y,e,1),0)}),e.exports={set:h,clear:d}},function(e,t,n){var r=n(26),i=Math.min;e.exports=function(e){return e>0?i(r(e),9007199254740991):0}},function(e,t){var n=0,r=Math.random();e.exports=function(e){return"Symbol(".concat(void 0===e?"":e,")_",(++n+r).toString(36))}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.commandNames,h=l.ICON,d={name:f.ADD_ICON,execute:function(e,t,n){var r=this,i=e.getComponent(h);return i.add(t,n).then(function(t){return r.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(d),e.exports=d},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f={name:l.ADD_IMAGE_OBJECT,execute:function(e,t){var n=this;return e.addImageObject(t).then(function(t){return n.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f=c.default.rejectMessages,h={name:l.ADD_OBJECT,execute:function(e,t){return new s.default(function(n,r){e.contains(t)?r(f.addedObject):(e.add(t),n(t))})},undo:function(e,t){return new s.default(function(n,r){e.contains(t)?(e.remove(t),n(t)):r(f.noObject)})}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.commandNames,h=l.SHAPE,d={name:f.ADD_SHAPE,execute:function(e,t,n){var r=this,i=e.getComponent(h);return i.add(t,n).then(function(t){return r.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(d),e.exports=d},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.commandNames,h=l.TEXT,d={name:f.ADD_TEXT,execute:function(e,t,n){var r=this,i=e.getComponent(h);return i.add(t,n).then(function(t){return r.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(d),e.exports=d},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.rejectMessages,l=s.default.commandNames,f=u.FILTER,h={name:l.APPLY_FILTER,execute:function(e,t,n){var r=e.getComponent(f);if("mask"===t){var i=e.getObject(n.maskObjId);if(!i||!i.isType("image"))return Promise.reject(c.invalidParameters);n={mask:i}}return"mask"===t?(this.undoData.object=n.mask,e.remove(n.mask)):this.undoData.options=r.getOptions(t),r.add(t,n)},undo:function(e,t){var n=e.getComponent(f);if("mask"===t){var r=this.undoData.object;return e.add(r),e.setActiveObject(r),n.remove(t)}return this.undoData.options?n.add(t,this.undoData.options):n.remove(t)}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.rejectMessages,h=c.default.commandNames,d=l.ICON,p={name:h.CHANGE_ICON_COLOR,execute:function(e,t,n){var r=this;return new s.default(function(i,o){var a=e.getComponent(d),s=e.getObject(t);s||o(f.noObject),r.undoData.object=s,r.undoData.color=a.getColor(s),a.setColor(n,s),i()})},undo:function(e){var t=e.getComponent(d),n=this.undoData.object,r=n.object,i=n.color;return t.setColor(i,r),s.default.resolve()}};o.default.register(p),e.exports=p},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(3),s=r(a),u=n(2),c=r(u),l=n(1),f=r(l),h=f.default.componentNames,d=f.default.rejectMessages,p=f.default.commandNames,v=h.SHAPE,g={name:p.CHANGE_SHAPE,execute:function(e,t,n){var r=this,i=e.getComponent(v),a=e.getObject(t);return a?(this.undoData.object=a,this.undoData.options={},o.default.forEachOwnProperties(n,function(e,t){r.undoData.options[t]=a[t]}),i.change(a,n)):c.default.reject(d.noObject)},undo:function(e){var t=e.getComponent(v),n=this.undoData,r=n.object,i=n.options;return t.change(r,i)}};s.default.register(g),e.exports=g},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.rejectMessages,h=c.default.commandNames,d=l.TEXT,p={name:h.CHANGE_TEXT,execute:function(e,t,n){var r=e.getComponent(d),i=e.getObject(t);return i?(this.undoData.object=i,this.undoData.text=r.getText(i),r.change(i,n)):s.default.reject(f.noObject)},undo:function(e){var t=e.getComponent(d),n=this.undoData,r=n.object,i=n.text;return t.change(r,i)}};o.default.register(p),e.exports=p},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(3),s=r(a),u=n(2),c=r(u),l=n(1),f=r(l),h=f.default.componentNames,d=f.default.rejectMessages,p=f.default.commandNames,v=h.TEXT,g={name:p.CHANGE_TEXT_STYLE,execute:function(e,t,n){var r=this,i=e.getComponent(v),a=e.getObject(t);return a?(this.undoData.object=a,this.undoData.styles={},o.default.forEachOwnProperties(n,function(e,t){r.undoData.styles[t]=a[t]}),i.setStyle(a,n)):c.default.reject(d.noObject)},undo:function(e){var t=e.getComponent(v),n=this.undoData,r=n.object,i=n.styles;return t.setStyle(r,i)}};s.default.register(g),e.exports=g},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f={name:l.CLEAR_OBJECTS,execute:function(e){var t=this;return new s.default(function(n){t.undoData.objects=e.removeAll(),n()})},undo:function(e){return e.add(this.undoData.objects),s.default.resolve()}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.FLIP,f={name:c.FLIP_IMAGE,execute:function(e,t){var n=e.getComponent(l);return this.undoData.setting=n.getCurrentSetting(),n[t]()},undo:function(e){var t=e.getComponent(l);return t.set(this.undoData.setting)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.IMAGE_LOADER,f={name:c.LOAD_IMAGE,execute:function(e,t,n){var r=e.getComponent(l),i=r.getCanvasImage(),o=i?i.width:0,a=i?i.height:0;return this.undoData={name:r.getImageName(),image:i,objects:e.removeAll(!0)},r.load(t,n).then(function(e){return{oldWidth:o,oldHeight:a,newWidth:e.width,newHeight:e.height}})},undo:function(e){var t=e.getComponent(l),n=this.undoData,r=n.objects,i=n.name,o=n.image;return e.removeAll(!0),e.add(r),t.load(i,o)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.FILTER,f={name:c.REMOVE_FILTER,execute:function(e,t){var n=e.getComponent(l);return this.undoData.options=n.getOptions(t),n.remove(t)},undo:function(e,t){var n=e.getComponent(l),r=this.undoData.options;return n.add(t,r)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f=c.default.rejectMessages,h={name:l.REMOVE_OBJECT,execute:function(e,t){var n=this;return new s.default(function(r,i){n.undoData.objects=e.removeObjectById(t),n.undoData.objects.length?r():i(f.noObject)})},undo:function(e){return e.add(this.undoData.objects),s.default.resolve()}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f={name:l.RESIZE_CANVAS_DIMENSION,execute:function(e,t){var n=this;return new s.default(function(r){n.undoData.size={width:e.cssMaxWidth,height:e.cssMaxHeight},e.setCssMaxDimension(t),e.adjustCanvasDimension(),r()})},undo:function(e){return e.setCssMaxDimension(this.undoData.size),e.adjustCanvasDimension(),s.default.resolve()}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.ROTATION,f={name:c.ROTATE_IMAGE,execute:function(e,t,n){var r=e.getComponent(l);return this.undoData.angle=r.getCurrentAngle(),r[t](n)},undo:function(e){var t=e.getComponent(l),n=this.undoData.angle;return t.setAngle(n)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f=c.default.rejectMessages,h={name:l.SET_OBJECT_POSITION,execute:function(e,t,n){var r=e.getObject(t);return r?(this.undoData.objectId=t,this.undoData.props=e.getObjectProperties(t,["left","top"]),e.setObjectPosition(t,n),e.renderAll(),s.default.resolve()):s.default.reject(f.noObject)},undo:function(e){var t=this.undoData,n=t.objectId,r=t.props;return e.setObjectProperties(n,r),e.renderAll(),s.default.resolve()}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(3),s=r(a),u=n(2),c=r(u),l=n(1),f=r(l),h=f.default.commandNames,d=f.default.rejectMessages,p={name:h.SET_OBJECT_PROPERTIES,execute:function(e,t,n){var r=this,i=e.getObject(t);return i?(this.undoData.props={},o.default.forEachOwnProperties(n,function(e,t){r.undoData.props[t]=i[t]}),e.setObjectProperties(t,n),c.default.resolve()):c.default.reject(d.noObject)},undo:function(e,t){var n=this.undoData.props;return e.setObjectProperties(t,n),c.default.resolve()}};s.default.register(p),e.exports=p},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;nv&&(o.remove(),o.set(this._calcRectDimensionFromPoint(r,i)),t.add(o))}},{key:"_calcRectDimensionFromPoint",value:function(e,t){var n=this.getCanvas(),r=n.getWidth(),i=n.getHeight(),o=this._startX,a=this._startY,s=(0,p.clamp)(e,0,o),u=(0,p.clamp)(t,0,a),c=(0,p.clamp)(e,o,r)-s,l=(0,p.clamp)(t,a,i)-u;return this._withShiftKey&&(c>l?l=c:l>c&&(c=l),o>=e&&(s=o-c),a>=t&&(u=a-l)),{left:s,top:u,width:c,height:l}}},{key:"_onFabricMouseUp",value:function(){var e=this._cropzone,t=this._listeners,n=this.getCanvas();n.setActiveObject(e),n.off({"mouse:move":t.mousemove,"mouse:up":t.mouseup})}},{key:"getCroppedImageData",value:function(e){var t=this.getCanvas(),n=t.contains(this._cropzone);if(!e)return null;n&&this._cropzone.remove();var r={imageName:this.getImageName(),url:t.toDataURL(e)};return n&&t.add(this._cropzone),r}},{key:"getCropzoneRect",value:function(){var e=this._cropzone;return e.isValid()?{left:e.getLeft(),top:e.getTop(),width:e.getWidth(),height:e.getHeight()}:null}},{key:"_onKeyDown",value:function(e){e.keyCode===d.keyCodes.SHIFT&&(this._withShiftKey=!0)}},{key:"_onKeyUp",value:function(e){e.keyCode===d.keyCodes.SHIFT&&(this._withShiftKey=!1)}}]),t}(l.default);e.exports=g},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;nn},_getColor:function(e,t,n){var r=[0,0,0,0],i=e.data,o=e.width,a=4,s=(o*n+t)*a;return r[0]=i[s],r[1]=i[s+1],r[2]=i[s+2],r[3]=i[s+3],r}});e.exports=i},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(4),s=n(9),u="tl",c="tr",l="mt",f="ml",h="mr",d="mb",p="bl",v="br",g=a.fabric.util.createClass(a.fabric.Rect,{initialize:function(e){e.type="cropzone",this.callSuper("initialize",e),this.on({moving:this._onMoving,scaling:this._onScaling})},_render:function(e){var t=7,n=7;this.callSuper("_render",e);var r=this.flipX?-1:1,i=this.flipY?-1:1,o=r/this.scaleX,a=i/this.scaleY;e.scale(o,a),this._fillOuterRect(e,"rgba(0, 0, 0, 0.55)"),this._strokeBorder(e,"rgb(0, 0, 0)",t),this._strokeBorder(e,"rgb(255, 255, 255)",t,n),e.scale(1/o,1/a)},_fillOuterRect:function(e,t){var n=this._getCoordinates(e),r=n.x,i=n.y;e.save(),e.fillStyle=t,e.beginPath(),e.moveTo(r[0]-1,i[0]-1),e.lineTo(r[3]+1,i[0]-1),e.lineTo(r[3]+1,i[3]+1),e.lineTo(r[0]-1,i[3]-1),e.lineTo(r[0]-1,i[0]-1),e.closePath(),e.moveTo(r[1],i[1]),e.lineTo(r[1],i[2]),e.lineTo(r[2],i[2]),e.lineTo(r[2],i[1]),e.lineTo(r[1],i[1]),e.closePath(),e.fill(),e.restore()},_getCoordinates:function(e){var t=this.getWidth(),n=this.getHeight(),r=t/2,i=n/2,a=this.getLeft(),s=this.getTop(),u=e.canvas;return{x:o.default.map([-(r+a),-r,r,r+(u.width-a-t)],Math.ceil),y:o.default.map([-(i+s),-i,i,i+(u.height-s-n)],Math.ceil)}},_strokeBorder:function(e,t,n,r){var i=this.getWidth()/2,o=this.getHeight()/2;e.save(),e.strokeStyle=t,e.setLineDash&&e.setLineDash([n,n]),r&&(e.lineDashOffset=r),e.beginPath(),e.moveTo(-i,-o),e.lineTo(i,-o),e.lineTo(i,o),e.lineTo(-i,o),e.lineTo(-i,-o),e.stroke(),e.restore()},_onMoving:function(){var e=this.getLeft(),t=this.getTop(),n=this.getWidth(),r=this.getHeight(),i=this.canvas.getWidth()-n,o=this.canvas.getHeight()-r;this.setLeft((0,s.clamp)(e,0,i)),this.setTop((0,s.clamp)(t,0,o))},_onScaling:function(e){var t=this.canvas.getPointer(e.e),n=this._calcScalingSizeFromPointer(t);this.scale(1).set(n)},_calcScalingSizeFromPointer:function(e){var t=e.x,n=e.y,r=this._calcTopLeftScalingSizeFromPointer(t,n),i=this._calcBottomRightScalingSizeFromPointer(t,n); -return this._makeScalingSettings(r,i)},_calcTopLeftScalingSizeFromPointer:function(e,t){var n=this.getHeight()+this.top,r=this.getWidth()+this.left,i=(0,s.clamp)(t,0,n-1),o=(0,s.clamp)(e,0,r-1);return{top:i,left:o,width:r-o,height:n-i}},_calcBottomRightScalingSizeFromPointer:function(e,t){var n=this.canvas,r=n.width,i=n.height,o=this.left,a=this.top;return{width:(0,s.clamp)(e,o+1,r)-o,height:(0,s.clamp)(t,a+1,i)-a}},_makeScalingSettings:function(e,t){var n=e.width,r=e.height,i=t.height,o=t.width,a=e.left,s=e.top,g=void 0;switch(this.__corner){case u:g=e;break;case c:g={width:o,height:r,top:s};break;case p:g={width:n,height:i,left:a};break;case v:g=t;break;case f:g={width:n,left:a};break;case l:g={height:r,top:s};break;case h:g={width:o};break;case d:g={height:i}}return g},isValid:function(){return this.left>=0&&this.top>=0&&this.width>0&&this.height>0}});e.exports=g},function(e,t,n){"use strict";var r=n(4),i=r.fabric.util.createClass(r.fabric.Image.filters.Convolute,{type:"Emboss",initialize:function(){var e=[1,1,1,1,.7,-1,-1,-1,-1];this.matrix=e}});e.exports=i},function(e,t,n){"use strict";var r=n(4),i=r.fabric.util.createClass(r.fabric.Image.filters.Mask,{applyTo:function(e){if(this.mask){var t=e.width,n=e.height,r=this._createCanvasOfMask(t,n),i=e.getContext("2d"),o=r.getContext("2d"),a=i.getImageData(0,0,t,n);this._drawMask(o,e,i),this._mapData(o,a,t,n),i.putImageData(a,0,0)}},_createCanvasOfMask:function(e,t){var n=r.fabric.util.createCanvasElement();return n.width=e,n.height=t,n},_drawMask:function(e){var t=this.mask,n=t.getElement(),r=t.getLeft(),i=t.getTop(),o=t.getAngle();e.save(),e.translate(r,i),e.rotate(o*Math.PI/180),e.scale(t.scaleX,t.scaleY),e.drawImage(n,-n.width/2,-n.height/2),e.restore()},_mapData:function(e,t,n,r){for(var i=t.data,o=e.getImageData(0,0,n,r).data,a=this.channel,s=t.width*t.height*4,u=0;uu?"right":"left",originY:i>c?"bottom":"top"}}function i(e){return"center"===e.getOriginX()&&"center"===e.getOriginY()}function o(e,t){var n=t.getPointByOrigin("center","center"),i=-t.getAngle(),o=r(n,e,i),a=o.originX,s=o.originY,u=t.getPointByOrigin(a,s),c=t.getLeft()-(n.x-u.x),l=t.getTop()-(n.x-u.y);t.set({originX:a,originY:s,left:c,top:l}),t.setCoords()}function a(e,t){var n=t.startPoint,i=-t.getAngle(),o=r(n,e,i),a=o.originX,s=o.originY;t.setPositionByOrigin(n,a,s)}function s(e){var t=e.type,n=e.scaleX,r=e.scaleY,i=l[t],o=e[i.w]*n,a=e[i.h]*r;if(e.isRegular){var s=Math.max(n,r);o=e[i.w]*s,a=e[i.h]*s}var u={hasControls:!1,hasBorders:!1,scaleX:1,scaleY:1};u[i.w]=o,u[i.h]=a,e.set(u)}function u(e,t){var n=t.type,r=t.strokeWidth,i=t.startPoint,o=c[n],a=l[n],s=!("triangle"!==t.type),u={},f=Math.abs(i.x-e.x)/o,h=Math.abs(i.y-e.y)/o;f>r&&(f-=r/o),h>r&&(h-=r/o),t.isRegular&&(f=h=Math.max(f,h),s&&(h=Math.sqrt(3)/2*f)),u[a.w]=f,u[a.h]=h,t.set(u)}var c={rect:1,circle:2,triangle:1},l={rect:{w:"width",h:"height"},circle:{w:"rx",h:"ry"},triangle:{w:"width",h:"height"}};e.exports={setOrigins:function(e){var t=e.getPointByOrigin("left","top"),n=e.getPointByOrigin("right","top"),r=e.getPointByOrigin("right","bottom"),i=e.getPointByOrigin("left","bottom");e.origins={lt:t,rt:n,rb:r,lb:i}},resize:function(e,t,r){i(e)&&(o(t,e),n(e)),r?s(e,t):u(t,e),a(t,e)},adjustOriginToCenter:function(e){var t=e.getPointByOrigin("center","center"),n=e.getOriginX(),r=e.getOriginY(),i=e.getPointByOrigin(n,r),o=e.getLeft()+(t.x-i.x),a=e.getTop()+(t.y-i.y);e.set({hasControls:!0,hasBorders:!0,originX:"center",originY:"center",left:o,top:a}),e.setCoords()}}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var o=function(){function e(e,t){for(var n=0;n1?n-1:0),i=1;il;)if(s=u[l++],s!=s)return!0}else for(;c>l;l++)if((e||l in u)&&u[l]===n)return e||l||0;return!e&&-1}}},function(e,t,n){var r=n(17),i=n(94),o=n(93),a=n(10),s=n(39),u=n(112),c={},l={},t=e.exports=function(e,t,n,f,h){var d,p,v,g,_=h?function(){return e}:u(e),y=r(n,f,t?2:1),m=0;if("function"!=typeof _)throw TypeError(e+" is not iterable!");if(o(_)){for(d=s(e.length);d>m;m++)if(g=t?y(a(p=e[m])[0],p[1]):y(e[m]),g===c||g===l)return g}else for(v=_.call(e);!(p=v.next()).done;)if(g=i(v,y,p.value,t),g===c||g===l)return g};t.BREAK=c,t.RETURN=l},function(e,t,n){e.exports=!n(14)&&!n(32)(function(){return 7!=Object.defineProperty(n(23)("div"),"a",{get:function(){return 7}}).a})},function(e,t){e.exports=function(e,t,n){var r=void 0===n;switch(t.length){case 0:return r?e():e.call(n);case 1:return r?e(t[0]):e.call(n,t[0]);case 2:return r?e(t[0],t[1]):e.call(n,t[0],t[1]);case 3:return r?e(t[0],t[1],t[2]):e.call(n,t[0],t[1],t[2]);case 4:return r?e(t[0],t[1],t[2],t[3]):e.call(n,t[0],t[1],t[2],t[3])}return e.apply(n,t)}},function(e,t,n){var r=n(16);e.exports=Object("z").propertyIsEnumerable(0)?Object:function(e){return"String"==r(e)?e.split(""):Object(e)}},function(e,t,n){var r=n(15),i=n(6)("iterator"),o=Array.prototype;e.exports=function(e){return void 0!==e&&(r.Array===e||o[i]===e)}},function(e,t,n){var r=n(10);e.exports=function(e,t,n,i){try{return i?t(r(n)[0],n[1]):t(n)}catch(t){var o=e.return;throw void 0!==o&&r(o.call(e)),t}}},function(e,t,n){"use strict";var r=n(99),i=n(36),o=n(24),a={};n(11)(a,n(6)("iterator"),function(){return this}),e.exports=function(e,t,n){e.prototype=r(a,{next:i(1,n)}),o(e,t+" Iterator")}},function(e,t,n){var r=n(6)("iterator"),i=!1;try{var o=[7][r]();o.return=function(){i=!0},Array.from(o,function(){throw 2})}catch(e){}e.exports=function(e,t){if(!t&&!i)return!1;var n=!1;try{var o=[7],a=o[r]();a.next=function(){return{done:n=!0}},o[r]=function(){return a},e(o)}catch(e){}return n}},function(e,t){e.exports=function(e,t){return{value:t,done:!!e}}},function(e,t,n){var r=n(8),i=n(38).set,o=r.MutationObserver||r.WebKitMutationObserver,a=r.process,s=r.Promise,u="process"==n(16)(a);e.exports=function(){var e,t,n,c=function(){var r,i;for(u&&(r=a.domain)&&r.exit();e;){i=e.fn,e=e.next;try{i()}catch(r){throw e?n():t=void 0,r}}t=void 0,r&&r.enter()};if(u)n=function(){a.nextTick(c)};else if(o){var l=!0,f=document.createTextNode("");new o(c).observe(f,{characterData:!0}),n=function(){f.data=l=!l}}else if(s&&s.resolve){var h=s.resolve();n=function(){h.then(c)}}else n=function(){i.call(r,c)};return function(r){var i={fn:r,next:void 0};t&&(t.next=i),e||(e=i,n()),t=i}}},function(e,t,n){var r=n(10),i=n(100),o=n(30),a=n(25)("IE_PROTO"),s=function(){},u="prototype",c=function(){var e,t=n(23)("iframe"),r=o.length,i="<",a=">";for(t.style.display="none",n(33).appendChild(t),t.src="javascript:",e=t.contentWindow.document,e.open(),e.write(i+"script"+a+"document.F=Object"+i+"/script"+a),e.close(),c=e.F;r--;)delete c[u][o[r]];return c()};e.exports=Object.create||function(e,t){var n;return null!==e?(s[u]=r(e),n=new s,s[u]=null,n[a]=e):n=c(),void 0===t?n:i(n,t)}},function(e,t,n){var r=n(20),i=n(10),o=n(103);e.exports=n(14)?Object.defineProperties:function(e,t){i(e);for(var n,a=o(t),s=a.length,u=0;s>u;)r.f(e,n=a[u++],t[n]);return e}},function(e,t,n){var r=n(18),i=n(110),o=n(25)("IE_PROTO"),a=Object.prototype;e.exports=Object.getPrototypeOf||function(e){return e=i(e),r(e,o)?e[o]:"function"==typeof e.constructor&&e instanceof e.constructor?e.constructor.prototype:e instanceof Object?a:null}},function(e,t,n){var r=n(18),i=n(27),o=n(88)(!1),a=n(25)("IE_PROTO");e.exports=function(e,t){var n,s=i(e),u=0,c=[];for(n in s)n!=a&&r(s,n)&&c.push(n);for(;t.length>u;)r(s,n=t[u++])&&(~o(c,n)||c.push(n));return c}},function(e,t,n){var r=n(102),i=n(30);e.exports=Object.keys||function(e){return r(e,i)}},function(e,t,n){var r=n(11);e.exports=function(e,t,n){for(var i in t)n&&e[i]?e[i]=t[i]:r(e,i,t[i]);return e}},function(e,t,n){e.exports=n(11)},function(e,t,n){"use strict";var r=n(8),i=n(13),o=n(20),a=n(14),s=n(6)("species");e.exports=function(e){var t="function"==typeof i[e]?i[e]:r[e];a&&t&&!t[s]&&o.f(t,s,{configurable:!0,get:function(){return this}})}},function(e,t,n){var r=n(10),i=n(21),o=n(6)("species");e.exports=function(e,t){var n,a=r(e).constructor;return void 0===a||void 0==(n=r(a)[o])?t:i(n)}},function(e,t,n){var r=n(26),i=n(22);e.exports=function(e){return function(t,n){var o,a,s=String(i(t)),u=r(n),c=s.length;return u<0||u>=c?e?"":void 0:(o=s.charCodeAt(u),o<55296||o>56319||u+1===c||(a=s.charCodeAt(u+1))<56320||a>57343?e?s.charAt(u):o:e?s.slice(u,u+2):(o-55296<<10)+(a-56320)+65536)}}},function(e,t,n){var r=n(26),i=Math.max,o=Math.min;e.exports=function(e,t){return e=r(e),e<0?i(e+t,0):o(e,t)}},function(e,t,n){var r=n(22);e.exports=function(e){return Object(r(e))}},function(e,t,n){var r=n(19);e.exports=function(e,t){if(!r(e))return e;var n,i;if(t&&"function"==typeof(n=e.toString)&&!r(i=n.call(e)))return i;if("function"==typeof(n=e.valueOf)&&!r(i=n.call(e)))return i;if(!t&&"function"==typeof(n=e.toString)&&!r(i=n.call(e)))return i;throw TypeError("Can't convert object to primitive value")}},function(e,t,n){var r=n(29),i=n(6)("iterator"),o=n(15);e.exports=n(13).getIteratorMethod=function(e){if(void 0!=e)return e[i]||e["@@iterator"]||o[r(e)]}},function(e,t,n){"use strict";var r=n(86),i=n(97),o=n(15),a=n(27);e.exports=n(34)(Array,"Array",function(e,t){this._t=a(e),this._i=0,this._k=t},function(){ -var e=this._t,t=this._k,n=this._i++;return!e||n>=e.length?(this._t=void 0,i(1)):"keys"==t?i(0,n):"values"==t?i(0,e[n]):i(0,[n,e[n]])},"values"),o.Arguments=o.Array,r("keys"),r("values"),r("entries")},function(e,t){},function(e,t,n){"use strict";var r,i,o,a=n(35),s=n(8),u=n(17),c=n(29),l=n(31),f=n(19),h=n(21),d=n(87),p=n(89),v=n(107),g=n(38).set,_=n(98)(),y="Promise",m=s.TypeError,b=s.process,O=s[y],b=s.process,k="process"==c(b),w=function(){},C=!!function(){try{var e=O.resolve(1),t=(e.constructor={})[n(6)("species")]=function(e){e(w,w)};return(k||"function"==typeof PromiseRejectionEvent)&&e.then(w)instanceof t}catch(e){}}(),E=function(e,t){return e===t||e===O&&t===o},j=function(e){var t;return!(!f(e)||"function"!=typeof(t=e.then))&&t},x=function(e){return E(O,e)?new T(e):new i(e)},T=i=function(e){var t,n;this.promise=new e(function(e,r){if(void 0!==t||void 0!==n)throw m("Bad Promise constructor");t=e,n=r}),this.resolve=h(t),this.reject=h(n)},S=function(e){try{e()}catch(e){return{error:e}}},M=function(e,t){if(!e._n){e._n=!0;var n=e._c;_(function(){for(var r=e._v,i=1==e._s,o=0,a=function(t){var n,o,a=i?t.ok:t.fail,s=t.resolve,u=t.reject,c=t.domain;try{a?(i||(2==e._h&&D(e),e._h=1),a===!0?n=r:(c&&c.enter(),n=a(r),c&&c.exit()),n===t.promise?u(m("Promise-chain cycle")):(o=j(n))?o.call(n,s,u):s(n)):u(r)}catch(e){u(e)}};n.length>o;)a(n[o++]);e._c=[],e._n=!1,t&&!e._h&&P(e)})}},P=function(e){g.call(s,function(){var t,n,r,i=e._v;if(A(e)&&(t=S(function(){k?b.emit("unhandledRejection",i,e):(n=s.onunhandledrejection)?n({promise:e,reason:i}):(r=s.console)&&r.error&&r.error("Unhandled promise rejection",i)}),e._h=k||A(e)?2:1),e._a=void 0,t)throw t.error})},A=function(e){if(1==e._h)return!1;for(var t,n=e._a||e._c,r=0;n.length>r;)if(t=n[r++],t.fail||!A(t.promise))return!1;return!0},D=function(e){g.call(s,function(){var t;k?b.emit("rejectionHandled",e):(t=s.onrejectionhandled)&&t({promise:e,reason:e._v})})},I=function(e){var t=this;t._d||(t._d=!0,t=t._w||t,t._v=e,t._s=2,t._a||(t._a=t._c.slice()),M(t,!0))},N=function(e){var t,n=this;if(!n._d){n._d=!0,n=n._w||n;try{if(n===e)throw m("Promise can't be resolved itself");(t=j(e))?_(function(){var r={_w:n,_d:!1};try{t.call(e,u(N,r,1),u(I,r,1))}catch(e){I.call(r,e)}}):(n._v=e,n._s=1,M(n,!1))}catch(e){I.call({_w:n,_d:!1},e)}}};C||(O=function(e){d(this,O,y,"_h"),h(e),r.call(this);try{e(u(N,this,1),u(I,this,1))}catch(e){I.call(this,e)}},r=function(e){this._c=[],this._a=void 0,this._s=0,this._d=!1,this._v=void 0,this._h=0,this._n=!1},r.prototype=n(104)(O.prototype,{then:function(e,t){var n=x(v(this,O));return n.ok="function"!=typeof e||e,n.fail="function"==typeof t&&t,n.domain=k?b.domain:void 0,this._c.push(n),this._a&&this._a.push(n),this._s&&M(this,!1),n.promise},catch:function(e){return this.then(void 0,e)}}),T=function(){var e=new r;this.promise=e,this.resolve=u(N,e,1),this.reject=u(I,e,1)}),l(l.G+l.W+l.F*!C,{Promise:O}),n(24)(O,y),n(106)(y),o=n(13)[y],l(l.S+l.F*!C,y,{reject:function(e){var t=x(this),n=t.reject;return n(e),t.promise}}),l(l.S+l.F*(a||!C),y,{resolve:function(e){if(e instanceof O&&E(e.constructor,this))return e;var t=x(this),n=t.resolve;return n(e),t.promise}}),l(l.S+l.F*!(C&&n(96)(function(e){O.all(e).catch(w)})),y,{all:function(e){var t=this,n=x(t),r=n.resolve,i=n.reject,o=S(function(){var n=[],o=0,a=1;p(e,!1,function(e){var s=o++,u=!1;n.push(void 0),a++,t.resolve(e).then(function(e){u||(u=!0,n[s]=e,--a||r(n))},i)}),--a||r(n)});return o&&i(o.error),n.promise},race:function(e){var t=this,n=x(t),r=n.reject,i=S(function(){p(e,!1,function(e){t.resolve(e).then(n.resolve,r)})});return i&&r(i.error),n.promise}})},function(e,t,n){"use strict";var r=n(108)(!0);n(34)(String,"String",function(e){this._t=String(e),this._i=0},function(){var e,t=this._t,n=this._i;return n>=t.length?{value:void 0,done:!0}:(e=r(t,n),this._i+=e.length,{value:e,done:!1})})},function(e,t,n){n(113);for(var r=n(8),i=n(11),o=n(15),a=n(6)("toStringTag"),s=["NodeList","DOMTokenList","MediaList","StyleSheetList","CSSRuleList"],u=0;u<5;u++){var c=s[u],l=r[c],f=l&&l.prototype;f&&!f[a]&&i(f,a,c),o[c]=o.Array}}])}); \ No newline at end of file +!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("fabric/dist/fabric.require"),require("tui-code-snippet")):"function"==typeof define&&define.amd?define(["fabric/dist/fabric.require","tui-code-snippet"],t):"object"==typeof exports?exports.ImageEditor=t(require("fabric/dist/fabric.require"),require("tui-code-snippet")):(e.tui=e.tui||{},e.tui.ImageEditor=t(e.fabric,e.tui&&e.tui.util))}(this,function(e,t){return function(e){function t(r){if(n[r])return n[r].exports;var i=n[r]={exports:{},id:r,loaded:!1};return e[r].call(i.exports,i,i.exports,t),i.loaded=!0,i.exports}var n={};return t.m=e,t.c=n,t.p="dist",t(0)}([function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(83),o=r(i);n(41),n(42),n(43),n(44),n(45),n(46),n(47),n(48),n(49),n(50),n(51),n(52),n(53),n(54),n(55),n(56),n(57),n(59),n(58),e.exports=o.default},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(9),o=r(i);e.exports={componentNames:o.default.keyMirror("IMAGE_LOADER","CROPPER","FLIP","ROTATION","FREE_DRAWING","LINE","TEXT","ICON","FILTER","SHAPE"),commandNames:{CLEAR_OBJECTS:"clearObjects",LOAD_IMAGE:"loadImage",FLIP_IMAGE:"flip",ROTATE_IMAGE:"rotate",ADD_OBJECT:"addObject",REMOVE_OBJECT:"removeObject",APPLY_FILTER:"applyFilter",REMOVE_FILTER:"removeFilter",ADD_ICON:"addIcon",CHANGE_ICON_COLOR:"changeIconColor",ADD_SHAPE:"addShape",CHANGE_SHAPE:"changeShape",ADD_TEXT:"addText",CHANGE_TEXT:"changeText",CHANGE_TEXT_STYLE:"changeTextStyle",ADD_IMAGE_OBJECT:"addImageObject",RESIZE_CANVAS_DIMENSION:"resizeCanvasDimension",SET_OBJECT_PROPERTIES:"setObjectProperties",SET_OBJECT_POSITION:"setObjectPosition"},eventNames:{OBJECT_ACTIVATED:"objectActivated",OBJECT_MOVED:"objectMoved",OBJECT_SCALED:"objectScaled",TEXT_EDITING:"textEditing",TEXT_CHANGED:"textChanged",ADD_TEXT:"addText",ADD_OBJECT:"addObject",MOUSE_DOWN:"mousedown",REDO_STACK_CHANGED:"redoStackChanged",UNDO_STACK_CHANGED:"undoStackChanged"},drawingModes:o.default.keyMirror("NORMAL","CROPPER","FREE_DRAWING","LINE_DRAWING","TEXT","SHAPE"),keyCodes:{Z:90,Y:89,SHIFT:16,BACKSPACE:8,DEL:46},fObjectOptions:{SELECTION_STYLE:{borderColor:"red",cornerColor:"green",cornerSize:10,originX:"center",originY:"center",transparentCorners:!1}},rejectMessages:{flip:"The flipX and flipY setting values are not changed.",rotation:"The current angle is same the old angle.",loadImage:"The background image is empty.",isLock:"The executing command state is locked.",undo:"The promise of undo command is reject.",redo:"The promise of redo command is reject.",invalidDrawingMode:"This operation is not supported in the drawing mode",invalidParameters:"Invalid parameters",noActiveObject:"There is no active object.",unsupportedType:"Unsupported object type",noObject:"The object is not in canvas.",addedObject:"The object is already added."}}},function(e,t,n){n(114),n(116),n(117),n(115),e.exports=n(13).Promise},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e){var t=u[e];if(t){for(var n=arguments.length,r=Array(n>1?n-1:0),i=1;in&&(r=t,t=n,n=r),o(t,i(e,n))},keyMirror:function(){for(var e={},t=arguments.length,n=Array(t),i=0;i0?r:n)(e)}},function(e,t,n){var r=n(92),i=n(22);e.exports=function(e){return r(i(e))}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(9),s=(0,a.keyMirror)("UN_IMPLEMENTATION","NO_COMPONENT_NAME"),u={UN_IMPLEMENTATION:"Should implement a method: ",NO_COMPONENT_NAME:"Should set a component name"},c={UN_IMPLEMENTATION:function(e){return u.UN_IMPLEMENTATION+e},NO_COMPONENT_NAME:function(){return u.NO_COMPONENT_NAME}};e.exports={types:o.default.extend({},s),create:function(e){e=e.toLowerCase();for(var t=c[e],n=arguments.length,r=Array(n>1?n-1:0),i=1;in;)t.push(arguments[n++]);return g[++v]=function(){s("function"==typeof e?e:Function(e),t)},r(v),v},d=function(e){delete g[e]},"process"==n(16)(f)?r=function(e){f.nextTick(a(y,e,1))}:p?(i=new p,o=i.port2,i.port1.onmessage=m,r=a(o.postMessage,o,1)):l.addEventListener&&"function"==typeof postMessage&&!l.importScripts?(r=function(e){l.postMessage(e+"","*")},l.addEventListener("message",m,!1)):r=_ in c("script")?function(e){u.appendChild(c("script"))[_]=function(){u.removeChild(this),y.call(e)}}:function(e){setTimeout(a(y,e,1),0)}),e.exports={set:h,clear:d}},function(e,t,n){var r=n(26),i=Math.min;e.exports=function(e){return e>0?i(r(e),9007199254740991):0}},function(e,t){var n=0,r=Math.random();e.exports=function(e){return"Symbol(".concat(void 0===e?"":e,")_",(++n+r).toString(36))}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.commandNames,h=l.ICON,d={name:f.ADD_ICON,execute:function(e,t,n){var r=this,i=e.getComponent(h);return i.add(t,n).then(function(t){return r.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(d),e.exports=d},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f={name:l.ADD_IMAGE_OBJECT,execute:function(e,t){var n=this;return e.addImageObject(t).then(function(t){return n.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f=c.default.rejectMessages,h={name:l.ADD_OBJECT,execute:function(e,t){return new s.default(function(n,r){e.contains(t)?r(f.addedObject):(e.add(t),n(t))})},undo:function(e,t){return new s.default(function(n,r){e.contains(t)?(e.remove(t),n(t)):r(f.noObject)})}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.commandNames,h=l.SHAPE,d={name:f.ADD_SHAPE,execute:function(e,t,n){var r=this,i=e.getComponent(h);return i.add(t,n).then(function(t){return r.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(d),e.exports=d},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.commandNames,h=l.TEXT,d={name:f.ADD_TEXT,execute:function(e,t,n){var r=this,i=e.getComponent(h);return i.add(t,n).then(function(t){return r.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(d),e.exports=d},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.rejectMessages,l=s.default.commandNames,f=u.FILTER,h={name:l.APPLY_FILTER,execute:function(e,t,n){var r=e.getComponent(f);if("mask"===t){var i=e.getObject(n.maskObjId);if(!i||!i.isType("image"))return Promise.reject(c.invalidParameters);n={mask:i}}return"mask"===t?(this.undoData.object=n.mask,e.remove(n.mask)):this.undoData.options=r.getOptions(t),r.add(t,n)},undo:function(e,t){var n=e.getComponent(f);if("mask"===t){var r=this.undoData.object;return e.add(r),e.setActiveObject(r),n.remove(t)}return this.undoData.options?n.add(t,this.undoData.options):n.remove(t)}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.rejectMessages,h=c.default.commandNames,d=l.ICON,p={name:h.CHANGE_ICON_COLOR,execute:function(e,t,n){var r=this;return new s.default(function(i,o){var a=e.getComponent(d),s=e.getObject(t);s||o(f.noObject),r.undoData.object=s,r.undoData.color=a.getColor(s),a.setColor(n,s),i()})},undo:function(e){var t=e.getComponent(d),n=this.undoData.object,r=n.object,i=n.color;return t.setColor(i,r),s.default.resolve()}};o.default.register(p),e.exports=p},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(3),s=r(a),u=n(2),c=r(u),l=n(1),f=r(l),h=f.default.componentNames,d=f.default.rejectMessages,p=f.default.commandNames,v=h.SHAPE,g={name:p.CHANGE_SHAPE,execute:function(e,t,n){var r=this,i=e.getComponent(v),a=e.getObject(t);return a?(this.undoData.object=a,this.undoData.options={},o.default.forEachOwnProperties(n,function(e,t){r.undoData.options[t]=a[t]}),i.change(a,n)):c.default.reject(d.noObject)},undo:function(e){var t=e.getComponent(v),n=this.undoData,r=n.object,i=n.options;return t.change(r,i)}};s.default.register(g),e.exports=g},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.rejectMessages,h=c.default.commandNames,d=l.TEXT,p={name:h.CHANGE_TEXT,execute:function(e,t,n){var r=e.getComponent(d),i=e.getObject(t);return i?(this.undoData.object=i,this.undoData.text=r.getText(i),r.change(i,n)):s.default.reject(f.noObject)},undo:function(e){var t=e.getComponent(d),n=this.undoData,r=n.object,i=n.text;return t.change(r,i)}};o.default.register(p),e.exports=p},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(3),s=r(a),u=n(2),c=r(u),l=n(1),f=r(l),h=f.default.componentNames,d=f.default.rejectMessages,p=f.default.commandNames,v=h.TEXT,g={name:p.CHANGE_TEXT_STYLE,execute:function(e,t,n){var r=this,i=e.getComponent(v),a=e.getObject(t);return a?(this.undoData.object=a,this.undoData.styles={},o.default.forEachOwnProperties(n,function(e,t){r.undoData.styles[t]=a[t]}),i.setStyle(a,n)):c.default.reject(d.noObject)},undo:function(e){var t=e.getComponent(v),n=this.undoData,r=n.object,i=n.styles;return t.setStyle(r,i)}};s.default.register(g),e.exports=g},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f={name:l.CLEAR_OBJECTS,execute:function(e){var t=this;return new s.default(function(n){t.undoData.objects=e.removeAll(),n()})},undo:function(e){return e.add(this.undoData.objects),s.default.resolve()}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.FLIP,f={name:c.FLIP_IMAGE,execute:function(e,t){var n=e.getComponent(l);return this.undoData.setting=n.getCurrentSetting(),n[t]()},undo:function(e){var t=e.getComponent(l);return t.set(this.undoData.setting)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.IMAGE_LOADER,f={name:c.LOAD_IMAGE,execute:function(e,t,n){var r=e.getComponent(l),i=r.getCanvasImage(),o=i?i.width:0,a=i?i.height:0;return this.undoData={name:r.getImageName(),image:i,objects:e.removeAll(!0)},r.load(t,n).then(function(e){return{oldWidth:o,oldHeight:a,newWidth:e.width,newHeight:e.height}})},undo:function(e){var t=e.getComponent(l),n=this.undoData,r=n.objects,i=n.name,o=n.image;return e.removeAll(!0),e.add(r),t.load(i,o)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.FILTER,f={name:c.REMOVE_FILTER,execute:function(e,t){var n=e.getComponent(l);return this.undoData.options=n.getOptions(t),n.remove(t)},undo:function(e,t){var n=e.getComponent(l),r=this.undoData.options;return n.add(t,r)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f=c.default.rejectMessages,h={name:l.REMOVE_OBJECT,execute:function(e,t){var n=this;return new s.default(function(r,i){n.undoData.objects=e.removeObjectById(t),n.undoData.objects.length?r():i(f.noObject)})},undo:function(e){return e.add(this.undoData.objects),s.default.resolve()}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f={name:l.RESIZE_CANVAS_DIMENSION,execute:function(e,t){var n=this;return new s.default(function(r){n.undoData.size={width:e.cssMaxWidth,height:e.cssMaxHeight},e.setCssMaxDimension(t),e.adjustCanvasDimension(),r()})},undo:function(e){return e.setCssMaxDimension(this.undoData.size),e.adjustCanvasDimension(),s.default.resolve()}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.ROTATION,f={name:c.ROTATE_IMAGE,execute:function(e,t,n){var r=e.getComponent(l);return this.undoData.angle=r.getCurrentAngle(),r[t](n)},undo:function(e){var t=e.getComponent(l),n=this.undoData.angle;return t.setAngle(n)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f=c.default.rejectMessages,h={name:l.SET_OBJECT_POSITION,execute:function(e,t,n){var r=e.getObject(t);return r?(this.undoData.objectId=t,this.undoData.props=e.getObjectProperties(t,["left","top"]),e.setObjectPosition(t,n),e.renderAll(),s.default.resolve()):s.default.reject(f.noObject)},undo:function(e){var t=this.undoData,n=t.objectId,r=t.props;return e.setObjectProperties(n,r),e.renderAll(),s.default.resolve()}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(3),s=r(a),u=n(2),c=r(u),l=n(1),f=r(l),h=f.default.commandNames,d=f.default.rejectMessages,p={name:h.SET_OBJECT_PROPERTIES,execute:function(e,t,n){var r=this,i=e.getObject(t);return i?(this.undoData.props={},o.default.forEachOwnProperties(n,function(e,t){r.undoData.props[t]=i[t]}),e.setObjectProperties(t,n),c.default.resolve()):c.default.reject(d.noObject)},undo:function(e,t){var n=this.undoData.props;return e.setObjectProperties(t,n),c.default.resolve()}};s.default.register(p),e.exports=p},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;ng&&(o.remove(),o.set(this._calcRectDimensionFromPoint(r,i)),t.add(o))}},{key:"_calcRectDimensionFromPoint",value:function(e,t){var n=this.getCanvas(),r=n.getWidth(),i=n.getHeight(),o=this._startX,a=this._startY,s=(0,v.clamp)(e,0,o),u=(0,v.clamp)(t,0,a),c=(0,v.clamp)(e,o,r)-s,l=(0,v.clamp)(t,a,i)-u;return this._withShiftKey&&(c>l?l=c:l>c&&(c=l),o>=e&&(s=o-c),a>=t&&(u=a-l)),{left:s,top:u,width:c,height:l}}},{key:"_onFabricMouseUp",value:function(){var e=this._cropzone,t=this._listeners,n=this.getCanvas();n.setActiveObject(e),n.off({"mouse:move":t.mousemove,"mouse:up":t.mouseup})}},{key:"getCroppedImageData",value:function(e){var t=this.getCanvas(),n=t.contains(this._cropzone);if(!e)return null;n&&this._cropzone.remove();var r={imageName:this.getImageName(),url:t.toDataURL(e)};return n&&t.add(this._cropzone),r}},{key:"getCropzoneRect",value:function(){var e=this._cropzone;return e.isValid()?{left:e.getLeft(),top:e.getTop(),width:e.getWidth(),height:e.getHeight()}:null}},{key:"_onKeyDown",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!0)}},{key:"_onKeyUp",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!1)}}]),t}(f.default);e.exports=_},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;nn},_getColor:function(e,t,n){var r=[0,0,0,0],i=e.data,o=e.width,a=4,s=(o*n+t)*a;return r[0]=i[s],r[1]=i[s+1],r[2]=i[s+2],r[3]=i[s+3],r}});e.exports=a},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(4),s=r(a),u=n(9),c="tl",l="tr",f="mt",h="ml",d="mr",p="mb",v="bl",g="br",_=s.default.util.createClass(s.default.Rect,{initialize:function(e){e.type="cropzone",this.callSuper("initialize",e),this.on({moving:this._onMoving,scaling:this._onScaling})},_render:function(e){var t=7,n=7;this.callSuper("_render",e);var r=this.flipX?-1:1,i=this.flipY?-1:1,o=r/this.scaleX,a=i/this.scaleY;e.scale(o,a),this._fillOuterRect(e,"rgba(0, 0, 0, 0.55)"),this._strokeBorder(e,"rgb(0, 0, 0)",t),this._strokeBorder(e,"rgb(255, 255, 255)",t,n),e.scale(1/o,1/a)},_fillOuterRect:function(e,t){var n=this._getCoordinates(e),r=n.x,i=n.y;e.save(),e.fillStyle=t,e.beginPath(),e.moveTo(r[0]-1,i[0]-1),e.lineTo(r[3]+1,i[0]-1),e.lineTo(r[3]+1,i[3]+1),e.lineTo(r[0]-1,i[3]-1),e.lineTo(r[0]-1,i[0]-1),e.closePath(),e.moveTo(r[1],i[1]),e.lineTo(r[1],i[2]),e.lineTo(r[2],i[2]),e.lineTo(r[2],i[1]),e.lineTo(r[1],i[1]),e.closePath(),e.fill(),e.restore()},_getCoordinates:function(e){var t=this.getWidth(),n=this.getHeight(),r=t/2,i=n/2,a=this.getLeft(),s=this.getTop(),u=e.canvas;return{x:o.default.map([-(r+a),-r,r,r+(u.width-a-t)],Math.ceil),y:o.default.map([-(i+s),-i,i,i+(u.height-s-n)],Math.ceil)}},_strokeBorder:function(e,t,n,r){var i=this.getWidth()/2,o=this.getHeight()/2;e.save(),e.strokeStyle=t,e.setLineDash&&e.setLineDash([n,n]),r&&(e.lineDashOffset=r),e.beginPath(),e.moveTo(-i,-o),e.lineTo(i,-o),e.lineTo(i,o),e.lineTo(-i,o),e.lineTo(-i,-o),e.stroke(),e.restore()},_onMoving:function(){var e=this.getLeft(),t=this.getTop(),n=this.getWidth(),r=this.getHeight(),i=this.canvas.getWidth()-n,o=this.canvas.getHeight()-r; +this.setLeft((0,u.clamp)(e,0,i)),this.setTop((0,u.clamp)(t,0,o))},_onScaling:function(e){var t=this.canvas.getPointer(e.e),n=this._calcScalingSizeFromPointer(t);this.scale(1).set(n)},_calcScalingSizeFromPointer:function(e){var t=e.x,n=e.y,r=this._calcTopLeftScalingSizeFromPointer(t,n),i=this._calcBottomRightScalingSizeFromPointer(t,n);return this._makeScalingSettings(r,i)},_calcTopLeftScalingSizeFromPointer:function(e,t){var n=this.getHeight()+this.top,r=this.getWidth()+this.left,i=(0,u.clamp)(t,0,n-1),o=(0,u.clamp)(e,0,r-1);return{top:i,left:o,width:r-o,height:n-i}},_calcBottomRightScalingSizeFromPointer:function(e,t){var n=this.canvas,r=n.width,i=n.height,o=this.left,a=this.top;return{width:(0,u.clamp)(e,o+1,r)-o,height:(0,u.clamp)(t,a+1,i)-a}},_makeScalingSettings:function(e,t){var n=e.width,r=e.height,i=t.height,o=t.width,a=e.left,s=e.top,u=void 0;switch(this.__corner){case c:u=e;break;case l:u={width:o,height:r,top:s};break;case v:u={width:n,height:i,left:a};break;case g:u=t;break;case h:u={width:n,left:a};break;case f:u={height:r,top:s};break;case d:u={width:o};break;case p:u={height:i}}return u},isValid:function(){return this.left>=0&&this.top>=0&&this.width>0&&this.height>0}});e.exports=_},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(4),o=r(i),a=o.default.util.createClass(o.default.Image.filters.Convolute,{type:"Emboss",initialize:function(){var e=[1,1,1,1,.7,-1,-1,-1,-1];this.matrix=e}});e.exports=a},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(4),o=r(i),a=o.default.util.createClass(o.default.Image.filters.Mask,{applyTo:function(e){if(this.mask){var t=e.width,n=e.height,r=this._createCanvasOfMask(t,n),i=e.getContext("2d"),o=r.getContext("2d"),a=i.getImageData(0,0,t,n);this._drawMask(o,e,i),this._mapData(o,a,t,n),i.putImageData(a,0,0)}},_createCanvasOfMask:function(e,t){var n=o.default.util.createCanvasElement();return n.width=e,n.height=t,n},_drawMask:function(e){var t=this.mask,n=t.getElement(),r=t.getLeft(),i=t.getTop(),o=t.getAngle();e.save(),e.translate(r,i),e.rotate(o*Math.PI/180),e.scale(t.scaleX,t.scaleY),e.drawImage(n,-n.width/2,-n.height/2),e.restore()},_mapData:function(e,t,n,r){for(var i=t.data,o=e.getImageData(0,0,n,r).data,a=this.channel,s=t.width*t.height*4,u=0;uu?"right":"left",originY:i>c?"bottom":"top"}}function i(e){return"center"===e.getOriginX()&&"center"===e.getOriginY()}function o(e,t){var n=t.getPointByOrigin("center","center"),i=-t.getAngle(),o=r(n,e,i),a=o.originX,s=o.originY,u=t.getPointByOrigin(a,s),c=t.getLeft()-(n.x-u.x),l=t.getTop()-(n.x-u.y);t.set({originX:a,originY:s,left:c,top:l}),t.setCoords()}function a(e,t){var n=t.startPoint,i=-t.getAngle(),o=r(n,e,i),a=o.originX,s=o.originY;t.setPositionByOrigin(n,a,s)}function s(e){var t=e.type,n=e.scaleX,r=e.scaleY,i=l[t],o=e[i.w]*n,a=e[i.h]*r;if(e.isRegular){var s=Math.max(n,r);o=e[i.w]*s,a=e[i.h]*s}var u={hasControls:!1,hasBorders:!1,scaleX:1,scaleY:1};u[i.w]=o,u[i.h]=a,e.set(u)}function u(e,t){var n=t.type,r=t.strokeWidth,i=t.startPoint,o=c[n],a=l[n],s=!("triangle"!==t.type),u={},f=Math.abs(i.x-e.x)/o,h=Math.abs(i.y-e.y)/o;f>r&&(f-=r/o),h>r&&(h-=r/o),t.isRegular&&(f=h=Math.max(f,h),s&&(h=Math.sqrt(3)/2*f)),u[a.w]=f,u[a.h]=h,t.set(u)}var c={rect:1,circle:2,triangle:1},l={rect:{w:"width",h:"height"},circle:{w:"rx",h:"ry"},triangle:{w:"width",h:"height"}};e.exports={setOrigins:function(e){var t=e.getPointByOrigin("left","top"),n=e.getPointByOrigin("right","top"),r=e.getPointByOrigin("right","bottom"),i=e.getPointByOrigin("left","bottom");e.origins={lt:t,rt:n,rb:r,lb:i}},resize:function(e,t,r){i(e)&&(o(t,e),n(e)),r?s(e,t):u(t,e),a(t,e)},adjustOriginToCenter:function(e){var t=e.getPointByOrigin("center","center"),n=e.getOriginX(),r=e.getOriginY(),i=e.getPointByOrigin(n,r),o=e.getLeft()+(t.x-i.x),a=e.getTop()+(t.y-i.y);e.set({hasControls:!0,hasBorders:!0,originX:"center",originY:"center",left:o,top:a}),e.setCoords()}}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var o=function(){function e(e,t){for(var n=0;n1?n-1:0),i=1;il;)if(s=u[l++],s!=s)return!0}else for(;c>l;l++)if((e||l in u)&&u[l]===n)return e||l||0;return!e&&-1}}},function(e,t,n){var r=n(17),i=n(94),o=n(93),a=n(10),s=n(39),u=n(112),c={},l={},t=e.exports=function(e,t,n,f,h){var d,p,v,g,_=h?function(){return e}:u(e),y=r(n,f,t?2:1),m=0;if("function"!=typeof _)throw TypeError(e+" is not iterable!");if(o(_)){for(d=s(e.length);d>m;m++)if(g=t?y(a(p=e[m])[0],p[1]):y(e[m]),g===c||g===l)return g}else for(v=_.call(e);!(p=v.next()).done;)if(g=i(v,y,p.value,t),g===c||g===l)return g};t.BREAK=c,t.RETURN=l},function(e,t,n){e.exports=!n(14)&&!n(32)(function(){return 7!=Object.defineProperty(n(23)("div"),"a",{get:function(){return 7}}).a})},function(e,t){e.exports=function(e,t,n){var r=void 0===n;switch(t.length){case 0:return r?e():e.call(n);case 1:return r?e(t[0]):e.call(n,t[0]);case 2:return r?e(t[0],t[1]):e.call(n,t[0],t[1]);case 3:return r?e(t[0],t[1],t[2]):e.call(n,t[0],t[1],t[2]);case 4:return r?e(t[0],t[1],t[2],t[3]):e.call(n,t[0],t[1],t[2],t[3])}return e.apply(n,t)}},function(e,t,n){var r=n(16);e.exports=Object("z").propertyIsEnumerable(0)?Object:function(e){return"String"==r(e)?e.split(""):Object(e)}},function(e,t,n){var r=n(15),i=n(6)("iterator"),o=Array.prototype;e.exports=function(e){return void 0!==e&&(r.Array===e||o[i]===e)}},function(e,t,n){var r=n(10);e.exports=function(e,t,n,i){try{return i?t(r(n)[0],n[1]):t(n)}catch(t){var o=e.return;throw void 0!==o&&r(o.call(e)),t}}},function(e,t,n){"use strict";var r=n(99),i=n(36),o=n(24),a={};n(11)(a,n(6)("iterator"),function(){return this}),e.exports=function(e,t,n){e.prototype=r(a,{next:i(1,n)}),o(e,t+" Iterator")}},function(e,t,n){var r=n(6)("iterator"),i=!1;try{var o=[7][r]();o.return=function(){i=!0},Array.from(o,function(){throw 2})}catch(e){}e.exports=function(e,t){if(!t&&!i)return!1;var n=!1;try{var o=[7],a=o[r]();a.next=function(){return{done:n=!0}},o[r]=function(){return a},e(o)}catch(e){}return n}},function(e,t){e.exports=function(e,t){return{value:t,done:!!e}}},function(e,t,n){var r=n(8),i=n(38).set,o=r.MutationObserver||r.WebKitMutationObserver,a=r.process,s=r.Promise,u="process"==n(16)(a);e.exports=function(){var e,t,n,c=function(){var r,i;for(u&&(r=a.domain)&&r.exit();e;){i=e.fn,e=e.next;try{i()}catch(r){throw e?n():t=void 0,r}}t=void 0,r&&r.enter()};if(u)n=function(){a.nextTick(c)};else if(o){var l=!0,f=document.createTextNode("");new o(c).observe(f,{characterData:!0}),n=function(){f.data=l=!l}}else if(s&&s.resolve){var h=s.resolve();n=function(){h.then(c)}}else n=function(){i.call(r,c)};return function(r){var i={fn:r,next:void 0};t&&(t.next=i),e||(e=i,n()),t=i}}},function(e,t,n){var r=n(10),i=n(100),o=n(30),a=n(25)("IE_PROTO"),s=function(){},u="prototype",c=function(){var e,t=n(23)("iframe"),r=o.length,i="<",a=">";for(t.style.display="none",n(33).appendChild(t),t.src="javascript:",e=t.contentWindow.document,e.open(),e.write(i+"script"+a+"document.F=Object"+i+"/script"+a),e.close(),c=e.F;r--;)delete c[u][o[r]];return c()};e.exports=Object.create||function(e,t){var n;return null!==e?(s[u]=r(e),n=new s,s[u]=null,n[a]=e):n=c(),void 0===t?n:i(n,t)}},function(e,t,n){var r=n(20),i=n(10),o=n(103);e.exports=n(14)?Object.defineProperties:function(e,t){i(e);for(var n,a=o(t),s=a.length,u=0;s>u;)r.f(e,n=a[u++],t[n]);return e}},function(e,t,n){var r=n(18),i=n(110),o=n(25)("IE_PROTO"),a=Object.prototype;e.exports=Object.getPrototypeOf||function(e){return e=i(e),r(e,o)?e[o]:"function"==typeof e.constructor&&e instanceof e.constructor?e.constructor.prototype:e instanceof Object?a:null}},function(e,t,n){var r=n(18),i=n(27),o=n(88)(!1),a=n(25)("IE_PROTO");e.exports=function(e,t){var n,s=i(e),u=0,c=[];for(n in s)n!=a&&r(s,n)&&c.push(n);for(;t.length>u;)r(s,n=t[u++])&&(~o(c,n)||c.push(n));return c}},function(e,t,n){var r=n(102),i=n(30);e.exports=Object.keys||function(e){return r(e,i)}},function(e,t,n){var r=n(11);e.exports=function(e,t,n){for(var i in t)n&&e[i]?e[i]=t[i]:r(e,i,t[i]);return e}},function(e,t,n){e.exports=n(11)},function(e,t,n){"use strict";var r=n(8),i=n(13),o=n(20),a=n(14),s=n(6)("species");e.exports=function(e){var t="function"==typeof i[e]?i[e]:r[e];a&&t&&!t[s]&&o.f(t,s,{configurable:!0,get:function(){return this}})}},function(e,t,n){var r=n(10),i=n(21),o=n(6)("species");e.exports=function(e,t){var n,a=r(e).constructor;return void 0===a||void 0==(n=r(a)[o])?t:i(n)}},function(e,t,n){var r=n(26),i=n(22);e.exports=function(e){return function(t,n){var o,a,s=String(i(t)),u=r(n),c=s.length;return u<0||u>=c?e?"":void 0:(o=s.charCodeAt(u),o<55296||o>56319||u+1===c||(a=s.charCodeAt(u+1))<56320||a>57343?e?s.charAt(u):o:e?s.slice(u,u+2):(o-55296<<10)+(a-56320)+65536)}}},function(e,t,n){var r=n(26),i=Math.max,o=Math.min;e.exports=function(e,t){return e=r(e),e<0?i(e+t,0):o(e,t)}},function(e,t,n){var r=n(22);e.exports=function(e){return Object(r(e))}},function(e,t,n){var r=n(19);e.exports=function(e,t){if(!r(e))return e;var n,i;if(t&&"function"==typeof(n=e.toString)&&!r(i=n.call(e)))return i; +if("function"==typeof(n=e.valueOf)&&!r(i=n.call(e)))return i;if(!t&&"function"==typeof(n=e.toString)&&!r(i=n.call(e)))return i;throw TypeError("Can't convert object to primitive value")}},function(e,t,n){var r=n(29),i=n(6)("iterator"),o=n(15);e.exports=n(13).getIteratorMethod=function(e){if(void 0!=e)return e[i]||e["@@iterator"]||o[r(e)]}},function(e,t,n){"use strict";var r=n(86),i=n(97),o=n(15),a=n(27);e.exports=n(34)(Array,"Array",function(e,t){this._t=a(e),this._i=0,this._k=t},function(){var e=this._t,t=this._k,n=this._i++;return!e||n>=e.length?(this._t=void 0,i(1)):"keys"==t?i(0,n):"values"==t?i(0,e[n]):i(0,[n,e[n]])},"values"),o.Arguments=o.Array,r("keys"),r("values"),r("entries")},function(e,t){},function(e,t,n){"use strict";var r,i,o,a=n(35),s=n(8),u=n(17),c=n(29),l=n(31),f=n(19),h=n(21),d=n(87),p=n(89),v=n(107),g=n(38).set,_=n(98)(),y="Promise",m=s.TypeError,b=s.process,O=s[y],b=s.process,k="process"==c(b),w=function(){},C=!!function(){try{var e=O.resolve(1),t=(e.constructor={})[n(6)("species")]=function(e){e(w,w)};return(k||"function"==typeof PromiseRejectionEvent)&&e.then(w)instanceof t}catch(e){}}(),E=function(e,t){return e===t||e===O&&t===o},j=function(e){var t;return!(!f(e)||"function"!=typeof(t=e.then))&&t},x=function(e){return E(O,e)?new T(e):new i(e)},T=i=function(e){var t,n;this.promise=new e(function(e,r){if(void 0!==t||void 0!==n)throw m("Bad Promise constructor");t=e,n=r}),this.resolve=h(t),this.reject=h(n)},M=function(e){try{e()}catch(e){return{error:e}}},S=function(e,t){if(!e._n){e._n=!0;var n=e._c;_(function(){for(var r=e._v,i=1==e._s,o=0,a=function(t){var n,o,a=i?t.ok:t.fail,s=t.resolve,u=t.reject,c=t.domain;try{a?(i||(2==e._h&&D(e),e._h=1),a===!0?n=r:(c&&c.enter(),n=a(r),c&&c.exit()),n===t.promise?u(m("Promise-chain cycle")):(o=j(n))?o.call(n,s,u):s(n)):u(r)}catch(e){u(e)}};n.length>o;)a(n[o++]);e._c=[],e._n=!1,t&&!e._h&&P(e)})}},P=function(e){g.call(s,function(){var t,n,r,i=e._v;if(A(e)&&(t=M(function(){k?b.emit("unhandledRejection",i,e):(n=s.onunhandledrejection)?n({promise:e,reason:i}):(r=s.console)&&r.error&&r.error("Unhandled promise rejection",i)}),e._h=k||A(e)?2:1),e._a=void 0,t)throw t.error})},A=function(e){if(1==e._h)return!1;for(var t,n=e._a||e._c,r=0;n.length>r;)if(t=n[r++],t.fail||!A(t.promise))return!1;return!0},D=function(e){g.call(s,function(){var t;k?b.emit("rejectionHandled",e):(t=s.onrejectionhandled)&&t({promise:e,reason:e._v})})},I=function(e){var t=this;t._d||(t._d=!0,t=t._w||t,t._v=e,t._s=2,t._a||(t._a=t._c.slice()),S(t,!0))},N=function(e){var t,n=this;if(!n._d){n._d=!0,n=n._w||n;try{if(n===e)throw m("Promise can't be resolved itself");(t=j(e))?_(function(){var r={_w:n,_d:!1};try{t.call(e,u(N,r,1),u(I,r,1))}catch(e){I.call(r,e)}}):(n._v=e,n._s=1,S(n,!1))}catch(e){I.call({_w:n,_d:!1},e)}}};C||(O=function(e){d(this,O,y,"_h"),h(e),r.call(this);try{e(u(N,this,1),u(I,this,1))}catch(e){I.call(this,e)}},r=function(e){this._c=[],this._a=void 0,this._s=0,this._d=!1,this._v=void 0,this._h=0,this._n=!1},r.prototype=n(104)(O.prototype,{then:function(e,t){var n=x(v(this,O));return n.ok="function"!=typeof e||e,n.fail="function"==typeof t&&t,n.domain=k?b.domain:void 0,this._c.push(n),this._a&&this._a.push(n),this._s&&S(this,!1),n.promise},catch:function(e){return this.then(void 0,e)}}),T=function(){var e=new r;this.promise=e,this.resolve=u(N,e,1),this.reject=u(I,e,1)}),l(l.G+l.W+l.F*!C,{Promise:O}),n(24)(O,y),n(106)(y),o=n(13)[y],l(l.S+l.F*!C,y,{reject:function(e){var t=x(this),n=t.reject;return n(e),t.promise}}),l(l.S+l.F*(a||!C),y,{resolve:function(e){if(e instanceof O&&E(e.constructor,this))return e;var t=x(this),n=t.resolve;return n(e),t.promise}}),l(l.S+l.F*!(C&&n(96)(function(e){O.all(e).catch(w)})),y,{all:function(e){var t=this,n=x(t),r=n.resolve,i=n.reject,o=M(function(){var n=[],o=0,a=1;p(e,!1,function(e){var s=o++,u=!1;n.push(void 0),a++,t.resolve(e).then(function(e){u||(u=!0,n[s]=e,--a||r(n))},i)}),--a||r(n)});return o&&i(o.error),n.promise},race:function(e){var t=this,n=x(t),r=n.reject,i=M(function(){p(e,!1,function(e){t.resolve(e).then(n.resolve,r)})});return i&&r(i.error),n.promise}})},function(e,t,n){"use strict";var r=n(108)(!0);n(34)(String,"String",function(e){this._t=String(e),this._i=0},function(){var e,t=this._t,n=this._i;return n>=t.length?{value:void 0,done:!0}:(e=r(t,n),this._i+=e.length,{value:e,done:!1})})},function(e,t,n){n(113);for(var r=n(8),i=n(11),o=n(15),a=n(6)("toStringTag"),s=["NodeList","DOMTokenList","MediaList","StyleSheetList","CSSRuleList"],u=0;u<5;u++){var c=s[u],l=r[c],f=l&&l.prototype;f&&!f[a]&&i(f,a,c),o[c]=o.Array}}])}); \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 9fe8fcb41..7fffd270e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "tui-image-editor", - "version": "3.0.0", + "version": "3.0.1", "lockfileVersion": 1, "requires": true, "dependencies": { From 5a1db9596067abfe542092b690508856e5bdf736 Mon Sep 17 00:00:00 2001 From: Dongsik Yoo Date: Wed, 13 Sep 2017 10:28:30 +0900 Subject: [PATCH 03/10] chore: create bundle files for 3.0.2 --- dist/tui-image-editor.js | 6 +++++- dist/tui-image-editor.min.js | 4 ++-- package.json | 2 +- 3 files changed, 8 insertions(+), 4 deletions(-) diff --git a/dist/tui-image-editor.js b/dist/tui-image-editor.js index dbf9eca21..bbeb14bb4 100644 --- a/dist/tui-image-editor.js +++ b/dist/tui-image-editor.js @@ -1,6 +1,6 @@ /*! * tui-image-editor.js - * @version 3.0.1 + * @version 3.0.2 * @author NHNEnt FE Development Lab * @license MIT */ @@ -4662,6 +4662,8 @@ return /******/ (function(modules) { // webpackBootstrap object.set(clone); + object.setCoords(); + this.getCanvas().renderAll(); return clone; @@ -4748,6 +4750,8 @@ return /******/ (function(modules) { // webpackBootstrap top: y + diffY }); + targetObj.setCoords(); + return true; } diff --git a/dist/tui-image-editor.min.js b/dist/tui-image-editor.min.js index 4e10453b9..af37acfee 100644 --- a/dist/tui-image-editor.min.js +++ b/dist/tui-image-editor.min.js @@ -1,10 +1,10 @@ /*! * tui-image-editor.min.js - * @version 3.0.1 + * @version 3.0.2 * @author NHNEnt FE Development Lab * @license MIT */ !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("fabric/dist/fabric.require"),require("tui-code-snippet")):"function"==typeof define&&define.amd?define(["fabric/dist/fabric.require","tui-code-snippet"],t):"object"==typeof exports?exports.ImageEditor=t(require("fabric/dist/fabric.require"),require("tui-code-snippet")):(e.tui=e.tui||{},e.tui.ImageEditor=t(e.fabric,e.tui&&e.tui.util))}(this,function(e,t){return function(e){function t(r){if(n[r])return n[r].exports;var i=n[r]={exports:{},id:r,loaded:!1};return e[r].call(i.exports,i,i.exports,t),i.loaded=!0,i.exports}var n={};return t.m=e,t.c=n,t.p="dist",t(0)}([function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(83),o=r(i);n(41),n(42),n(43),n(44),n(45),n(46),n(47),n(48),n(49),n(50),n(51),n(52),n(53),n(54),n(55),n(56),n(57),n(59),n(58),e.exports=o.default},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(9),o=r(i);e.exports={componentNames:o.default.keyMirror("IMAGE_LOADER","CROPPER","FLIP","ROTATION","FREE_DRAWING","LINE","TEXT","ICON","FILTER","SHAPE"),commandNames:{CLEAR_OBJECTS:"clearObjects",LOAD_IMAGE:"loadImage",FLIP_IMAGE:"flip",ROTATE_IMAGE:"rotate",ADD_OBJECT:"addObject",REMOVE_OBJECT:"removeObject",APPLY_FILTER:"applyFilter",REMOVE_FILTER:"removeFilter",ADD_ICON:"addIcon",CHANGE_ICON_COLOR:"changeIconColor",ADD_SHAPE:"addShape",CHANGE_SHAPE:"changeShape",ADD_TEXT:"addText",CHANGE_TEXT:"changeText",CHANGE_TEXT_STYLE:"changeTextStyle",ADD_IMAGE_OBJECT:"addImageObject",RESIZE_CANVAS_DIMENSION:"resizeCanvasDimension",SET_OBJECT_PROPERTIES:"setObjectProperties",SET_OBJECT_POSITION:"setObjectPosition"},eventNames:{OBJECT_ACTIVATED:"objectActivated",OBJECT_MOVED:"objectMoved",OBJECT_SCALED:"objectScaled",TEXT_EDITING:"textEditing",TEXT_CHANGED:"textChanged",ADD_TEXT:"addText",ADD_OBJECT:"addObject",MOUSE_DOWN:"mousedown",REDO_STACK_CHANGED:"redoStackChanged",UNDO_STACK_CHANGED:"undoStackChanged"},drawingModes:o.default.keyMirror("NORMAL","CROPPER","FREE_DRAWING","LINE_DRAWING","TEXT","SHAPE"),keyCodes:{Z:90,Y:89,SHIFT:16,BACKSPACE:8,DEL:46},fObjectOptions:{SELECTION_STYLE:{borderColor:"red",cornerColor:"green",cornerSize:10,originX:"center",originY:"center",transparentCorners:!1}},rejectMessages:{flip:"The flipX and flipY setting values are not changed.",rotation:"The current angle is same the old angle.",loadImage:"The background image is empty.",isLock:"The executing command state is locked.",undo:"The promise of undo command is reject.",redo:"The promise of redo command is reject.",invalidDrawingMode:"This operation is not supported in the drawing mode",invalidParameters:"Invalid parameters",noActiveObject:"There is no active object.",unsupportedType:"Unsupported object type",noObject:"The object is not in canvas.",addedObject:"The object is already added."}}},function(e,t,n){n(114),n(116),n(117),n(115),e.exports=n(13).Promise},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e){var t=u[e];if(t){for(var n=arguments.length,r=Array(n>1?n-1:0),i=1;in&&(r=t,t=n,n=r),o(t,i(e,n))},keyMirror:function(){for(var e={},t=arguments.length,n=Array(t),i=0;i0?r:n)(e)}},function(e,t,n){var r=n(92),i=n(22);e.exports=function(e){return r(i(e))}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(9),s=(0,a.keyMirror)("UN_IMPLEMENTATION","NO_COMPONENT_NAME"),u={UN_IMPLEMENTATION:"Should implement a method: ",NO_COMPONENT_NAME:"Should set a component name"},c={UN_IMPLEMENTATION:function(e){return u.UN_IMPLEMENTATION+e},NO_COMPONENT_NAME:function(){return u.NO_COMPONENT_NAME}};e.exports={types:o.default.extend({},s),create:function(e){e=e.toLowerCase();for(var t=c[e],n=arguments.length,r=Array(n>1?n-1:0),i=1;in;)t.push(arguments[n++]);return g[++v]=function(){s("function"==typeof e?e:Function(e),t)},r(v),v},d=function(e){delete g[e]},"process"==n(16)(f)?r=function(e){f.nextTick(a(y,e,1))}:p?(i=new p,o=i.port2,i.port1.onmessage=m,r=a(o.postMessage,o,1)):l.addEventListener&&"function"==typeof postMessage&&!l.importScripts?(r=function(e){l.postMessage(e+"","*")},l.addEventListener("message",m,!1)):r=_ in c("script")?function(e){u.appendChild(c("script"))[_]=function(){u.removeChild(this),y.call(e)}}:function(e){setTimeout(a(y,e,1),0)}),e.exports={set:h,clear:d}},function(e,t,n){var r=n(26),i=Math.min;e.exports=function(e){return e>0?i(r(e),9007199254740991):0}},function(e,t){var n=0,r=Math.random();e.exports=function(e){return"Symbol(".concat(void 0===e?"":e,")_",(++n+r).toString(36))}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.commandNames,h=l.ICON,d={name:f.ADD_ICON,execute:function(e,t,n){var r=this,i=e.getComponent(h);return i.add(t,n).then(function(t){return r.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(d),e.exports=d},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f={name:l.ADD_IMAGE_OBJECT,execute:function(e,t){var n=this;return e.addImageObject(t).then(function(t){return n.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f=c.default.rejectMessages,h={name:l.ADD_OBJECT,execute:function(e,t){return new s.default(function(n,r){e.contains(t)?r(f.addedObject):(e.add(t),n(t))})},undo:function(e,t){return new s.default(function(n,r){e.contains(t)?(e.remove(t),n(t)):r(f.noObject)})}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.commandNames,h=l.SHAPE,d={name:f.ADD_SHAPE,execute:function(e,t,n){var r=this,i=e.getComponent(h);return i.add(t,n).then(function(t){return r.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(d),e.exports=d},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.commandNames,h=l.TEXT,d={name:f.ADD_TEXT,execute:function(e,t,n){var r=this,i=e.getComponent(h);return i.add(t,n).then(function(t){return r.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(d),e.exports=d},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.rejectMessages,l=s.default.commandNames,f=u.FILTER,h={name:l.APPLY_FILTER,execute:function(e,t,n){var r=e.getComponent(f);if("mask"===t){var i=e.getObject(n.maskObjId);if(!i||!i.isType("image"))return Promise.reject(c.invalidParameters);n={mask:i}}return"mask"===t?(this.undoData.object=n.mask,e.remove(n.mask)):this.undoData.options=r.getOptions(t),r.add(t,n)},undo:function(e,t){var n=e.getComponent(f);if("mask"===t){var r=this.undoData.object;return e.add(r),e.setActiveObject(r),n.remove(t)}return this.undoData.options?n.add(t,this.undoData.options):n.remove(t)}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.rejectMessages,h=c.default.commandNames,d=l.ICON,p={name:h.CHANGE_ICON_COLOR,execute:function(e,t,n){var r=this;return new s.default(function(i,o){var a=e.getComponent(d),s=e.getObject(t);s||o(f.noObject),r.undoData.object=s,r.undoData.color=a.getColor(s),a.setColor(n,s),i()})},undo:function(e){var t=e.getComponent(d),n=this.undoData.object,r=n.object,i=n.color;return t.setColor(i,r),s.default.resolve()}};o.default.register(p),e.exports=p},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(3),s=r(a),u=n(2),c=r(u),l=n(1),f=r(l),h=f.default.componentNames,d=f.default.rejectMessages,p=f.default.commandNames,v=h.SHAPE,g={name:p.CHANGE_SHAPE,execute:function(e,t,n){var r=this,i=e.getComponent(v),a=e.getObject(t);return a?(this.undoData.object=a,this.undoData.options={},o.default.forEachOwnProperties(n,function(e,t){r.undoData.options[t]=a[t]}),i.change(a,n)):c.default.reject(d.noObject)},undo:function(e){var t=e.getComponent(v),n=this.undoData,r=n.object,i=n.options;return t.change(r,i)}};s.default.register(g),e.exports=g},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.rejectMessages,h=c.default.commandNames,d=l.TEXT,p={name:h.CHANGE_TEXT,execute:function(e,t,n){var r=e.getComponent(d),i=e.getObject(t);return i?(this.undoData.object=i,this.undoData.text=r.getText(i),r.change(i,n)):s.default.reject(f.noObject)},undo:function(e){var t=e.getComponent(d),n=this.undoData,r=n.object,i=n.text;return t.change(r,i)}};o.default.register(p),e.exports=p},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(3),s=r(a),u=n(2),c=r(u),l=n(1),f=r(l),h=f.default.componentNames,d=f.default.rejectMessages,p=f.default.commandNames,v=h.TEXT,g={name:p.CHANGE_TEXT_STYLE,execute:function(e,t,n){var r=this,i=e.getComponent(v),a=e.getObject(t);return a?(this.undoData.object=a,this.undoData.styles={},o.default.forEachOwnProperties(n,function(e,t){r.undoData.styles[t]=a[t]}),i.setStyle(a,n)):c.default.reject(d.noObject)},undo:function(e){var t=e.getComponent(v),n=this.undoData,r=n.object,i=n.styles;return t.setStyle(r,i)}};s.default.register(g),e.exports=g},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f={name:l.CLEAR_OBJECTS,execute:function(e){var t=this;return new s.default(function(n){t.undoData.objects=e.removeAll(),n()})},undo:function(e){return e.add(this.undoData.objects),s.default.resolve()}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.FLIP,f={name:c.FLIP_IMAGE,execute:function(e,t){var n=e.getComponent(l);return this.undoData.setting=n.getCurrentSetting(),n[t]()},undo:function(e){var t=e.getComponent(l);return t.set(this.undoData.setting)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.IMAGE_LOADER,f={name:c.LOAD_IMAGE,execute:function(e,t,n){var r=e.getComponent(l),i=r.getCanvasImage(),o=i?i.width:0,a=i?i.height:0;return this.undoData={name:r.getImageName(),image:i,objects:e.removeAll(!0)},r.load(t,n).then(function(e){return{oldWidth:o,oldHeight:a,newWidth:e.width,newHeight:e.height}})},undo:function(e){var t=e.getComponent(l),n=this.undoData,r=n.objects,i=n.name,o=n.image;return e.removeAll(!0),e.add(r),t.load(i,o)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.FILTER,f={name:c.REMOVE_FILTER,execute:function(e,t){var n=e.getComponent(l);return this.undoData.options=n.getOptions(t),n.remove(t)},undo:function(e,t){var n=e.getComponent(l),r=this.undoData.options;return n.add(t,r)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f=c.default.rejectMessages,h={name:l.REMOVE_OBJECT,execute:function(e,t){var n=this;return new s.default(function(r,i){n.undoData.objects=e.removeObjectById(t),n.undoData.objects.length?r():i(f.noObject)})},undo:function(e){return e.add(this.undoData.objects),s.default.resolve()}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f={name:l.RESIZE_CANVAS_DIMENSION,execute:function(e,t){var n=this;return new s.default(function(r){n.undoData.size={width:e.cssMaxWidth,height:e.cssMaxHeight},e.setCssMaxDimension(t),e.adjustCanvasDimension(),r()})},undo:function(e){return e.setCssMaxDimension(this.undoData.size),e.adjustCanvasDimension(),s.default.resolve()}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.ROTATION,f={name:c.ROTATE_IMAGE,execute:function(e,t,n){var r=e.getComponent(l);return this.undoData.angle=r.getCurrentAngle(),r[t](n)},undo:function(e){var t=e.getComponent(l),n=this.undoData.angle;return t.setAngle(n)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f=c.default.rejectMessages,h={name:l.SET_OBJECT_POSITION,execute:function(e,t,n){var r=e.getObject(t);return r?(this.undoData.objectId=t,this.undoData.props=e.getObjectProperties(t,["left","top"]),e.setObjectPosition(t,n),e.renderAll(),s.default.resolve()):s.default.reject(f.noObject)},undo:function(e){var t=this.undoData,n=t.objectId,r=t.props;return e.setObjectProperties(n,r),e.renderAll(),s.default.resolve()}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(3),s=r(a),u=n(2),c=r(u),l=n(1),f=r(l),h=f.default.commandNames,d=f.default.rejectMessages,p={name:h.SET_OBJECT_PROPERTIES,execute:function(e,t,n){var r=this,i=e.getObject(t);return i?(this.undoData.props={},o.default.forEachOwnProperties(n,function(e,t){r.undoData.props[t]=i[t]}),e.setObjectProperties(t,n),c.default.resolve()):c.default.reject(d.noObject)},undo:function(e,t){var n=this.undoData.props;return e.setObjectProperties(t,n),c.default.resolve()}};s.default.register(p),e.exports=p},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;ng&&(o.remove(),o.set(this._calcRectDimensionFromPoint(r,i)),t.add(o))}},{key:"_calcRectDimensionFromPoint",value:function(e,t){var n=this.getCanvas(),r=n.getWidth(),i=n.getHeight(),o=this._startX,a=this._startY,s=(0,v.clamp)(e,0,o),u=(0,v.clamp)(t,0,a),c=(0,v.clamp)(e,o,r)-s,l=(0,v.clamp)(t,a,i)-u;return this._withShiftKey&&(c>l?l=c:l>c&&(c=l),o>=e&&(s=o-c),a>=t&&(u=a-l)),{left:s,top:u,width:c,height:l}}},{key:"_onFabricMouseUp",value:function(){var e=this._cropzone,t=this._listeners,n=this.getCanvas();n.setActiveObject(e),n.off({"mouse:move":t.mousemove,"mouse:up":t.mouseup})}},{key:"getCroppedImageData",value:function(e){var t=this.getCanvas(),n=t.contains(this._cropzone);if(!e)return null;n&&this._cropzone.remove();var r={imageName:this.getImageName(),url:t.toDataURL(e)};return n&&t.add(this._cropzone),r}},{key:"getCropzoneRect",value:function(){var e=this._cropzone;return e.isValid()?{left:e.getLeft(),top:e.getTop(),width:e.getWidth(),height:e.getHeight()}:null}},{key:"_onKeyDown",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!0)}},{key:"_onKeyUp",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!1)}}]),t}(f.default);e.exports=_},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;nn},_getColor:function(e,t,n){var r=[0,0,0,0],i=e.data,o=e.width,a=4,s=(o*n+t)*a;return r[0]=i[s],r[1]=i[s+1],r[2]=i[s+2],r[3]=i[s+3],r}});e.exports=a},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(4),s=r(a),u=n(9),c="tl",l="tr",f="mt",h="ml",d="mr",p="mb",v="bl",g="br",_=s.default.util.createClass(s.default.Rect,{initialize:function(e){e.type="cropzone",this.callSuper("initialize",e),this.on({moving:this._onMoving,scaling:this._onScaling})},_render:function(e){var t=7,n=7;this.callSuper("_render",e);var r=this.flipX?-1:1,i=this.flipY?-1:1,o=r/this.scaleX,a=i/this.scaleY;e.scale(o,a),this._fillOuterRect(e,"rgba(0, 0, 0, 0.55)"),this._strokeBorder(e,"rgb(0, 0, 0)",t),this._strokeBorder(e,"rgb(255, 255, 255)",t,n),e.scale(1/o,1/a)},_fillOuterRect:function(e,t){var n=this._getCoordinates(e),r=n.x,i=n.y;e.save(),e.fillStyle=t,e.beginPath(),e.moveTo(r[0]-1,i[0]-1),e.lineTo(r[3]+1,i[0]-1),e.lineTo(r[3]+1,i[3]+1),e.lineTo(r[0]-1,i[3]-1),e.lineTo(r[0]-1,i[0]-1),e.closePath(),e.moveTo(r[1],i[1]),e.lineTo(r[1],i[2]),e.lineTo(r[2],i[2]),e.lineTo(r[2],i[1]),e.lineTo(r[1],i[1]),e.closePath(),e.fill(),e.restore()},_getCoordinates:function(e){var t=this.getWidth(),n=this.getHeight(),r=t/2,i=n/2,a=this.getLeft(),s=this.getTop(),u=e.canvas;return{x:o.default.map([-(r+a),-r,r,r+(u.width-a-t)],Math.ceil),y:o.default.map([-(i+s),-i,i,i+(u.height-s-n)],Math.ceil)}},_strokeBorder:function(e,t,n,r){var i=this.getWidth()/2,o=this.getHeight()/2;e.save(),e.strokeStyle=t,e.setLineDash&&e.setLineDash([n,n]),r&&(e.lineDashOffset=r),e.beginPath(),e.moveTo(-i,-o),e.lineTo(i,-o),e.lineTo(i,o),e.lineTo(-i,o),e.lineTo(-i,-o),e.stroke(),e.restore()},_onMoving:function(){var e=this.getLeft(),t=this.getTop(),n=this.getWidth(),r=this.getHeight(),i=this.canvas.getWidth()-n,o=this.canvas.getHeight()-r; -this.setLeft((0,u.clamp)(e,0,i)),this.setTop((0,u.clamp)(t,0,o))},_onScaling:function(e){var t=this.canvas.getPointer(e.e),n=this._calcScalingSizeFromPointer(t);this.scale(1).set(n)},_calcScalingSizeFromPointer:function(e){var t=e.x,n=e.y,r=this._calcTopLeftScalingSizeFromPointer(t,n),i=this._calcBottomRightScalingSizeFromPointer(t,n);return this._makeScalingSettings(r,i)},_calcTopLeftScalingSizeFromPointer:function(e,t){var n=this.getHeight()+this.top,r=this.getWidth()+this.left,i=(0,u.clamp)(t,0,n-1),o=(0,u.clamp)(e,0,r-1);return{top:i,left:o,width:r-o,height:n-i}},_calcBottomRightScalingSizeFromPointer:function(e,t){var n=this.canvas,r=n.width,i=n.height,o=this.left,a=this.top;return{width:(0,u.clamp)(e,o+1,r)-o,height:(0,u.clamp)(t,a+1,i)-a}},_makeScalingSettings:function(e,t){var n=e.width,r=e.height,i=t.height,o=t.width,a=e.left,s=e.top,u=void 0;switch(this.__corner){case c:u=e;break;case l:u={width:o,height:r,top:s};break;case v:u={width:n,height:i,left:a};break;case g:u=t;break;case h:u={width:n,left:a};break;case f:u={height:r,top:s};break;case d:u={width:o};break;case p:u={height:i}}return u},isValid:function(){return this.left>=0&&this.top>=0&&this.width>0&&this.height>0}});e.exports=_},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(4),o=r(i),a=o.default.util.createClass(o.default.Image.filters.Convolute,{type:"Emboss",initialize:function(){var e=[1,1,1,1,.7,-1,-1,-1,-1];this.matrix=e}});e.exports=a},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(4),o=r(i),a=o.default.util.createClass(o.default.Image.filters.Mask,{applyTo:function(e){if(this.mask){var t=e.width,n=e.height,r=this._createCanvasOfMask(t,n),i=e.getContext("2d"),o=r.getContext("2d"),a=i.getImageData(0,0,t,n);this._drawMask(o,e,i),this._mapData(o,a,t,n),i.putImageData(a,0,0)}},_createCanvasOfMask:function(e,t){var n=o.default.util.createCanvasElement();return n.width=e,n.height=t,n},_drawMask:function(e){var t=this.mask,n=t.getElement(),r=t.getLeft(),i=t.getTop(),o=t.getAngle();e.save(),e.translate(r,i),e.rotate(o*Math.PI/180),e.scale(t.scaleX,t.scaleY),e.drawImage(n,-n.width/2,-n.height/2),e.restore()},_mapData:function(e,t,n,r){for(var i=t.data,o=e.getImageData(0,0,n,r).data,a=this.channel,s=t.width*t.height*4,u=0;uu?"right":"left",originY:i>c?"bottom":"top"}}function i(e){return"center"===e.getOriginX()&&"center"===e.getOriginY()}function o(e,t){var n=t.getPointByOrigin("center","center"),i=-t.getAngle(),o=r(n,e,i),a=o.originX,s=o.originY,u=t.getPointByOrigin(a,s),c=t.getLeft()-(n.x-u.x),l=t.getTop()-(n.x-u.y);t.set({originX:a,originY:s,left:c,top:l}),t.setCoords()}function a(e,t){var n=t.startPoint,i=-t.getAngle(),o=r(n,e,i),a=o.originX,s=o.originY;t.setPositionByOrigin(n,a,s)}function s(e){var t=e.type,n=e.scaleX,r=e.scaleY,i=l[t],o=e[i.w]*n,a=e[i.h]*r;if(e.isRegular){var s=Math.max(n,r);o=e[i.w]*s,a=e[i.h]*s}var u={hasControls:!1,hasBorders:!1,scaleX:1,scaleY:1};u[i.w]=o,u[i.h]=a,e.set(u)}function u(e,t){var n=t.type,r=t.strokeWidth,i=t.startPoint,o=c[n],a=l[n],s=!("triangle"!==t.type),u={},f=Math.abs(i.x-e.x)/o,h=Math.abs(i.y-e.y)/o;f>r&&(f-=r/o),h>r&&(h-=r/o),t.isRegular&&(f=h=Math.max(f,h),s&&(h=Math.sqrt(3)/2*f)),u[a.w]=f,u[a.h]=h,t.set(u)}var c={rect:1,circle:2,triangle:1},l={rect:{w:"width",h:"height"},circle:{w:"rx",h:"ry"},triangle:{w:"width",h:"height"}};e.exports={setOrigins:function(e){var t=e.getPointByOrigin("left","top"),n=e.getPointByOrigin("right","top"),r=e.getPointByOrigin("right","bottom"),i=e.getPointByOrigin("left","bottom");e.origins={lt:t,rt:n,rb:r,lb:i}},resize:function(e,t,r){i(e)&&(o(t,e),n(e)),r?s(e,t):u(t,e),a(t,e)},adjustOriginToCenter:function(e){var t=e.getPointByOrigin("center","center"),n=e.getOriginX(),r=e.getOriginY(),i=e.getPointByOrigin(n,r),o=e.getLeft()+(t.x-i.x),a=e.getTop()+(t.y-i.y);e.set({hasControls:!0,hasBorders:!0,originX:"center",originY:"center",left:o,top:a}),e.setCoords()}}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var o=function(){function e(e,t){for(var n=0;n1?n-1:0),i=1;il;)if(s=u[l++],s!=s)return!0}else for(;c>l;l++)if((e||l in u)&&u[l]===n)return e||l||0;return!e&&-1}}},function(e,t,n){var r=n(17),i=n(94),o=n(93),a=n(10),s=n(39),u=n(112),c={},l={},t=e.exports=function(e,t,n,f,h){var d,p,v,g,_=h?function(){return e}:u(e),y=r(n,f,t?2:1),m=0;if("function"!=typeof _)throw TypeError(e+" is not iterable!");if(o(_)){for(d=s(e.length);d>m;m++)if(g=t?y(a(p=e[m])[0],p[1]):y(e[m]),g===c||g===l)return g}else for(v=_.call(e);!(p=v.next()).done;)if(g=i(v,y,p.value,t),g===c||g===l)return g};t.BREAK=c,t.RETURN=l},function(e,t,n){e.exports=!n(14)&&!n(32)(function(){return 7!=Object.defineProperty(n(23)("div"),"a",{get:function(){return 7}}).a})},function(e,t){e.exports=function(e,t,n){var r=void 0===n;switch(t.length){case 0:return r?e():e.call(n);case 1:return r?e(t[0]):e.call(n,t[0]);case 2:return r?e(t[0],t[1]):e.call(n,t[0],t[1]);case 3:return r?e(t[0],t[1],t[2]):e.call(n,t[0],t[1],t[2]);case 4:return r?e(t[0],t[1],t[2],t[3]):e.call(n,t[0],t[1],t[2],t[3])}return e.apply(n,t)}},function(e,t,n){var r=n(16);e.exports=Object("z").propertyIsEnumerable(0)?Object:function(e){return"String"==r(e)?e.split(""):Object(e)}},function(e,t,n){var r=n(15),i=n(6)("iterator"),o=Array.prototype;e.exports=function(e){return void 0!==e&&(r.Array===e||o[i]===e)}},function(e,t,n){var r=n(10);e.exports=function(e,t,n,i){try{return i?t(r(n)[0],n[1]):t(n)}catch(t){var o=e.return;throw void 0!==o&&r(o.call(e)),t}}},function(e,t,n){"use strict";var r=n(99),i=n(36),o=n(24),a={};n(11)(a,n(6)("iterator"),function(){return this}),e.exports=function(e,t,n){e.prototype=r(a,{next:i(1,n)}),o(e,t+" Iterator")}},function(e,t,n){var r=n(6)("iterator"),i=!1;try{var o=[7][r]();o.return=function(){i=!0},Array.from(o,function(){throw 2})}catch(e){}e.exports=function(e,t){if(!t&&!i)return!1;var n=!1;try{var o=[7],a=o[r]();a.next=function(){return{done:n=!0}},o[r]=function(){return a},e(o)}catch(e){}return n}},function(e,t){e.exports=function(e,t){return{value:t,done:!!e}}},function(e,t,n){var r=n(8),i=n(38).set,o=r.MutationObserver||r.WebKitMutationObserver,a=r.process,s=r.Promise,u="process"==n(16)(a);e.exports=function(){var e,t,n,c=function(){var r,i;for(u&&(r=a.domain)&&r.exit();e;){i=e.fn,e=e.next;try{i()}catch(r){throw e?n():t=void 0,r}}t=void 0,r&&r.enter()};if(u)n=function(){a.nextTick(c)};else if(o){var l=!0,f=document.createTextNode("");new o(c).observe(f,{characterData:!0}),n=function(){f.data=l=!l}}else if(s&&s.resolve){var h=s.resolve();n=function(){h.then(c)}}else n=function(){i.call(r,c)};return function(r){var i={fn:r,next:void 0};t&&(t.next=i),e||(e=i,n()),t=i}}},function(e,t,n){var r=n(10),i=n(100),o=n(30),a=n(25)("IE_PROTO"),s=function(){},u="prototype",c=function(){var e,t=n(23)("iframe"),r=o.length,i="<",a=">";for(t.style.display="none",n(33).appendChild(t),t.src="javascript:",e=t.contentWindow.document,e.open(),e.write(i+"script"+a+"document.F=Object"+i+"/script"+a),e.close(),c=e.F;r--;)delete c[u][o[r]];return c()};e.exports=Object.create||function(e,t){var n;return null!==e?(s[u]=r(e),n=new s,s[u]=null,n[a]=e):n=c(),void 0===t?n:i(n,t)}},function(e,t,n){var r=n(20),i=n(10),o=n(103);e.exports=n(14)?Object.defineProperties:function(e,t){i(e);for(var n,a=o(t),s=a.length,u=0;s>u;)r.f(e,n=a[u++],t[n]);return e}},function(e,t,n){var r=n(18),i=n(110),o=n(25)("IE_PROTO"),a=Object.prototype;e.exports=Object.getPrototypeOf||function(e){return e=i(e),r(e,o)?e[o]:"function"==typeof e.constructor&&e instanceof e.constructor?e.constructor.prototype:e instanceof Object?a:null}},function(e,t,n){var r=n(18),i=n(27),o=n(88)(!1),a=n(25)("IE_PROTO");e.exports=function(e,t){var n,s=i(e),u=0,c=[];for(n in s)n!=a&&r(s,n)&&c.push(n);for(;t.length>u;)r(s,n=t[u++])&&(~o(c,n)||c.push(n));return c}},function(e,t,n){var r=n(102),i=n(30);e.exports=Object.keys||function(e){return r(e,i)}},function(e,t,n){var r=n(11);e.exports=function(e,t,n){for(var i in t)n&&e[i]?e[i]=t[i]:r(e,i,t[i]);return e}},function(e,t,n){e.exports=n(11)},function(e,t,n){"use strict";var r=n(8),i=n(13),o=n(20),a=n(14),s=n(6)("species");e.exports=function(e){var t="function"==typeof i[e]?i[e]:r[e];a&&t&&!t[s]&&o.f(t,s,{configurable:!0,get:function(){return this}})}},function(e,t,n){var r=n(10),i=n(21),o=n(6)("species");e.exports=function(e,t){var n,a=r(e).constructor;return void 0===a||void 0==(n=r(a)[o])?t:i(n)}},function(e,t,n){var r=n(26),i=n(22);e.exports=function(e){return function(t,n){var o,a,s=String(i(t)),u=r(n),c=s.length;return u<0||u>=c?e?"":void 0:(o=s.charCodeAt(u),o<55296||o>56319||u+1===c||(a=s.charCodeAt(u+1))<56320||a>57343?e?s.charAt(u):o:e?s.slice(u,u+2):(o-55296<<10)+(a-56320)+65536)}}},function(e,t,n){var r=n(26),i=Math.max,o=Math.min;e.exports=function(e,t){return e=r(e),e<0?i(e+t,0):o(e,t)}},function(e,t,n){var r=n(22);e.exports=function(e){return Object(r(e))}},function(e,t,n){var r=n(19);e.exports=function(e,t){if(!r(e))return e;var n,i;if(t&&"function"==typeof(n=e.toString)&&!r(i=n.call(e)))return i; +this.setLeft((0,u.clamp)(e,0,i)),this.setTop((0,u.clamp)(t,0,o))},_onScaling:function(e){var t=this.canvas.getPointer(e.e),n=this._calcScalingSizeFromPointer(t);this.scale(1).set(n)},_calcScalingSizeFromPointer:function(e){var t=e.x,n=e.y,r=this._calcTopLeftScalingSizeFromPointer(t,n),i=this._calcBottomRightScalingSizeFromPointer(t,n);return this._makeScalingSettings(r,i)},_calcTopLeftScalingSizeFromPointer:function(e,t){var n=this.getHeight()+this.top,r=this.getWidth()+this.left,i=(0,u.clamp)(t,0,n-1),o=(0,u.clamp)(e,0,r-1);return{top:i,left:o,width:r-o,height:n-i}},_calcBottomRightScalingSizeFromPointer:function(e,t){var n=this.canvas,r=n.width,i=n.height,o=this.left,a=this.top;return{width:(0,u.clamp)(e,o+1,r)-o,height:(0,u.clamp)(t,a+1,i)-a}},_makeScalingSettings:function(e,t){var n=e.width,r=e.height,i=t.height,o=t.width,a=e.left,s=e.top,u=void 0;switch(this.__corner){case c:u=e;break;case l:u={width:o,height:r,top:s};break;case v:u={width:n,height:i,left:a};break;case g:u=t;break;case h:u={width:n,left:a};break;case f:u={height:r,top:s};break;case d:u={width:o};break;case p:u={height:i}}return u},isValid:function(){return this.left>=0&&this.top>=0&&this.width>0&&this.height>0}});e.exports=_},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(4),o=r(i),a=o.default.util.createClass(o.default.Image.filters.Convolute,{type:"Emboss",initialize:function(){var e=[1,1,1,1,.7,-1,-1,-1,-1];this.matrix=e}});e.exports=a},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(4),o=r(i),a=o.default.util.createClass(o.default.Image.filters.Mask,{applyTo:function(e){if(this.mask){var t=e.width,n=e.height,r=this._createCanvasOfMask(t,n),i=e.getContext("2d"),o=r.getContext("2d"),a=i.getImageData(0,0,t,n);this._drawMask(o,e,i),this._mapData(o,a,t,n),i.putImageData(a,0,0)}},_createCanvasOfMask:function(e,t){var n=o.default.util.createCanvasElement();return n.width=e,n.height=t,n},_drawMask:function(e){var t=this.mask,n=t.getElement(),r=t.getLeft(),i=t.getTop(),o=t.getAngle();e.save(),e.translate(r,i),e.rotate(o*Math.PI/180),e.scale(t.scaleX,t.scaleY),e.drawImage(n,-n.width/2,-n.height/2),e.restore()},_mapData:function(e,t,n,r){for(var i=t.data,o=e.getImageData(0,0,n,r).data,a=this.channel,s=t.width*t.height*4,u=0;uu?"right":"left",originY:i>c?"bottom":"top"}}function i(e){return"center"===e.getOriginX()&&"center"===e.getOriginY()}function o(e,t){var n=t.getPointByOrigin("center","center"),i=-t.getAngle(),o=r(n,e,i),a=o.originX,s=o.originY,u=t.getPointByOrigin(a,s),c=t.getLeft()-(n.x-u.x),l=t.getTop()-(n.x-u.y);t.set({originX:a,originY:s,left:c,top:l}),t.setCoords()}function a(e,t){var n=t.startPoint,i=-t.getAngle(),o=r(n,e,i),a=o.originX,s=o.originY;t.setPositionByOrigin(n,a,s)}function s(e){var t=e.type,n=e.scaleX,r=e.scaleY,i=l[t],o=e[i.w]*n,a=e[i.h]*r;if(e.isRegular){var s=Math.max(n,r);o=e[i.w]*s,a=e[i.h]*s}var u={hasControls:!1,hasBorders:!1,scaleX:1,scaleY:1};u[i.w]=o,u[i.h]=a,e.set(u)}function u(e,t){var n=t.type,r=t.strokeWidth,i=t.startPoint,o=c[n],a=l[n],s=!("triangle"!==t.type),u={},f=Math.abs(i.x-e.x)/o,h=Math.abs(i.y-e.y)/o;f>r&&(f-=r/o),h>r&&(h-=r/o),t.isRegular&&(f=h=Math.max(f,h),s&&(h=Math.sqrt(3)/2*f)),u[a.w]=f,u[a.h]=h,t.set(u)}var c={rect:1,circle:2,triangle:1},l={rect:{w:"width",h:"height"},circle:{w:"rx",h:"ry"},triangle:{w:"width",h:"height"}};e.exports={setOrigins:function(e){var t=e.getPointByOrigin("left","top"),n=e.getPointByOrigin("right","top"),r=e.getPointByOrigin("right","bottom"),i=e.getPointByOrigin("left","bottom");e.origins={lt:t,rt:n,rb:r,lb:i}},resize:function(e,t,r){i(e)&&(o(t,e),n(e)),r?s(e,t):u(t,e),a(t,e)},adjustOriginToCenter:function(e){var t=e.getPointByOrigin("center","center"),n=e.getOriginX(),r=e.getOriginY(),i=e.getPointByOrigin(n,r),o=e.getLeft()+(t.x-i.x),a=e.getTop()+(t.y-i.y);e.set({hasControls:!0,hasBorders:!0,originX:"center",originY:"center",left:o,top:a}),e.setCoords()}}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var o=function(){function e(e,t){for(var n=0;n1?n-1:0),i=1;il;)if(s=u[l++],s!=s)return!0}else for(;c>l;l++)if((e||l in u)&&u[l]===n)return e||l||0;return!e&&-1}}},function(e,t,n){var r=n(17),i=n(94),o=n(93),a=n(10),s=n(39),u=n(112),c={},l={},t=e.exports=function(e,t,n,f,h){var d,p,v,g,_=h?function(){return e}:u(e),y=r(n,f,t?2:1),m=0;if("function"!=typeof _)throw TypeError(e+" is not iterable!");if(o(_)){for(d=s(e.length);d>m;m++)if(g=t?y(a(p=e[m])[0],p[1]):y(e[m]),g===c||g===l)return g}else for(v=_.call(e);!(p=v.next()).done;)if(g=i(v,y,p.value,t),g===c||g===l)return g};t.BREAK=c,t.RETURN=l},function(e,t,n){e.exports=!n(14)&&!n(32)(function(){return 7!=Object.defineProperty(n(23)("div"),"a",{get:function(){return 7}}).a})},function(e,t){e.exports=function(e,t,n){var r=void 0===n;switch(t.length){case 0:return r?e():e.call(n);case 1:return r?e(t[0]):e.call(n,t[0]);case 2:return r?e(t[0],t[1]):e.call(n,t[0],t[1]);case 3:return r?e(t[0],t[1],t[2]):e.call(n,t[0],t[1],t[2]);case 4:return r?e(t[0],t[1],t[2],t[3]):e.call(n,t[0],t[1],t[2],t[3])}return e.apply(n,t)}},function(e,t,n){var r=n(16);e.exports=Object("z").propertyIsEnumerable(0)?Object:function(e){return"String"==r(e)?e.split(""):Object(e)}},function(e,t,n){var r=n(15),i=n(6)("iterator"),o=Array.prototype;e.exports=function(e){return void 0!==e&&(r.Array===e||o[i]===e)}},function(e,t,n){var r=n(10);e.exports=function(e,t,n,i){try{return i?t(r(n)[0],n[1]):t(n)}catch(t){var o=e.return;throw void 0!==o&&r(o.call(e)),t}}},function(e,t,n){"use strict";var r=n(99),i=n(36),o=n(24),a={};n(11)(a,n(6)("iterator"),function(){return this}),e.exports=function(e,t,n){e.prototype=r(a,{next:i(1,n)}),o(e,t+" Iterator")}},function(e,t,n){var r=n(6)("iterator"),i=!1;try{var o=[7][r]();o.return=function(){i=!0},Array.from(o,function(){throw 2})}catch(e){}e.exports=function(e,t){if(!t&&!i)return!1;var n=!1;try{var o=[7],a=o[r]();a.next=function(){return{done:n=!0}},o[r]=function(){return a},e(o)}catch(e){}return n}},function(e,t){e.exports=function(e,t){return{value:t,done:!!e}}},function(e,t,n){var r=n(8),i=n(38).set,o=r.MutationObserver||r.WebKitMutationObserver,a=r.process,s=r.Promise,u="process"==n(16)(a);e.exports=function(){var e,t,n,c=function(){var r,i;for(u&&(r=a.domain)&&r.exit();e;){i=e.fn,e=e.next;try{i()}catch(r){throw e?n():t=void 0,r}}t=void 0,r&&r.enter()};if(u)n=function(){a.nextTick(c)};else if(o){var l=!0,f=document.createTextNode("");new o(c).observe(f,{characterData:!0}),n=function(){f.data=l=!l}}else if(s&&s.resolve){var h=s.resolve();n=function(){h.then(c)}}else n=function(){i.call(r,c)};return function(r){var i={fn:r,next:void 0};t&&(t.next=i),e||(e=i,n()),t=i}}},function(e,t,n){var r=n(10),i=n(100),o=n(30),a=n(25)("IE_PROTO"),s=function(){},u="prototype",c=function(){var e,t=n(23)("iframe"),r=o.length,i="<",a=">";for(t.style.display="none",n(33).appendChild(t),t.src="javascript:",e=t.contentWindow.document,e.open(),e.write(i+"script"+a+"document.F=Object"+i+"/script"+a),e.close(),c=e.F;r--;)delete c[u][o[r]];return c()};e.exports=Object.create||function(e,t){var n;return null!==e?(s[u]=r(e),n=new s,s[u]=null,n[a]=e):n=c(),void 0===t?n:i(n,t)}},function(e,t,n){var r=n(20),i=n(10),o=n(103);e.exports=n(14)?Object.defineProperties:function(e,t){i(e);for(var n,a=o(t),s=a.length,u=0;s>u;)r.f(e,n=a[u++],t[n]);return e}},function(e,t,n){var r=n(18),i=n(110),o=n(25)("IE_PROTO"),a=Object.prototype;e.exports=Object.getPrototypeOf||function(e){return e=i(e),r(e,o)?e[o]:"function"==typeof e.constructor&&e instanceof e.constructor?e.constructor.prototype:e instanceof Object?a:null}},function(e,t,n){var r=n(18),i=n(27),o=n(88)(!1),a=n(25)("IE_PROTO");e.exports=function(e,t){var n,s=i(e),u=0,c=[];for(n in s)n!=a&&r(s,n)&&c.push(n);for(;t.length>u;)r(s,n=t[u++])&&(~o(c,n)||c.push(n));return c}},function(e,t,n){var r=n(102),i=n(30);e.exports=Object.keys||function(e){return r(e,i)}},function(e,t,n){var r=n(11);e.exports=function(e,t,n){for(var i in t)n&&e[i]?e[i]=t[i]:r(e,i,t[i]);return e}},function(e,t,n){e.exports=n(11)},function(e,t,n){"use strict";var r=n(8),i=n(13),o=n(20),a=n(14),s=n(6)("species");e.exports=function(e){var t="function"==typeof i[e]?i[e]:r[e];a&&t&&!t[s]&&o.f(t,s,{configurable:!0,get:function(){return this}})}},function(e,t,n){var r=n(10),i=n(21),o=n(6)("species");e.exports=function(e,t){var n,a=r(e).constructor;return void 0===a||void 0==(n=r(a)[o])?t:i(n)}},function(e,t,n){var r=n(26),i=n(22);e.exports=function(e){return function(t,n){var o,a,s=String(i(t)),u=r(n),c=s.length;return u<0||u>=c?e?"":void 0:(o=s.charCodeAt(u),o<55296||o>56319||u+1===c||(a=s.charCodeAt(u+1))<56320||a>57343?e?s.charAt(u):o:e?s.slice(u,u+2):(o-55296<<10)+(a-56320)+65536)}}},function(e,t,n){var r=n(26),i=Math.max,o=Math.min;e.exports=function(e,t){return e=r(e),e<0?i(e+t,0):o(e,t)}},function(e,t,n){var r=n(22);e.exports=function(e){return Object(r(e))}},function(e,t,n){var r=n(19);e.exports=function(e,t){if(!r(e))return e;var n,i;if(t&&"function"==typeof(n=e.toString)&&!r(i=n.call(e)))return i; if("function"==typeof(n=e.valueOf)&&!r(i=n.call(e)))return i;if(!t&&"function"==typeof(n=e.toString)&&!r(i=n.call(e)))return i;throw TypeError("Can't convert object to primitive value")}},function(e,t,n){var r=n(29),i=n(6)("iterator"),o=n(15);e.exports=n(13).getIteratorMethod=function(e){if(void 0!=e)return e[i]||e["@@iterator"]||o[r(e)]}},function(e,t,n){"use strict";var r=n(86),i=n(97),o=n(15),a=n(27);e.exports=n(34)(Array,"Array",function(e,t){this._t=a(e),this._i=0,this._k=t},function(){var e=this._t,t=this._k,n=this._i++;return!e||n>=e.length?(this._t=void 0,i(1)):"keys"==t?i(0,n):"values"==t?i(0,e[n]):i(0,[n,e[n]])},"values"),o.Arguments=o.Array,r("keys"),r("values"),r("entries")},function(e,t){},function(e,t,n){"use strict";var r,i,o,a=n(35),s=n(8),u=n(17),c=n(29),l=n(31),f=n(19),h=n(21),d=n(87),p=n(89),v=n(107),g=n(38).set,_=n(98)(),y="Promise",m=s.TypeError,b=s.process,O=s[y],b=s.process,k="process"==c(b),w=function(){},C=!!function(){try{var e=O.resolve(1),t=(e.constructor={})[n(6)("species")]=function(e){e(w,w)};return(k||"function"==typeof PromiseRejectionEvent)&&e.then(w)instanceof t}catch(e){}}(),E=function(e,t){return e===t||e===O&&t===o},j=function(e){var t;return!(!f(e)||"function"!=typeof(t=e.then))&&t},x=function(e){return E(O,e)?new T(e):new i(e)},T=i=function(e){var t,n;this.promise=new e(function(e,r){if(void 0!==t||void 0!==n)throw m("Bad Promise constructor");t=e,n=r}),this.resolve=h(t),this.reject=h(n)},M=function(e){try{e()}catch(e){return{error:e}}},S=function(e,t){if(!e._n){e._n=!0;var n=e._c;_(function(){for(var r=e._v,i=1==e._s,o=0,a=function(t){var n,o,a=i?t.ok:t.fail,s=t.resolve,u=t.reject,c=t.domain;try{a?(i||(2==e._h&&D(e),e._h=1),a===!0?n=r:(c&&c.enter(),n=a(r),c&&c.exit()),n===t.promise?u(m("Promise-chain cycle")):(o=j(n))?o.call(n,s,u):s(n)):u(r)}catch(e){u(e)}};n.length>o;)a(n[o++]);e._c=[],e._n=!1,t&&!e._h&&P(e)})}},P=function(e){g.call(s,function(){var t,n,r,i=e._v;if(A(e)&&(t=M(function(){k?b.emit("unhandledRejection",i,e):(n=s.onunhandledrejection)?n({promise:e,reason:i}):(r=s.console)&&r.error&&r.error("Unhandled promise rejection",i)}),e._h=k||A(e)?2:1),e._a=void 0,t)throw t.error})},A=function(e){if(1==e._h)return!1;for(var t,n=e._a||e._c,r=0;n.length>r;)if(t=n[r++],t.fail||!A(t.promise))return!1;return!0},D=function(e){g.call(s,function(){var t;k?b.emit("rejectionHandled",e):(t=s.onrejectionhandled)&&t({promise:e,reason:e._v})})},I=function(e){var t=this;t._d||(t._d=!0,t=t._w||t,t._v=e,t._s=2,t._a||(t._a=t._c.slice()),S(t,!0))},N=function(e){var t,n=this;if(!n._d){n._d=!0,n=n._w||n;try{if(n===e)throw m("Promise can't be resolved itself");(t=j(e))?_(function(){var r={_w:n,_d:!1};try{t.call(e,u(N,r,1),u(I,r,1))}catch(e){I.call(r,e)}}):(n._v=e,n._s=1,S(n,!1))}catch(e){I.call({_w:n,_d:!1},e)}}};C||(O=function(e){d(this,O,y,"_h"),h(e),r.call(this);try{e(u(N,this,1),u(I,this,1))}catch(e){I.call(this,e)}},r=function(e){this._c=[],this._a=void 0,this._s=0,this._d=!1,this._v=void 0,this._h=0,this._n=!1},r.prototype=n(104)(O.prototype,{then:function(e,t){var n=x(v(this,O));return n.ok="function"!=typeof e||e,n.fail="function"==typeof t&&t,n.domain=k?b.domain:void 0,this._c.push(n),this._a&&this._a.push(n),this._s&&S(this,!1),n.promise},catch:function(e){return this.then(void 0,e)}}),T=function(){var e=new r;this.promise=e,this.resolve=u(N,e,1),this.reject=u(I,e,1)}),l(l.G+l.W+l.F*!C,{Promise:O}),n(24)(O,y),n(106)(y),o=n(13)[y],l(l.S+l.F*!C,y,{reject:function(e){var t=x(this),n=t.reject;return n(e),t.promise}}),l(l.S+l.F*(a||!C),y,{resolve:function(e){if(e instanceof O&&E(e.constructor,this))return e;var t=x(this),n=t.resolve;return n(e),t.promise}}),l(l.S+l.F*!(C&&n(96)(function(e){O.all(e).catch(w)})),y,{all:function(e){var t=this,n=x(t),r=n.resolve,i=n.reject,o=M(function(){var n=[],o=0,a=1;p(e,!1,function(e){var s=o++,u=!1;n.push(void 0),a++,t.resolve(e).then(function(e){u||(u=!0,n[s]=e,--a||r(n))},i)}),--a||r(n)});return o&&i(o.error),n.promise},race:function(e){var t=this,n=x(t),r=n.reject,i=M(function(){p(e,!1,function(e){t.resolve(e).then(n.resolve,r)})});return i&&r(i.error),n.promise}})},function(e,t,n){"use strict";var r=n(108)(!0);n(34)(String,"String",function(e){this._t=String(e),this._i=0},function(){var e,t=this._t,n=this._i;return n>=t.length?{value:void 0,done:!0}:(e=r(t,n),this._i+=e.length,{value:e,done:!1})})},function(e,t,n){n(113);for(var r=n(8),i=n(11),o=n(15),a=n(6)("toStringTag"),s=["NodeList","DOMTokenList","MediaList","StyleSheetList","CSSRuleList"],u=0;u<5;u++){var c=s[u],l=r[c],f=l&&l.prototype;f&&!f[a]&&i(f,a,c),o[c]=o.Array}}])}); \ No newline at end of file diff --git a/package.json b/package.json index 9cb6ee431..b2d4a9a4e 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "tui-image-editor", "author": "NHNEnt FE Development Lab ", - "version": "3.0.1", + "version": "3.0.2", "license": "MIT", "repository": "https://github.com/nhnent/tui.image-editor", "main": "dist/tui-image-editor.js", From d899f788696ad8810c7a50c55dee7b7f5027c016 Mon Sep 17 00:00:00 2001 From: "kyuwoo.choi" Date: Fri, 13 Apr 2018 23:31:46 +0900 Subject: [PATCH 04/10] chore: build dist for 3.1.0 --- dist/tui-image-editor.js | 38 ++++++++++++++++++++++++++++++++++-- dist/tui-image-editor.min.js | 10 +++++----- 2 files changed, 41 insertions(+), 7 deletions(-) diff --git a/dist/tui-image-editor.js b/dist/tui-image-editor.js index bbeb14bb4..fd19b23c2 100644 --- a/dist/tui-image-editor.js +++ b/dist/tui-image-editor.js @@ -1,6 +1,6 @@ /*! * tui-image-editor.js - * @version 3.0.2 + * @version 3.1.0 * @author NHNEnt FE Development Lab * @license MIT */ @@ -142,6 +142,8 @@ return /******/ (function(modules) { // webpackBootstrap var _consts2 = _interopRequireDefault(_consts); + var _util = __webpack_require__(71); + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } @@ -161,13 +163,16 @@ return /******/ (function(modules) { // webpackBootstrap * @param {Object} [option] - Canvas max width & height of css * @param {number} option.cssMaxWidth - Canvas css-max-width * @param {number} option.cssMaxHeight - Canvas css-max-height + * @param {Boolean} [option.usageStatistics=true] - Let us know the hostname. If you don't want to send the hostname, please set to false. */ var ImageEditor = function () { function ImageEditor(wrapper, option) { _classCallCheck(this, ImageEditor); - option = option || {}; + option = _tuiCodeSnippet2.default.extend({ + usageStatistics: true + }, option); /** * Invoker @@ -208,6 +213,10 @@ return /******/ (function(modules) { // webpackBootstrap if (option.selectionStyle) { this._setSelectionStyle(option.selectionStyle); } + + if (option.usageStatistics) { + (0, _util.sendHostName)(); + } } /** @@ -3666,6 +3675,8 @@ return /******/ (function(modules) { // webpackBootstrap * @fileoverview Util */ + var hostnameSent = false; + module.exports = { /** * Clamp value @@ -3740,6 +3751,29 @@ return /******/ (function(modules) { // webpackBootstrap } return props; + }, + + + /** + * send hostname + */ + sendHostName: function sendHostName() { + var _location = location, + hostname = _location.hostname; + + if (hostnameSent) { + return; + } + hostnameSent = true; + + (0, _tuiCodeSnippet.imagePing)('https://www.google-analytics.com/collect', { + v: 1, + t: 'event', + tid: 'UA-115377265-9', + cid: hostname, + dp: hostname, + dh: 'image-editor' + }); } }; diff --git a/dist/tui-image-editor.min.js b/dist/tui-image-editor.min.js index af37acfee..9f31b394a 100644 --- a/dist/tui-image-editor.min.js +++ b/dist/tui-image-editor.min.js @@ -1,10 +1,10 @@ /*! * tui-image-editor.min.js - * @version 3.0.2 + * @version 3.1.0 * @author NHNEnt FE Development Lab * @license MIT */ -!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("fabric/dist/fabric.require"),require("tui-code-snippet")):"function"==typeof define&&define.amd?define(["fabric/dist/fabric.require","tui-code-snippet"],t):"object"==typeof exports?exports.ImageEditor=t(require("fabric/dist/fabric.require"),require("tui-code-snippet")):(e.tui=e.tui||{},e.tui.ImageEditor=t(e.fabric,e.tui&&e.tui.util))}(this,function(e,t){return function(e){function t(r){if(n[r])return n[r].exports;var i=n[r]={exports:{},id:r,loaded:!1};return e[r].call(i.exports,i,i.exports,t),i.loaded=!0,i.exports}var n={};return t.m=e,t.c=n,t.p="dist",t(0)}([function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(83),o=r(i);n(41),n(42),n(43),n(44),n(45),n(46),n(47),n(48),n(49),n(50),n(51),n(52),n(53),n(54),n(55),n(56),n(57),n(59),n(58),e.exports=o.default},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(9),o=r(i);e.exports={componentNames:o.default.keyMirror("IMAGE_LOADER","CROPPER","FLIP","ROTATION","FREE_DRAWING","LINE","TEXT","ICON","FILTER","SHAPE"),commandNames:{CLEAR_OBJECTS:"clearObjects",LOAD_IMAGE:"loadImage",FLIP_IMAGE:"flip",ROTATE_IMAGE:"rotate",ADD_OBJECT:"addObject",REMOVE_OBJECT:"removeObject",APPLY_FILTER:"applyFilter",REMOVE_FILTER:"removeFilter",ADD_ICON:"addIcon",CHANGE_ICON_COLOR:"changeIconColor",ADD_SHAPE:"addShape",CHANGE_SHAPE:"changeShape",ADD_TEXT:"addText",CHANGE_TEXT:"changeText",CHANGE_TEXT_STYLE:"changeTextStyle",ADD_IMAGE_OBJECT:"addImageObject",RESIZE_CANVAS_DIMENSION:"resizeCanvasDimension",SET_OBJECT_PROPERTIES:"setObjectProperties",SET_OBJECT_POSITION:"setObjectPosition"},eventNames:{OBJECT_ACTIVATED:"objectActivated",OBJECT_MOVED:"objectMoved",OBJECT_SCALED:"objectScaled",TEXT_EDITING:"textEditing",TEXT_CHANGED:"textChanged",ADD_TEXT:"addText",ADD_OBJECT:"addObject",MOUSE_DOWN:"mousedown",REDO_STACK_CHANGED:"redoStackChanged",UNDO_STACK_CHANGED:"undoStackChanged"},drawingModes:o.default.keyMirror("NORMAL","CROPPER","FREE_DRAWING","LINE_DRAWING","TEXT","SHAPE"),keyCodes:{Z:90,Y:89,SHIFT:16,BACKSPACE:8,DEL:46},fObjectOptions:{SELECTION_STYLE:{borderColor:"red",cornerColor:"green",cornerSize:10,originX:"center",originY:"center",transparentCorners:!1}},rejectMessages:{flip:"The flipX and flipY setting values are not changed.",rotation:"The current angle is same the old angle.",loadImage:"The background image is empty.",isLock:"The executing command state is locked.",undo:"The promise of undo command is reject.",redo:"The promise of redo command is reject.",invalidDrawingMode:"This operation is not supported in the drawing mode",invalidParameters:"Invalid parameters",noActiveObject:"There is no active object.",unsupportedType:"Unsupported object type",noObject:"The object is not in canvas.",addedObject:"The object is already added."}}},function(e,t,n){n(114),n(116),n(117),n(115),e.exports=n(13).Promise},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e){var t=u[e];if(t){for(var n=arguments.length,r=Array(n>1?n-1:0),i=1;in&&(r=t,t=n,n=r),o(t,i(e,n))},keyMirror:function(){for(var e={},t=arguments.length,n=Array(t),i=0;i0?r:n)(e)}},function(e,t,n){var r=n(92),i=n(22);e.exports=function(e){return r(i(e))}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(9),s=(0,a.keyMirror)("UN_IMPLEMENTATION","NO_COMPONENT_NAME"),u={UN_IMPLEMENTATION:"Should implement a method: ",NO_COMPONENT_NAME:"Should set a component name"},c={UN_IMPLEMENTATION:function(e){return u.UN_IMPLEMENTATION+e},NO_COMPONENT_NAME:function(){return u.NO_COMPONENT_NAME}};e.exports={types:o.default.extend({},s),create:function(e){e=e.toLowerCase();for(var t=c[e],n=arguments.length,r=Array(n>1?n-1:0),i=1;in;)t.push(arguments[n++]);return g[++v]=function(){s("function"==typeof e?e:Function(e),t)},r(v),v},d=function(e){delete g[e]},"process"==n(16)(f)?r=function(e){f.nextTick(a(y,e,1))}:p?(i=new p,o=i.port2,i.port1.onmessage=m,r=a(o.postMessage,o,1)):l.addEventListener&&"function"==typeof postMessage&&!l.importScripts?(r=function(e){l.postMessage(e+"","*")},l.addEventListener("message",m,!1)):r=_ in c("script")?function(e){u.appendChild(c("script"))[_]=function(){u.removeChild(this),y.call(e)}}:function(e){setTimeout(a(y,e,1),0)}),e.exports={set:h,clear:d}},function(e,t,n){var r=n(26),i=Math.min;e.exports=function(e){return e>0?i(r(e),9007199254740991):0}},function(e,t){var n=0,r=Math.random();e.exports=function(e){return"Symbol(".concat(void 0===e?"":e,")_",(++n+r).toString(36))}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.commandNames,h=l.ICON,d={name:f.ADD_ICON,execute:function(e,t,n){var r=this,i=e.getComponent(h);return i.add(t,n).then(function(t){return r.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(d),e.exports=d},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f={name:l.ADD_IMAGE_OBJECT,execute:function(e,t){var n=this;return e.addImageObject(t).then(function(t){return n.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f=c.default.rejectMessages,h={name:l.ADD_OBJECT,execute:function(e,t){return new s.default(function(n,r){e.contains(t)?r(f.addedObject):(e.add(t),n(t))})},undo:function(e,t){return new s.default(function(n,r){e.contains(t)?(e.remove(t),n(t)):r(f.noObject)})}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.commandNames,h=l.SHAPE,d={name:f.ADD_SHAPE,execute:function(e,t,n){var r=this,i=e.getComponent(h);return i.add(t,n).then(function(t){return r.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(d),e.exports=d},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.commandNames,h=l.TEXT,d={name:f.ADD_TEXT,execute:function(e,t,n){var r=this,i=e.getComponent(h);return i.add(t,n).then(function(t){return r.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(d),e.exports=d},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.rejectMessages,l=s.default.commandNames,f=u.FILTER,h={name:l.APPLY_FILTER,execute:function(e,t,n){var r=e.getComponent(f);if("mask"===t){var i=e.getObject(n.maskObjId);if(!i||!i.isType("image"))return Promise.reject(c.invalidParameters);n={mask:i}}return"mask"===t?(this.undoData.object=n.mask,e.remove(n.mask)):this.undoData.options=r.getOptions(t),r.add(t,n)},undo:function(e,t){var n=e.getComponent(f);if("mask"===t){var r=this.undoData.object;return e.add(r),e.setActiveObject(r),n.remove(t)}return this.undoData.options?n.add(t,this.undoData.options):n.remove(t)}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.rejectMessages,h=c.default.commandNames,d=l.ICON,p={name:h.CHANGE_ICON_COLOR,execute:function(e,t,n){var r=this;return new s.default(function(i,o){var a=e.getComponent(d),s=e.getObject(t);s||o(f.noObject),r.undoData.object=s,r.undoData.color=a.getColor(s),a.setColor(n,s),i()})},undo:function(e){var t=e.getComponent(d),n=this.undoData.object,r=n.object,i=n.color;return t.setColor(i,r),s.default.resolve()}};o.default.register(p),e.exports=p},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(3),s=r(a),u=n(2),c=r(u),l=n(1),f=r(l),h=f.default.componentNames,d=f.default.rejectMessages,p=f.default.commandNames,v=h.SHAPE,g={name:p.CHANGE_SHAPE,execute:function(e,t,n){var r=this,i=e.getComponent(v),a=e.getObject(t);return a?(this.undoData.object=a,this.undoData.options={},o.default.forEachOwnProperties(n,function(e,t){r.undoData.options[t]=a[t]}),i.change(a,n)):c.default.reject(d.noObject)},undo:function(e){var t=e.getComponent(v),n=this.undoData,r=n.object,i=n.options;return t.change(r,i)}};s.default.register(g),e.exports=g},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.rejectMessages,h=c.default.commandNames,d=l.TEXT,p={name:h.CHANGE_TEXT,execute:function(e,t,n){var r=e.getComponent(d),i=e.getObject(t);return i?(this.undoData.object=i,this.undoData.text=r.getText(i),r.change(i,n)):s.default.reject(f.noObject)},undo:function(e){var t=e.getComponent(d),n=this.undoData,r=n.object,i=n.text;return t.change(r,i)}};o.default.register(p),e.exports=p},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(3),s=r(a),u=n(2),c=r(u),l=n(1),f=r(l),h=f.default.componentNames,d=f.default.rejectMessages,p=f.default.commandNames,v=h.TEXT,g={name:p.CHANGE_TEXT_STYLE,execute:function(e,t,n){var r=this,i=e.getComponent(v),a=e.getObject(t);return a?(this.undoData.object=a,this.undoData.styles={},o.default.forEachOwnProperties(n,function(e,t){r.undoData.styles[t]=a[t]}),i.setStyle(a,n)):c.default.reject(d.noObject)},undo:function(e){var t=e.getComponent(v),n=this.undoData,r=n.object,i=n.styles;return t.setStyle(r,i)}};s.default.register(g),e.exports=g},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f={name:l.CLEAR_OBJECTS,execute:function(e){var t=this;return new s.default(function(n){t.undoData.objects=e.removeAll(),n()})},undo:function(e){return e.add(this.undoData.objects),s.default.resolve()}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.FLIP,f={name:c.FLIP_IMAGE,execute:function(e,t){var n=e.getComponent(l);return this.undoData.setting=n.getCurrentSetting(),n[t]()},undo:function(e){var t=e.getComponent(l);return t.set(this.undoData.setting)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.IMAGE_LOADER,f={name:c.LOAD_IMAGE,execute:function(e,t,n){var r=e.getComponent(l),i=r.getCanvasImage(),o=i?i.width:0,a=i?i.height:0;return this.undoData={name:r.getImageName(),image:i,objects:e.removeAll(!0)},r.load(t,n).then(function(e){return{oldWidth:o,oldHeight:a,newWidth:e.width,newHeight:e.height}})},undo:function(e){var t=e.getComponent(l),n=this.undoData,r=n.objects,i=n.name,o=n.image;return e.removeAll(!0),e.add(r),t.load(i,o)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.FILTER,f={name:c.REMOVE_FILTER,execute:function(e,t){var n=e.getComponent(l);return this.undoData.options=n.getOptions(t),n.remove(t)},undo:function(e,t){var n=e.getComponent(l),r=this.undoData.options;return n.add(t,r)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f=c.default.rejectMessages,h={name:l.REMOVE_OBJECT,execute:function(e,t){var n=this;return new s.default(function(r,i){n.undoData.objects=e.removeObjectById(t),n.undoData.objects.length?r():i(f.noObject)})},undo:function(e){return e.add(this.undoData.objects),s.default.resolve()}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f={name:l.RESIZE_CANVAS_DIMENSION,execute:function(e,t){var n=this;return new s.default(function(r){n.undoData.size={width:e.cssMaxWidth,height:e.cssMaxHeight},e.setCssMaxDimension(t),e.adjustCanvasDimension(),r()})},undo:function(e){return e.setCssMaxDimension(this.undoData.size),e.adjustCanvasDimension(),s.default.resolve()}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.ROTATION,f={name:c.ROTATE_IMAGE,execute:function(e,t,n){var r=e.getComponent(l);return this.undoData.angle=r.getCurrentAngle(),r[t](n)},undo:function(e){var t=e.getComponent(l),n=this.undoData.angle;return t.setAngle(n)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f=c.default.rejectMessages,h={name:l.SET_OBJECT_POSITION,execute:function(e,t,n){var r=e.getObject(t);return r?(this.undoData.objectId=t,this.undoData.props=e.getObjectProperties(t,["left","top"]),e.setObjectPosition(t,n),e.renderAll(),s.default.resolve()):s.default.reject(f.noObject)},undo:function(e){var t=this.undoData,n=t.objectId,r=t.props;return e.setObjectProperties(n,r),e.renderAll(),s.default.resolve()}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(3),s=r(a),u=n(2),c=r(u),l=n(1),f=r(l),h=f.default.commandNames,d=f.default.rejectMessages,p={name:h.SET_OBJECT_PROPERTIES,execute:function(e,t,n){var r=this,i=e.getObject(t);return i?(this.undoData.props={},o.default.forEachOwnProperties(n,function(e,t){r.undoData.props[t]=i[t]}),e.setObjectProperties(t,n),c.default.resolve()):c.default.reject(d.noObject)},undo:function(e,t){var n=this.undoData.props;return e.setObjectProperties(t,n),c.default.resolve()}};s.default.register(p),e.exports=p},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;ng&&(o.remove(),o.set(this._calcRectDimensionFromPoint(r,i)),t.add(o))}},{key:"_calcRectDimensionFromPoint",value:function(e,t){var n=this.getCanvas(),r=n.getWidth(),i=n.getHeight(),o=this._startX,a=this._startY,s=(0,v.clamp)(e,0,o),u=(0,v.clamp)(t,0,a),c=(0,v.clamp)(e,o,r)-s,l=(0,v.clamp)(t,a,i)-u;return this._withShiftKey&&(c>l?l=c:l>c&&(c=l),o>=e&&(s=o-c),a>=t&&(u=a-l)),{left:s,top:u,width:c,height:l}}},{key:"_onFabricMouseUp",value:function(){var e=this._cropzone,t=this._listeners,n=this.getCanvas();n.setActiveObject(e),n.off({"mouse:move":t.mousemove,"mouse:up":t.mouseup})}},{key:"getCroppedImageData",value:function(e){var t=this.getCanvas(),n=t.contains(this._cropzone);if(!e)return null;n&&this._cropzone.remove();var r={imageName:this.getImageName(),url:t.toDataURL(e)};return n&&t.add(this._cropzone),r}},{key:"getCropzoneRect",value:function(){var e=this._cropzone;return e.isValid()?{left:e.getLeft(),top:e.getTop(),width:e.getWidth(),height:e.getHeight()}:null}},{key:"_onKeyDown",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!0)}},{key:"_onKeyUp",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!1)}}]),t}(f.default);e.exports=_},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;nn},_getColor:function(e,t,n){var r=[0,0,0,0],i=e.data,o=e.width,a=4,s=(o*n+t)*a;return r[0]=i[s],r[1]=i[s+1],r[2]=i[s+2],r[3]=i[s+3],r}});e.exports=a},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(4),s=r(a),u=n(9),c="tl",l="tr",f="mt",h="ml",d="mr",p="mb",v="bl",g="br",_=s.default.util.createClass(s.default.Rect,{initialize:function(e){e.type="cropzone",this.callSuper("initialize",e),this.on({moving:this._onMoving,scaling:this._onScaling})},_render:function(e){var t=7,n=7;this.callSuper("_render",e);var r=this.flipX?-1:1,i=this.flipY?-1:1,o=r/this.scaleX,a=i/this.scaleY;e.scale(o,a),this._fillOuterRect(e,"rgba(0, 0, 0, 0.55)"),this._strokeBorder(e,"rgb(0, 0, 0)",t),this._strokeBorder(e,"rgb(255, 255, 255)",t,n),e.scale(1/o,1/a)},_fillOuterRect:function(e,t){var n=this._getCoordinates(e),r=n.x,i=n.y;e.save(),e.fillStyle=t,e.beginPath(),e.moveTo(r[0]-1,i[0]-1),e.lineTo(r[3]+1,i[0]-1),e.lineTo(r[3]+1,i[3]+1),e.lineTo(r[0]-1,i[3]-1),e.lineTo(r[0]-1,i[0]-1),e.closePath(),e.moveTo(r[1],i[1]),e.lineTo(r[1],i[2]),e.lineTo(r[2],i[2]),e.lineTo(r[2],i[1]),e.lineTo(r[1],i[1]),e.closePath(),e.fill(),e.restore()},_getCoordinates:function(e){var t=this.getWidth(),n=this.getHeight(),r=t/2,i=n/2,a=this.getLeft(),s=this.getTop(),u=e.canvas;return{x:o.default.map([-(r+a),-r,r,r+(u.width-a-t)],Math.ceil),y:o.default.map([-(i+s),-i,i,i+(u.height-s-n)],Math.ceil)}},_strokeBorder:function(e,t,n,r){var i=this.getWidth()/2,o=this.getHeight()/2;e.save(),e.strokeStyle=t,e.setLineDash&&e.setLineDash([n,n]),r&&(e.lineDashOffset=r),e.beginPath(),e.moveTo(-i,-o),e.lineTo(i,-o),e.lineTo(i,o),e.lineTo(-i,o),e.lineTo(-i,-o),e.stroke(),e.restore()},_onMoving:function(){var e=this.getLeft(),t=this.getTop(),n=this.getWidth(),r=this.getHeight(),i=this.canvas.getWidth()-n,o=this.canvas.getHeight()-r; -this.setLeft((0,u.clamp)(e,0,i)),this.setTop((0,u.clamp)(t,0,o))},_onScaling:function(e){var t=this.canvas.getPointer(e.e),n=this._calcScalingSizeFromPointer(t);this.scale(1).set(n)},_calcScalingSizeFromPointer:function(e){var t=e.x,n=e.y,r=this._calcTopLeftScalingSizeFromPointer(t,n),i=this._calcBottomRightScalingSizeFromPointer(t,n);return this._makeScalingSettings(r,i)},_calcTopLeftScalingSizeFromPointer:function(e,t){var n=this.getHeight()+this.top,r=this.getWidth()+this.left,i=(0,u.clamp)(t,0,n-1),o=(0,u.clamp)(e,0,r-1);return{top:i,left:o,width:r-o,height:n-i}},_calcBottomRightScalingSizeFromPointer:function(e,t){var n=this.canvas,r=n.width,i=n.height,o=this.left,a=this.top;return{width:(0,u.clamp)(e,o+1,r)-o,height:(0,u.clamp)(t,a+1,i)-a}},_makeScalingSettings:function(e,t){var n=e.width,r=e.height,i=t.height,o=t.width,a=e.left,s=e.top,u=void 0;switch(this.__corner){case c:u=e;break;case l:u={width:o,height:r,top:s};break;case v:u={width:n,height:i,left:a};break;case g:u=t;break;case h:u={width:n,left:a};break;case f:u={height:r,top:s};break;case d:u={width:o};break;case p:u={height:i}}return u},isValid:function(){return this.left>=0&&this.top>=0&&this.width>0&&this.height>0}});e.exports=_},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(4),o=r(i),a=o.default.util.createClass(o.default.Image.filters.Convolute,{type:"Emboss",initialize:function(){var e=[1,1,1,1,.7,-1,-1,-1,-1];this.matrix=e}});e.exports=a},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(4),o=r(i),a=o.default.util.createClass(o.default.Image.filters.Mask,{applyTo:function(e){if(this.mask){var t=e.width,n=e.height,r=this._createCanvasOfMask(t,n),i=e.getContext("2d"),o=r.getContext("2d"),a=i.getImageData(0,0,t,n);this._drawMask(o,e,i),this._mapData(o,a,t,n),i.putImageData(a,0,0)}},_createCanvasOfMask:function(e,t){var n=o.default.util.createCanvasElement();return n.width=e,n.height=t,n},_drawMask:function(e){var t=this.mask,n=t.getElement(),r=t.getLeft(),i=t.getTop(),o=t.getAngle();e.save(),e.translate(r,i),e.rotate(o*Math.PI/180),e.scale(t.scaleX,t.scaleY),e.drawImage(n,-n.width/2,-n.height/2),e.restore()},_mapData:function(e,t,n,r){for(var i=t.data,o=e.getImageData(0,0,n,r).data,a=this.channel,s=t.width*t.height*4,u=0;uu?"right":"left",originY:i>c?"bottom":"top"}}function i(e){return"center"===e.getOriginX()&&"center"===e.getOriginY()}function o(e,t){var n=t.getPointByOrigin("center","center"),i=-t.getAngle(),o=r(n,e,i),a=o.originX,s=o.originY,u=t.getPointByOrigin(a,s),c=t.getLeft()-(n.x-u.x),l=t.getTop()-(n.x-u.y);t.set({originX:a,originY:s,left:c,top:l}),t.setCoords()}function a(e,t){var n=t.startPoint,i=-t.getAngle(),o=r(n,e,i),a=o.originX,s=o.originY;t.setPositionByOrigin(n,a,s)}function s(e){var t=e.type,n=e.scaleX,r=e.scaleY,i=l[t],o=e[i.w]*n,a=e[i.h]*r;if(e.isRegular){var s=Math.max(n,r);o=e[i.w]*s,a=e[i.h]*s}var u={hasControls:!1,hasBorders:!1,scaleX:1,scaleY:1};u[i.w]=o,u[i.h]=a,e.set(u)}function u(e,t){var n=t.type,r=t.strokeWidth,i=t.startPoint,o=c[n],a=l[n],s=!("triangle"!==t.type),u={},f=Math.abs(i.x-e.x)/o,h=Math.abs(i.y-e.y)/o;f>r&&(f-=r/o),h>r&&(h-=r/o),t.isRegular&&(f=h=Math.max(f,h),s&&(h=Math.sqrt(3)/2*f)),u[a.w]=f,u[a.h]=h,t.set(u)}var c={rect:1,circle:2,triangle:1},l={rect:{w:"width",h:"height"},circle:{w:"rx",h:"ry"},triangle:{w:"width",h:"height"}};e.exports={setOrigins:function(e){var t=e.getPointByOrigin("left","top"),n=e.getPointByOrigin("right","top"),r=e.getPointByOrigin("right","bottom"),i=e.getPointByOrigin("left","bottom");e.origins={lt:t,rt:n,rb:r,lb:i}},resize:function(e,t,r){i(e)&&(o(t,e),n(e)),r?s(e,t):u(t,e),a(t,e)},adjustOriginToCenter:function(e){var t=e.getPointByOrigin("center","center"),n=e.getOriginX(),r=e.getOriginY(),i=e.getPointByOrigin(n,r),o=e.getLeft()+(t.x-i.x),a=e.getTop()+(t.y-i.y);e.set({hasControls:!0,hasBorders:!0,originX:"center",originY:"center",left:o,top:a}),e.setCoords()}}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var o=function(){function e(e,t){for(var n=0;n1?n-1:0),i=1;il;)if(s=u[l++],s!=s)return!0}else for(;c>l;l++)if((e||l in u)&&u[l]===n)return e||l||0;return!e&&-1}}},function(e,t,n){var r=n(17),i=n(94),o=n(93),a=n(10),s=n(39),u=n(112),c={},l={},t=e.exports=function(e,t,n,f,h){var d,p,v,g,_=h?function(){return e}:u(e),y=r(n,f,t?2:1),m=0;if("function"!=typeof _)throw TypeError(e+" is not iterable!");if(o(_)){for(d=s(e.length);d>m;m++)if(g=t?y(a(p=e[m])[0],p[1]):y(e[m]),g===c||g===l)return g}else for(v=_.call(e);!(p=v.next()).done;)if(g=i(v,y,p.value,t),g===c||g===l)return g};t.BREAK=c,t.RETURN=l},function(e,t,n){e.exports=!n(14)&&!n(32)(function(){return 7!=Object.defineProperty(n(23)("div"),"a",{get:function(){return 7}}).a})},function(e,t){e.exports=function(e,t,n){var r=void 0===n;switch(t.length){case 0:return r?e():e.call(n);case 1:return r?e(t[0]):e.call(n,t[0]);case 2:return r?e(t[0],t[1]):e.call(n,t[0],t[1]);case 3:return r?e(t[0],t[1],t[2]):e.call(n,t[0],t[1],t[2]);case 4:return r?e(t[0],t[1],t[2],t[3]):e.call(n,t[0],t[1],t[2],t[3])}return e.apply(n,t)}},function(e,t,n){var r=n(16);e.exports=Object("z").propertyIsEnumerable(0)?Object:function(e){return"String"==r(e)?e.split(""):Object(e)}},function(e,t,n){var r=n(15),i=n(6)("iterator"),o=Array.prototype;e.exports=function(e){return void 0!==e&&(r.Array===e||o[i]===e)}},function(e,t,n){var r=n(10);e.exports=function(e,t,n,i){try{return i?t(r(n)[0],n[1]):t(n)}catch(t){var o=e.return;throw void 0!==o&&r(o.call(e)),t}}},function(e,t,n){"use strict";var r=n(99),i=n(36),o=n(24),a={};n(11)(a,n(6)("iterator"),function(){return this}),e.exports=function(e,t,n){e.prototype=r(a,{next:i(1,n)}),o(e,t+" Iterator")}},function(e,t,n){var r=n(6)("iterator"),i=!1;try{var o=[7][r]();o.return=function(){i=!0},Array.from(o,function(){throw 2})}catch(e){}e.exports=function(e,t){if(!t&&!i)return!1;var n=!1;try{var o=[7],a=o[r]();a.next=function(){return{done:n=!0}},o[r]=function(){return a},e(o)}catch(e){}return n}},function(e,t){e.exports=function(e,t){return{value:t,done:!!e}}},function(e,t,n){var r=n(8),i=n(38).set,o=r.MutationObserver||r.WebKitMutationObserver,a=r.process,s=r.Promise,u="process"==n(16)(a);e.exports=function(){var e,t,n,c=function(){var r,i;for(u&&(r=a.domain)&&r.exit();e;){i=e.fn,e=e.next;try{i()}catch(r){throw e?n():t=void 0,r}}t=void 0,r&&r.enter()};if(u)n=function(){a.nextTick(c)};else if(o){var l=!0,f=document.createTextNode("");new o(c).observe(f,{characterData:!0}),n=function(){f.data=l=!l}}else if(s&&s.resolve){var h=s.resolve();n=function(){h.then(c)}}else n=function(){i.call(r,c)};return function(r){var i={fn:r,next:void 0};t&&(t.next=i),e||(e=i,n()),t=i}}},function(e,t,n){var r=n(10),i=n(100),o=n(30),a=n(25)("IE_PROTO"),s=function(){},u="prototype",c=function(){var e,t=n(23)("iframe"),r=o.length,i="<",a=">";for(t.style.display="none",n(33).appendChild(t),t.src="javascript:",e=t.contentWindow.document,e.open(),e.write(i+"script"+a+"document.F=Object"+i+"/script"+a),e.close(),c=e.F;r--;)delete c[u][o[r]];return c()};e.exports=Object.create||function(e,t){var n;return null!==e?(s[u]=r(e),n=new s,s[u]=null,n[a]=e):n=c(),void 0===t?n:i(n,t)}},function(e,t,n){var r=n(20),i=n(10),o=n(103);e.exports=n(14)?Object.defineProperties:function(e,t){i(e);for(var n,a=o(t),s=a.length,u=0;s>u;)r.f(e,n=a[u++],t[n]);return e}},function(e,t,n){var r=n(18),i=n(110),o=n(25)("IE_PROTO"),a=Object.prototype;e.exports=Object.getPrototypeOf||function(e){return e=i(e),r(e,o)?e[o]:"function"==typeof e.constructor&&e instanceof e.constructor?e.constructor.prototype:e instanceof Object?a:null}},function(e,t,n){var r=n(18),i=n(27),o=n(88)(!1),a=n(25)("IE_PROTO");e.exports=function(e,t){var n,s=i(e),u=0,c=[];for(n in s)n!=a&&r(s,n)&&c.push(n);for(;t.length>u;)r(s,n=t[u++])&&(~o(c,n)||c.push(n));return c}},function(e,t,n){var r=n(102),i=n(30);e.exports=Object.keys||function(e){return r(e,i)}},function(e,t,n){var r=n(11);e.exports=function(e,t,n){for(var i in t)n&&e[i]?e[i]=t[i]:r(e,i,t[i]);return e}},function(e,t,n){e.exports=n(11)},function(e,t,n){"use strict";var r=n(8),i=n(13),o=n(20),a=n(14),s=n(6)("species");e.exports=function(e){var t="function"==typeof i[e]?i[e]:r[e];a&&t&&!t[s]&&o.f(t,s,{configurable:!0,get:function(){return this}})}},function(e,t,n){var r=n(10),i=n(21),o=n(6)("species");e.exports=function(e,t){var n,a=r(e).constructor;return void 0===a||void 0==(n=r(a)[o])?t:i(n)}},function(e,t,n){var r=n(26),i=n(22);e.exports=function(e){return function(t,n){var o,a,s=String(i(t)),u=r(n),c=s.length;return u<0||u>=c?e?"":void 0:(o=s.charCodeAt(u),o<55296||o>56319||u+1===c||(a=s.charCodeAt(u+1))<56320||a>57343?e?s.charAt(u):o:e?s.slice(u,u+2):(o-55296<<10)+(a-56320)+65536)}}},function(e,t,n){var r=n(26),i=Math.max,o=Math.min;e.exports=function(e,t){return e=r(e),e<0?i(e+t,0):o(e,t)}},function(e,t,n){var r=n(22);e.exports=function(e){return Object(r(e))}},function(e,t,n){var r=n(19);e.exports=function(e,t){if(!r(e))return e;var n,i;if(t&&"function"==typeof(n=e.toString)&&!r(i=n.call(e)))return i; -if("function"==typeof(n=e.valueOf)&&!r(i=n.call(e)))return i;if(!t&&"function"==typeof(n=e.toString)&&!r(i=n.call(e)))return i;throw TypeError("Can't convert object to primitive value")}},function(e,t,n){var r=n(29),i=n(6)("iterator"),o=n(15);e.exports=n(13).getIteratorMethod=function(e){if(void 0!=e)return e[i]||e["@@iterator"]||o[r(e)]}},function(e,t,n){"use strict";var r=n(86),i=n(97),o=n(15),a=n(27);e.exports=n(34)(Array,"Array",function(e,t){this._t=a(e),this._i=0,this._k=t},function(){var e=this._t,t=this._k,n=this._i++;return!e||n>=e.length?(this._t=void 0,i(1)):"keys"==t?i(0,n):"values"==t?i(0,e[n]):i(0,[n,e[n]])},"values"),o.Arguments=o.Array,r("keys"),r("values"),r("entries")},function(e,t){},function(e,t,n){"use strict";var r,i,o,a=n(35),s=n(8),u=n(17),c=n(29),l=n(31),f=n(19),h=n(21),d=n(87),p=n(89),v=n(107),g=n(38).set,_=n(98)(),y="Promise",m=s.TypeError,b=s.process,O=s[y],b=s.process,k="process"==c(b),w=function(){},C=!!function(){try{var e=O.resolve(1),t=(e.constructor={})[n(6)("species")]=function(e){e(w,w)};return(k||"function"==typeof PromiseRejectionEvent)&&e.then(w)instanceof t}catch(e){}}(),E=function(e,t){return e===t||e===O&&t===o},j=function(e){var t;return!(!f(e)||"function"!=typeof(t=e.then))&&t},x=function(e){return E(O,e)?new T(e):new i(e)},T=i=function(e){var t,n;this.promise=new e(function(e,r){if(void 0!==t||void 0!==n)throw m("Bad Promise constructor");t=e,n=r}),this.resolve=h(t),this.reject=h(n)},M=function(e){try{e()}catch(e){return{error:e}}},S=function(e,t){if(!e._n){e._n=!0;var n=e._c;_(function(){for(var r=e._v,i=1==e._s,o=0,a=function(t){var n,o,a=i?t.ok:t.fail,s=t.resolve,u=t.reject,c=t.domain;try{a?(i||(2==e._h&&D(e),e._h=1),a===!0?n=r:(c&&c.enter(),n=a(r),c&&c.exit()),n===t.promise?u(m("Promise-chain cycle")):(o=j(n))?o.call(n,s,u):s(n)):u(r)}catch(e){u(e)}};n.length>o;)a(n[o++]);e._c=[],e._n=!1,t&&!e._h&&P(e)})}},P=function(e){g.call(s,function(){var t,n,r,i=e._v;if(A(e)&&(t=M(function(){k?b.emit("unhandledRejection",i,e):(n=s.onunhandledrejection)?n({promise:e,reason:i}):(r=s.console)&&r.error&&r.error("Unhandled promise rejection",i)}),e._h=k||A(e)?2:1),e._a=void 0,t)throw t.error})},A=function(e){if(1==e._h)return!1;for(var t,n=e._a||e._c,r=0;n.length>r;)if(t=n[r++],t.fail||!A(t.promise))return!1;return!0},D=function(e){g.call(s,function(){var t;k?b.emit("rejectionHandled",e):(t=s.onrejectionhandled)&&t({promise:e,reason:e._v})})},I=function(e){var t=this;t._d||(t._d=!0,t=t._w||t,t._v=e,t._s=2,t._a||(t._a=t._c.slice()),S(t,!0))},N=function(e){var t,n=this;if(!n._d){n._d=!0,n=n._w||n;try{if(n===e)throw m("Promise can't be resolved itself");(t=j(e))?_(function(){var r={_w:n,_d:!1};try{t.call(e,u(N,r,1),u(I,r,1))}catch(e){I.call(r,e)}}):(n._v=e,n._s=1,S(n,!1))}catch(e){I.call({_w:n,_d:!1},e)}}};C||(O=function(e){d(this,O,y,"_h"),h(e),r.call(this);try{e(u(N,this,1),u(I,this,1))}catch(e){I.call(this,e)}},r=function(e){this._c=[],this._a=void 0,this._s=0,this._d=!1,this._v=void 0,this._h=0,this._n=!1},r.prototype=n(104)(O.prototype,{then:function(e,t){var n=x(v(this,O));return n.ok="function"!=typeof e||e,n.fail="function"==typeof t&&t,n.domain=k?b.domain:void 0,this._c.push(n),this._a&&this._a.push(n),this._s&&S(this,!1),n.promise},catch:function(e){return this.then(void 0,e)}}),T=function(){var e=new r;this.promise=e,this.resolve=u(N,e,1),this.reject=u(I,e,1)}),l(l.G+l.W+l.F*!C,{Promise:O}),n(24)(O,y),n(106)(y),o=n(13)[y],l(l.S+l.F*!C,y,{reject:function(e){var t=x(this),n=t.reject;return n(e),t.promise}}),l(l.S+l.F*(a||!C),y,{resolve:function(e){if(e instanceof O&&E(e.constructor,this))return e;var t=x(this),n=t.resolve;return n(e),t.promise}}),l(l.S+l.F*!(C&&n(96)(function(e){O.all(e).catch(w)})),y,{all:function(e){var t=this,n=x(t),r=n.resolve,i=n.reject,o=M(function(){var n=[],o=0,a=1;p(e,!1,function(e){var s=o++,u=!1;n.push(void 0),a++,t.resolve(e).then(function(e){u||(u=!0,n[s]=e,--a||r(n))},i)}),--a||r(n)});return o&&i(o.error),n.promise},race:function(e){var t=this,n=x(t),r=n.reject,i=M(function(){p(e,!1,function(e){t.resolve(e).then(n.resolve,r)})});return i&&r(i.error),n.promise}})},function(e,t,n){"use strict";var r=n(108)(!0);n(34)(String,"String",function(e){this._t=String(e),this._i=0},function(){var e,t=this._t,n=this._i;return n>=t.length?{value:void 0,done:!0}:(e=r(t,n),this._i+=e.length,{value:e,done:!1})})},function(e,t,n){n(113);for(var r=n(8),i=n(11),o=n(15),a=n(6)("toStringTag"),s=["NodeList","DOMTokenList","MediaList","StyleSheetList","CSSRuleList"],u=0;u<5;u++){var c=s[u],l=r[c],f=l&&l.prototype;f&&!f[a]&&i(f,a,c),o[c]=o.Array}}])}); \ No newline at end of file +!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("fabric/dist/fabric.require"),require("tui-code-snippet")):"function"==typeof define&&define.amd?define(["fabric/dist/fabric.require","tui-code-snippet"],t):"object"==typeof exports?exports.ImageEditor=t(require("fabric/dist/fabric.require"),require("tui-code-snippet")):(e.tui=e.tui||{},e.tui.ImageEditor=t(e.fabric,e.tui&&e.tui.util))}(this,function(e,t){return function(e){function t(r){if(n[r])return n[r].exports;var i=n[r]={exports:{},id:r,loaded:!1};return e[r].call(i.exports,i,i.exports,t),i.loaded=!0,i.exports}var n={};return t.m=e,t.c=n,t.p="dist",t(0)}([function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(83),o=r(i);n(41),n(42),n(43),n(44),n(45),n(46),n(47),n(48),n(49),n(50),n(51),n(52),n(53),n(54),n(55),n(56),n(57),n(59),n(58),e.exports=o.default},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(9),o=r(i);e.exports={componentNames:o.default.keyMirror("IMAGE_LOADER","CROPPER","FLIP","ROTATION","FREE_DRAWING","LINE","TEXT","ICON","FILTER","SHAPE"),commandNames:{CLEAR_OBJECTS:"clearObjects",LOAD_IMAGE:"loadImage",FLIP_IMAGE:"flip",ROTATE_IMAGE:"rotate",ADD_OBJECT:"addObject",REMOVE_OBJECT:"removeObject",APPLY_FILTER:"applyFilter",REMOVE_FILTER:"removeFilter",ADD_ICON:"addIcon",CHANGE_ICON_COLOR:"changeIconColor",ADD_SHAPE:"addShape",CHANGE_SHAPE:"changeShape",ADD_TEXT:"addText",CHANGE_TEXT:"changeText",CHANGE_TEXT_STYLE:"changeTextStyle",ADD_IMAGE_OBJECT:"addImageObject",RESIZE_CANVAS_DIMENSION:"resizeCanvasDimension",SET_OBJECT_PROPERTIES:"setObjectProperties",SET_OBJECT_POSITION:"setObjectPosition"},eventNames:{OBJECT_ACTIVATED:"objectActivated",OBJECT_MOVED:"objectMoved",OBJECT_SCALED:"objectScaled",TEXT_EDITING:"textEditing",TEXT_CHANGED:"textChanged",ADD_TEXT:"addText",ADD_OBJECT:"addObject",MOUSE_DOWN:"mousedown",REDO_STACK_CHANGED:"redoStackChanged",UNDO_STACK_CHANGED:"undoStackChanged"},drawingModes:o.default.keyMirror("NORMAL","CROPPER","FREE_DRAWING","LINE_DRAWING","TEXT","SHAPE"),keyCodes:{Z:90,Y:89,SHIFT:16,BACKSPACE:8,DEL:46},fObjectOptions:{SELECTION_STYLE:{borderColor:"red",cornerColor:"green",cornerSize:10,originX:"center",originY:"center",transparentCorners:!1}},rejectMessages:{flip:"The flipX and flipY setting values are not changed.",rotation:"The current angle is same the old angle.",loadImage:"The background image is empty.",isLock:"The executing command state is locked.",undo:"The promise of undo command is reject.",redo:"The promise of redo command is reject.",invalidDrawingMode:"This operation is not supported in the drawing mode",invalidParameters:"Invalid parameters",noActiveObject:"There is no active object.",unsupportedType:"Unsupported object type",noObject:"The object is not in canvas.",addedObject:"The object is already added."}}},function(e,t,n){n(114),n(116),n(117),n(115),e.exports=n(13).Promise},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e){var t=u[e];if(t){for(var n=arguments.length,r=Array(n>1?n-1:0),i=1;in&&(r=t,t=n,n=r),o(t,i(e,n))},keyMirror:function(){for(var e={},t=arguments.length,n=Array(t),i=0;i0?r:n)(e)}},function(e,t,n){var r=n(92),i=n(22);e.exports=function(e){return r(i(e))}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(9),s=(0,a.keyMirror)("UN_IMPLEMENTATION","NO_COMPONENT_NAME"),u={UN_IMPLEMENTATION:"Should implement a method: ",NO_COMPONENT_NAME:"Should set a component name"},c={UN_IMPLEMENTATION:function(e){return u.UN_IMPLEMENTATION+e},NO_COMPONENT_NAME:function(){return u.NO_COMPONENT_NAME}};e.exports={types:o.default.extend({},s),create:function(e){e=e.toLowerCase();for(var t=c[e],n=arguments.length,r=Array(n>1?n-1:0),i=1;in;)t.push(arguments[n++]);return g[++v]=function(){s("function"==typeof e?e:Function(e),t)},r(v),v},d=function(e){delete g[e]},"process"==n(16)(f)?r=function(e){f.nextTick(a(y,e,1))}:p?(i=new p,o=i.port2,i.port1.onmessage=m,r=a(o.postMessage,o,1)):l.addEventListener&&"function"==typeof postMessage&&!l.importScripts?(r=function(e){l.postMessage(e+"","*")},l.addEventListener("message",m,!1)):r=_ in c("script")?function(e){u.appendChild(c("script"))[_]=function(){u.removeChild(this),y.call(e)}}:function(e){setTimeout(a(y,e,1),0)}),e.exports={set:h,clear:d}},function(e,t,n){var r=n(26),i=Math.min;e.exports=function(e){return e>0?i(r(e),9007199254740991):0}},function(e,t){var n=0,r=Math.random();e.exports=function(e){return"Symbol(".concat(void 0===e?"":e,")_",(++n+r).toString(36))}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.commandNames,h=l.ICON,d={name:f.ADD_ICON,execute:function(e,t,n){var r=this,i=e.getComponent(h);return i.add(t,n).then(function(t){return r.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(d),e.exports=d},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f={name:l.ADD_IMAGE_OBJECT,execute:function(e,t){var n=this;return e.addImageObject(t).then(function(t){return n.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f=c.default.rejectMessages,h={name:l.ADD_OBJECT,execute:function(e,t){return new s.default(function(n,r){e.contains(t)?r(f.addedObject):(e.add(t),n(t))})},undo:function(e,t){return new s.default(function(n,r){e.contains(t)?(e.remove(t),n(t)):r(f.noObject)})}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.commandNames,h=l.SHAPE,d={name:f.ADD_SHAPE,execute:function(e,t,n){var r=this,i=e.getComponent(h);return i.add(t,n).then(function(t){return r.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(d),e.exports=d},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.commandNames,h=l.TEXT,d={name:f.ADD_TEXT,execute:function(e,t,n){var r=this,i=e.getComponent(h);return i.add(t,n).then(function(t){return r.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(d),e.exports=d},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.rejectMessages,l=s.default.commandNames,f=u.FILTER,h={name:l.APPLY_FILTER,execute:function(e,t,n){var r=e.getComponent(f);if("mask"===t){var i=e.getObject(n.maskObjId);if(!i||!i.isType("image"))return Promise.reject(c.invalidParameters);n={mask:i}}return"mask"===t?(this.undoData.object=n.mask,e.remove(n.mask)):this.undoData.options=r.getOptions(t),r.add(t,n)},undo:function(e,t){var n=e.getComponent(f);if("mask"===t){var r=this.undoData.object;return e.add(r),e.setActiveObject(r),n.remove(t)}return this.undoData.options?n.add(t,this.undoData.options):n.remove(t)}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.rejectMessages,h=c.default.commandNames,d=l.ICON,p={name:h.CHANGE_ICON_COLOR,execute:function(e,t,n){var r=this;return new s.default(function(i,o){var a=e.getComponent(d),s=e.getObject(t);s||o(f.noObject),r.undoData.object=s,r.undoData.color=a.getColor(s),a.setColor(n,s),i()})},undo:function(e){var t=e.getComponent(d),n=this.undoData.object,r=n.object,i=n.color;return t.setColor(i,r),s.default.resolve()}};o.default.register(p),e.exports=p},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(3),s=r(a),u=n(2),c=r(u),l=n(1),f=r(l),h=f.default.componentNames,d=f.default.rejectMessages,p=f.default.commandNames,v=h.SHAPE,g={name:p.CHANGE_SHAPE,execute:function(e,t,n){var r=this,i=e.getComponent(v),a=e.getObject(t);return a?(this.undoData.object=a,this.undoData.options={},o.default.forEachOwnProperties(n,function(e,t){r.undoData.options[t]=a[t]}),i.change(a,n)):c.default.reject(d.noObject)},undo:function(e){var t=e.getComponent(v),n=this.undoData,r=n.object,i=n.options;return t.change(r,i)}};s.default.register(g),e.exports=g},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.rejectMessages,h=c.default.commandNames,d=l.TEXT,p={name:h.CHANGE_TEXT,execute:function(e,t,n){var r=e.getComponent(d),i=e.getObject(t);return i?(this.undoData.object=i,this.undoData.text=r.getText(i),r.change(i,n)):s.default.reject(f.noObject)},undo:function(e){var t=e.getComponent(d),n=this.undoData,r=n.object,i=n.text;return t.change(r,i)}};o.default.register(p),e.exports=p},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(3),s=r(a),u=n(2),c=r(u),l=n(1),f=r(l),h=f.default.componentNames,d=f.default.rejectMessages,p=f.default.commandNames,v=h.TEXT,g={name:p.CHANGE_TEXT_STYLE,execute:function(e,t,n){var r=this,i=e.getComponent(v),a=e.getObject(t);return a?(this.undoData.object=a,this.undoData.styles={},o.default.forEachOwnProperties(n,function(e,t){r.undoData.styles[t]=a[t]}),i.setStyle(a,n)):c.default.reject(d.noObject)},undo:function(e){var t=e.getComponent(v),n=this.undoData,r=n.object,i=n.styles;return t.setStyle(r,i)}};s.default.register(g),e.exports=g},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f={name:l.CLEAR_OBJECTS,execute:function(e){var t=this;return new s.default(function(n){t.undoData.objects=e.removeAll(),n()})},undo:function(e){return e.add(this.undoData.objects),s.default.resolve()}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.FLIP,f={name:c.FLIP_IMAGE,execute:function(e,t){var n=e.getComponent(l);return this.undoData.setting=n.getCurrentSetting(),n[t]()},undo:function(e){var t=e.getComponent(l);return t.set(this.undoData.setting)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.IMAGE_LOADER,f={name:c.LOAD_IMAGE,execute:function(e,t,n){var r=e.getComponent(l),i=r.getCanvasImage(),o=i?i.width:0,a=i?i.height:0;return this.undoData={name:r.getImageName(),image:i,objects:e.removeAll(!0)},r.load(t,n).then(function(e){return{oldWidth:o,oldHeight:a,newWidth:e.width,newHeight:e.height}})},undo:function(e){var t=e.getComponent(l),n=this.undoData,r=n.objects,i=n.name,o=n.image;return e.removeAll(!0),e.add(r),t.load(i,o)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.FILTER,f={name:c.REMOVE_FILTER,execute:function(e,t){var n=e.getComponent(l);return this.undoData.options=n.getOptions(t),n.remove(t)},undo:function(e,t){var n=e.getComponent(l),r=this.undoData.options;return n.add(t,r)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f=c.default.rejectMessages,h={name:l.REMOVE_OBJECT,execute:function(e,t){var n=this;return new s.default(function(r,i){n.undoData.objects=e.removeObjectById(t),n.undoData.objects.length?r():i(f.noObject)})},undo:function(e){return e.add(this.undoData.objects),s.default.resolve()}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f={name:l.RESIZE_CANVAS_DIMENSION,execute:function(e,t){var n=this;return new s.default(function(r){n.undoData.size={width:e.cssMaxWidth,height:e.cssMaxHeight},e.setCssMaxDimension(t),e.adjustCanvasDimension(),r()})},undo:function(e){return e.setCssMaxDimension(this.undoData.size),e.adjustCanvasDimension(),s.default.resolve()}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.ROTATION,f={name:c.ROTATE_IMAGE,execute:function(e,t,n){var r=e.getComponent(l);return this.undoData.angle=r.getCurrentAngle(),r[t](n)},undo:function(e){var t=e.getComponent(l),n=this.undoData.angle;return t.setAngle(n)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f=c.default.rejectMessages,h={name:l.SET_OBJECT_POSITION,execute:function(e,t,n){var r=e.getObject(t);return r?(this.undoData.objectId=t,this.undoData.props=e.getObjectProperties(t,["left","top"]),e.setObjectPosition(t,n),e.renderAll(),s.default.resolve()):s.default.reject(f.noObject)},undo:function(e){var t=this.undoData,n=t.objectId,r=t.props;return e.setObjectProperties(n,r),e.renderAll(),s.default.resolve()}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(3),s=r(a),u=n(2),c=r(u),l=n(1),f=r(l),h=f.default.commandNames,d=f.default.rejectMessages,p={name:h.SET_OBJECT_PROPERTIES,execute:function(e,t,n){var r=this,i=e.getObject(t);return i?(this.undoData.props={},o.default.forEachOwnProperties(n,function(e,t){r.undoData.props[t]=i[t]}),e.setObjectProperties(t,n),c.default.resolve()):c.default.reject(d.noObject)},undo:function(e,t){var n=this.undoData.props;return e.setObjectProperties(t,n),c.default.resolve()}};s.default.register(p),e.exports=p},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;ng&&(o.remove(),o.set(this._calcRectDimensionFromPoint(r,i)),t.add(o))}},{key:"_calcRectDimensionFromPoint",value:function(e,t){var n=this.getCanvas(),r=n.getWidth(),i=n.getHeight(),o=this._startX,a=this._startY,s=(0,v.clamp)(e,0,o),u=(0,v.clamp)(t,0,a),c=(0,v.clamp)(e,o,r)-s,l=(0,v.clamp)(t,a,i)-u;return this._withShiftKey&&(c>l?l=c:l>c&&(c=l),o>=e&&(s=o-c),a>=t&&(u=a-l)),{left:s,top:u,width:c,height:l}}},{key:"_onFabricMouseUp",value:function(){var e=this._cropzone,t=this._listeners,n=this.getCanvas();n.setActiveObject(e),n.off({"mouse:move":t.mousemove,"mouse:up":t.mouseup})}},{key:"getCroppedImageData",value:function(e){var t=this.getCanvas(),n=t.contains(this._cropzone);if(!e)return null;n&&this._cropzone.remove();var r={imageName:this.getImageName(),url:t.toDataURL(e)};return n&&t.add(this._cropzone),r}},{key:"getCropzoneRect",value:function(){var e=this._cropzone;return e.isValid()?{left:e.getLeft(),top:e.getTop(),width:e.getWidth(),height:e.getHeight()}:null}},{key:"_onKeyDown",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!0)}},{key:"_onKeyUp",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!1)}}]),t}(f.default);e.exports=_},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;nn},_getColor:function(e,t,n){var r=[0,0,0,0],i=e.data,o=e.width,a=4,s=(o*n+t)*a;return r[0]=i[s],r[1]=i[s+1],r[2]=i[s+2],r[3]=i[s+3],r}});e.exports=a},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(4),s=r(a),u=n(9),c="tl",l="tr",f="mt",h="ml",d="mr",p="mb",v="bl",g="br",_=s.default.util.createClass(s.default.Rect,{initialize:function(e){e.type="cropzone",this.callSuper("initialize",e),this.on({moving:this._onMoving,scaling:this._onScaling})},_render:function(e){var t=7,n=7;this.callSuper("_render",e);var r=this.flipX?-1:1,i=this.flipY?-1:1,o=r/this.scaleX,a=i/this.scaleY;e.scale(o,a),this._fillOuterRect(e,"rgba(0, 0, 0, 0.55)"),this._strokeBorder(e,"rgb(0, 0, 0)",t),this._strokeBorder(e,"rgb(255, 255, 255)",t,n),e.scale(1/o,1/a)},_fillOuterRect:function(e,t){var n=this._getCoordinates(e),r=n.x,i=n.y;e.save(),e.fillStyle=t,e.beginPath(),e.moveTo(r[0]-1,i[0]-1),e.lineTo(r[3]+1,i[0]-1),e.lineTo(r[3]+1,i[3]+1),e.lineTo(r[0]-1,i[3]-1),e.lineTo(r[0]-1,i[0]-1),e.closePath(),e.moveTo(r[1],i[1]),e.lineTo(r[1],i[2]),e.lineTo(r[2],i[2]),e.lineTo(r[2],i[1]),e.lineTo(r[1],i[1]),e.closePath(),e.fill(),e.restore()},_getCoordinates:function(e){var t=this.getWidth(),n=this.getHeight(),r=t/2,i=n/2,a=this.getLeft(),s=this.getTop(),u=e.canvas;return{x:o.default.map([-(r+a),-r,r,r+(u.width-a-t)],Math.ceil),y:o.default.map([-(i+s),-i,i,i+(u.height-s-n)],Math.ceil)}},_strokeBorder:function(e,t,n,r){var i=this.getWidth()/2,o=this.getHeight()/2;e.save(),e.strokeStyle=t,e.setLineDash&&e.setLineDash([n,n]),r&&(e.lineDashOffset=r), +e.beginPath(),e.moveTo(-i,-o),e.lineTo(i,-o),e.lineTo(i,o),e.lineTo(-i,o),e.lineTo(-i,-o),e.stroke(),e.restore()},_onMoving:function(){var e=this.getLeft(),t=this.getTop(),n=this.getWidth(),r=this.getHeight(),i=this.canvas.getWidth()-n,o=this.canvas.getHeight()-r;this.setLeft((0,u.clamp)(e,0,i)),this.setTop((0,u.clamp)(t,0,o))},_onScaling:function(e){var t=this.canvas.getPointer(e.e),n=this._calcScalingSizeFromPointer(t);this.scale(1).set(n)},_calcScalingSizeFromPointer:function(e){var t=e.x,n=e.y,r=this._calcTopLeftScalingSizeFromPointer(t,n),i=this._calcBottomRightScalingSizeFromPointer(t,n);return this._makeScalingSettings(r,i)},_calcTopLeftScalingSizeFromPointer:function(e,t){var n=this.getHeight()+this.top,r=this.getWidth()+this.left,i=(0,u.clamp)(t,0,n-1),o=(0,u.clamp)(e,0,r-1);return{top:i,left:o,width:r-o,height:n-i}},_calcBottomRightScalingSizeFromPointer:function(e,t){var n=this.canvas,r=n.width,i=n.height,o=this.left,a=this.top;return{width:(0,u.clamp)(e,o+1,r)-o,height:(0,u.clamp)(t,a+1,i)-a}},_makeScalingSettings:function(e,t){var n=e.width,r=e.height,i=t.height,o=t.width,a=e.left,s=e.top,u=void 0;switch(this.__corner){case c:u=e;break;case l:u={width:o,height:r,top:s};break;case v:u={width:n,height:i,left:a};break;case g:u=t;break;case h:u={width:n,left:a};break;case f:u={height:r,top:s};break;case d:u={width:o};break;case p:u={height:i}}return u},isValid:function(){return this.left>=0&&this.top>=0&&this.width>0&&this.height>0}});e.exports=_},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(4),o=r(i),a=o.default.util.createClass(o.default.Image.filters.Convolute,{type:"Emboss",initialize:function(){var e=[1,1,1,1,.7,-1,-1,-1,-1];this.matrix=e}});e.exports=a},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(4),o=r(i),a=o.default.util.createClass(o.default.Image.filters.Mask,{applyTo:function(e){if(this.mask){var t=e.width,n=e.height,r=this._createCanvasOfMask(t,n),i=e.getContext("2d"),o=r.getContext("2d"),a=i.getImageData(0,0,t,n);this._drawMask(o,e,i),this._mapData(o,a,t,n),i.putImageData(a,0,0)}},_createCanvasOfMask:function(e,t){var n=o.default.util.createCanvasElement();return n.width=e,n.height=t,n},_drawMask:function(e){var t=this.mask,n=t.getElement(),r=t.getLeft(),i=t.getTop(),o=t.getAngle();e.save(),e.translate(r,i),e.rotate(o*Math.PI/180),e.scale(t.scaleX,t.scaleY),e.drawImage(n,-n.width/2,-n.height/2),e.restore()},_mapData:function(e,t,n,r){for(var i=t.data,o=e.getImageData(0,0,n,r).data,a=this.channel,s=t.width*t.height*4,u=0;uu?"right":"left",originY:i>c?"bottom":"top"}}function i(e){return"center"===e.getOriginX()&&"center"===e.getOriginY()}function o(e,t){var n=t.getPointByOrigin("center","center"),i=-t.getAngle(),o=r(n,e,i),a=o.originX,s=o.originY,u=t.getPointByOrigin(a,s),c=t.getLeft()-(n.x-u.x),l=t.getTop()-(n.x-u.y);t.set({originX:a,originY:s,left:c,top:l}),t.setCoords()}function a(e,t){var n=t.startPoint,i=-t.getAngle(),o=r(n,e,i),a=o.originX,s=o.originY;t.setPositionByOrigin(n,a,s)}function s(e){var t=e.type,n=e.scaleX,r=e.scaleY,i=l[t],o=e[i.w]*n,a=e[i.h]*r;if(e.isRegular){var s=Math.max(n,r);o=e[i.w]*s,a=e[i.h]*s}var u={hasControls:!1,hasBorders:!1,scaleX:1,scaleY:1};u[i.w]=o,u[i.h]=a,e.set(u)}function u(e,t){var n=t.type,r=t.strokeWidth,i=t.startPoint,o=c[n],a=l[n],s=!("triangle"!==t.type),u={},f=Math.abs(i.x-e.x)/o,h=Math.abs(i.y-e.y)/o;f>r&&(f-=r/o),h>r&&(h-=r/o),t.isRegular&&(f=h=Math.max(f,h),s&&(h=Math.sqrt(3)/2*f)),u[a.w]=f,u[a.h]=h,t.set(u)}var c={rect:1,circle:2,triangle:1},l={rect:{w:"width",h:"height"},circle:{w:"rx",h:"ry"},triangle:{w:"width",h:"height"}};e.exports={setOrigins:function(e){var t=e.getPointByOrigin("left","top"),n=e.getPointByOrigin("right","top"),r=e.getPointByOrigin("right","bottom"),i=e.getPointByOrigin("left","bottom");e.origins={lt:t,rt:n,rb:r,lb:i}},resize:function(e,t,r){i(e)&&(o(t,e),n(e)),r?s(e,t):u(t,e),a(t,e)},adjustOriginToCenter:function(e){var t=e.getPointByOrigin("center","center"),n=e.getOriginX(),r=e.getOriginY(),i=e.getPointByOrigin(n,r),o=e.getLeft()+(t.x-i.x),a=e.getTop()+(t.y-i.y);e.set({hasControls:!0,hasBorders:!0,originX:"center",originY:"center",left:o,top:a}),e.setCoords()}}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var o=function(){function e(e,t){for(var n=0;n1?n-1:0),i=1;il;)if(s=u[l++],s!=s)return!0}else for(;c>l;l++)if((e||l in u)&&u[l]===n)return e||l||0;return!e&&-1}}},function(e,t,n){var r=n(17),i=n(94),o=n(93),a=n(10),s=n(39),u=n(112),c={},l={},t=e.exports=function(e,t,n,f,h){var d,p,v,g,_=h?function(){return e}:u(e),y=r(n,f,t?2:1),m=0;if("function"!=typeof _)throw TypeError(e+" is not iterable!");if(o(_)){for(d=s(e.length);d>m;m++)if(g=t?y(a(p=e[m])[0],p[1]):y(e[m]),g===c||g===l)return g}else for(v=_.call(e);!(p=v.next()).done;)if(g=i(v,y,p.value,t),g===c||g===l)return g};t.BREAK=c,t.RETURN=l},function(e,t,n){e.exports=!n(14)&&!n(32)(function(){return 7!=Object.defineProperty(n(23)("div"),"a",{get:function(){return 7}}).a})},function(e,t){e.exports=function(e,t,n){var r=void 0===n;switch(t.length){case 0:return r?e():e.call(n);case 1:return r?e(t[0]):e.call(n,t[0]);case 2:return r?e(t[0],t[1]):e.call(n,t[0],t[1]);case 3:return r?e(t[0],t[1],t[2]):e.call(n,t[0],t[1],t[2]);case 4:return r?e(t[0],t[1],t[2],t[3]):e.call(n,t[0],t[1],t[2],t[3])}return e.apply(n,t)}},function(e,t,n){var r=n(16);e.exports=Object("z").propertyIsEnumerable(0)?Object:function(e){return"String"==r(e)?e.split(""):Object(e)}},function(e,t,n){var r=n(15),i=n(6)("iterator"),o=Array.prototype;e.exports=function(e){return void 0!==e&&(r.Array===e||o[i]===e)}},function(e,t,n){var r=n(10);e.exports=function(e,t,n,i){try{return i?t(r(n)[0],n[1]):t(n)}catch(t){var o=e.return;throw void 0!==o&&r(o.call(e)),t}}},function(e,t,n){"use strict";var r=n(99),i=n(36),o=n(24),a={};n(11)(a,n(6)("iterator"),function(){return this}),e.exports=function(e,t,n){e.prototype=r(a,{next:i(1,n)}),o(e,t+" Iterator")}},function(e,t,n){var r=n(6)("iterator"),i=!1;try{var o=[7][r]();o.return=function(){i=!0},Array.from(o,function(){throw 2})}catch(e){}e.exports=function(e,t){if(!t&&!i)return!1;var n=!1;try{var o=[7],a=o[r]();a.next=function(){return{done:n=!0}},o[r]=function(){return a},e(o)}catch(e){}return n}},function(e,t){e.exports=function(e,t){return{value:t,done:!!e}}},function(e,t,n){var r=n(8),i=n(38).set,o=r.MutationObserver||r.WebKitMutationObserver,a=r.process,s=r.Promise,u="process"==n(16)(a);e.exports=function(){var e,t,n,c=function(){var r,i;for(u&&(r=a.domain)&&r.exit();e;){i=e.fn,e=e.next;try{i()}catch(r){throw e?n():t=void 0,r}}t=void 0,r&&r.enter()};if(u)n=function(){a.nextTick(c)};else if(o){var l=!0,f=document.createTextNode("");new o(c).observe(f,{characterData:!0}),n=function(){f.data=l=!l}}else if(s&&s.resolve){var h=s.resolve();n=function(){h.then(c)}}else n=function(){i.call(r,c)};return function(r){var i={fn:r,next:void 0};t&&(t.next=i),e||(e=i,n()),t=i}}},function(e,t,n){var r=n(10),i=n(100),o=n(30),a=n(25)("IE_PROTO"),s=function(){},u="prototype",c=function(){var e,t=n(23)("iframe"),r=o.length,i="<",a=">";for(t.style.display="none",n(33).appendChild(t),t.src="javascript:",e=t.contentWindow.document,e.open(),e.write(i+"script"+a+"document.F=Object"+i+"/script"+a),e.close(),c=e.F;r--;)delete c[u][o[r]];return c()};e.exports=Object.create||function(e,t){var n;return null!==e?(s[u]=r(e),n=new s,s[u]=null,n[a]=e):n=c(),void 0===t?n:i(n,t)}},function(e,t,n){var r=n(20),i=n(10),o=n(103);e.exports=n(14)?Object.defineProperties:function(e,t){i(e);for(var n,a=o(t),s=a.length,u=0;s>u;)r.f(e,n=a[u++],t[n]);return e}},function(e,t,n){var r=n(18),i=n(110),o=n(25)("IE_PROTO"),a=Object.prototype;e.exports=Object.getPrototypeOf||function(e){return e=i(e),r(e,o)?e[o]:"function"==typeof e.constructor&&e instanceof e.constructor?e.constructor.prototype:e instanceof Object?a:null}},function(e,t,n){var r=n(18),i=n(27),o=n(88)(!1),a=n(25)("IE_PROTO");e.exports=function(e,t){var n,s=i(e),u=0,c=[];for(n in s)n!=a&&r(s,n)&&c.push(n);for(;t.length>u;)r(s,n=t[u++])&&(~o(c,n)||c.push(n));return c}},function(e,t,n){var r=n(102),i=n(30);e.exports=Object.keys||function(e){return r(e,i)}},function(e,t,n){var r=n(11);e.exports=function(e,t,n){for(var i in t)n&&e[i]?e[i]=t[i]:r(e,i,t[i]);return e}},function(e,t,n){e.exports=n(11)},function(e,t,n){"use strict";var r=n(8),i=n(13),o=n(20),a=n(14),s=n(6)("species");e.exports=function(e){var t="function"==typeof i[e]?i[e]:r[e];a&&t&&!t[s]&&o.f(t,s,{configurable:!0,get:function(){return this}})}},function(e,t,n){var r=n(10),i=n(21),o=n(6)("species");e.exports=function(e,t){var n,a=r(e).constructor;return void 0===a||void 0==(n=r(a)[o])?t:i(n)}},function(e,t,n){var r=n(26),i=n(22);e.exports=function(e){return function(t,n){var o,a,s=String(i(t)),u=r(n),c=s.length;return u<0||u>=c?e?"":void 0:(o=s.charCodeAt(u),o<55296||o>56319||u+1===c||(a=s.charCodeAt(u+1))<56320||a>57343?e?s.charAt(u):o:e?s.slice(u,u+2):(o-55296<<10)+(a-56320)+65536); +}}},function(e,t,n){var r=n(26),i=Math.max,o=Math.min;e.exports=function(e,t){return e=r(e),e<0?i(e+t,0):o(e,t)}},function(e,t,n){var r=n(22);e.exports=function(e){return Object(r(e))}},function(e,t,n){var r=n(19);e.exports=function(e,t){if(!r(e))return e;var n,i;if(t&&"function"==typeof(n=e.toString)&&!r(i=n.call(e)))return i;if("function"==typeof(n=e.valueOf)&&!r(i=n.call(e)))return i;if(!t&&"function"==typeof(n=e.toString)&&!r(i=n.call(e)))return i;throw TypeError("Can't convert object to primitive value")}},function(e,t,n){var r=n(29),i=n(6)("iterator"),o=n(15);e.exports=n(13).getIteratorMethod=function(e){if(void 0!=e)return e[i]||e["@@iterator"]||o[r(e)]}},function(e,t,n){"use strict";var r=n(86),i=n(97),o=n(15),a=n(27);e.exports=n(34)(Array,"Array",function(e,t){this._t=a(e),this._i=0,this._k=t},function(){var e=this._t,t=this._k,n=this._i++;return!e||n>=e.length?(this._t=void 0,i(1)):"keys"==t?i(0,n):"values"==t?i(0,e[n]):i(0,[n,e[n]])},"values"),o.Arguments=o.Array,r("keys"),r("values"),r("entries")},function(e,t){},function(e,t,n){"use strict";var r,i,o,a=n(35),s=n(8),u=n(17),c=n(29),l=n(31),f=n(19),h=n(21),d=n(87),p=n(89),v=n(107),g=n(38).set,_=n(98)(),y="Promise",m=s.TypeError,b=s.process,O=s[y],b=s.process,k="process"==c(b),w=function(){},C=!!function(){try{var e=O.resolve(1),t=(e.constructor={})[n(6)("species")]=function(e){e(w,w)};return(k||"function"==typeof PromiseRejectionEvent)&&e.then(w)instanceof t}catch(e){}}(),E=function(e,t){return e===t||e===O&&t===o},j=function(e){var t;return!(!f(e)||"function"!=typeof(t=e.then))&&t},x=function(e){return E(O,e)?new T(e):new i(e)},T=i=function(e){var t,n;this.promise=new e(function(e,r){if(void 0!==t||void 0!==n)throw m("Bad Promise constructor");t=e,n=r}),this.resolve=h(t),this.reject=h(n)},M=function(e){try{e()}catch(e){return{error:e}}},S=function(e,t){if(!e._n){e._n=!0;var n=e._c;_(function(){for(var r=e._v,i=1==e._s,o=0,a=function(t){var n,o,a=i?t.ok:t.fail,s=t.resolve,u=t.reject,c=t.domain;try{a?(i||(2==e._h&&D(e),e._h=1),a===!0?n=r:(c&&c.enter(),n=a(r),c&&c.exit()),n===t.promise?u(m("Promise-chain cycle")):(o=j(n))?o.call(n,s,u):s(n)):u(r)}catch(e){u(e)}};n.length>o;)a(n[o++]);e._c=[],e._n=!1,t&&!e._h&&P(e)})}},P=function(e){g.call(s,function(){var t,n,r,i=e._v;if(A(e)&&(t=M(function(){k?b.emit("unhandledRejection",i,e):(n=s.onunhandledrejection)?n({promise:e,reason:i}):(r=s.console)&&r.error&&r.error("Unhandled promise rejection",i)}),e._h=k||A(e)?2:1),e._a=void 0,t)throw t.error})},A=function(e){if(1==e._h)return!1;for(var t,n=e._a||e._c,r=0;n.length>r;)if(t=n[r++],t.fail||!A(t.promise))return!1;return!0},D=function(e){g.call(s,function(){var t;k?b.emit("rejectionHandled",e):(t=s.onrejectionhandled)&&t({promise:e,reason:e._v})})},I=function(e){var t=this;t._d||(t._d=!0,t=t._w||t,t._v=e,t._s=2,t._a||(t._a=t._c.slice()),S(t,!0))},N=function(e){var t,n=this;if(!n._d){n._d=!0,n=n._w||n;try{if(n===e)throw m("Promise can't be resolved itself");(t=j(e))?_(function(){var r={_w:n,_d:!1};try{t.call(e,u(N,r,1),u(I,r,1))}catch(e){I.call(r,e)}}):(n._v=e,n._s=1,S(n,!1))}catch(e){I.call({_w:n,_d:!1},e)}}};C||(O=function(e){d(this,O,y,"_h"),h(e),r.call(this);try{e(u(N,this,1),u(I,this,1))}catch(e){I.call(this,e)}},r=function(e){this._c=[],this._a=void 0,this._s=0,this._d=!1,this._v=void 0,this._h=0,this._n=!1},r.prototype=n(104)(O.prototype,{then:function(e,t){var n=x(v(this,O));return n.ok="function"!=typeof e||e,n.fail="function"==typeof t&&t,n.domain=k?b.domain:void 0,this._c.push(n),this._a&&this._a.push(n),this._s&&S(this,!1),n.promise},catch:function(e){return this.then(void 0,e)}}),T=function(){var e=new r;this.promise=e,this.resolve=u(N,e,1),this.reject=u(I,e,1)}),l(l.G+l.W+l.F*!C,{Promise:O}),n(24)(O,y),n(106)(y),o=n(13)[y],l(l.S+l.F*!C,y,{reject:function(e){var t=x(this),n=t.reject;return n(e),t.promise}}),l(l.S+l.F*(a||!C),y,{resolve:function(e){if(e instanceof O&&E(e.constructor,this))return e;var t=x(this),n=t.resolve;return n(e),t.promise}}),l(l.S+l.F*!(C&&n(96)(function(e){O.all(e).catch(w)})),y,{all:function(e){var t=this,n=x(t),r=n.resolve,i=n.reject,o=M(function(){var n=[],o=0,a=1;p(e,!1,function(e){var s=o++,u=!1;n.push(void 0),a++,t.resolve(e).then(function(e){u||(u=!0,n[s]=e,--a||r(n))},i)}),--a||r(n)});return o&&i(o.error),n.promise},race:function(e){var t=this,n=x(t),r=n.reject,i=M(function(){p(e,!1,function(e){t.resolve(e).then(n.resolve,r)})});return i&&r(i.error),n.promise}})},function(e,t,n){"use strict";var r=n(108)(!0);n(34)(String,"String",function(e){this._t=String(e),this._i=0},function(){var e,t=this._t,n=this._i;return n>=t.length?{value:void 0,done:!0}:(e=r(t,n),this._i+=e.length,{value:e,done:!1})})},function(e,t,n){n(113);for(var r=n(8),i=n(11),o=n(15),a=n(6)("toStringTag"),s=["NodeList","DOMTokenList","MediaList","StyleSheetList","CSSRuleList"],u=0;u<5;u++){var c=s[u],l=r[c],f=l&&l.prototype;f&&!f[a]&&i(f,a,c),o[c]=o.Array}}])}); \ No newline at end of file From 3bbf4dc053eb20d0702f1065e8725591d34d7e11 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B9=80=EC=A7=84=EC=9A=B0?= Date: Thu, 12 Jul 2018 09:49:14 +0900 Subject: [PATCH 05/10] chore: build dist for 3.2.0 --- dist/svg/icon-a.svg | 239 + dist/svg/icon-b.svg | 228 + dist/svg/icon-c.svg | 228 + dist/svg/icon-d.svg | 228 + dist/tui-image-editor.css | 853 +++ dist/tui-image-editor.js | 13054 ++++++++++++++++++++++++++++---- dist/tui-image-editor.min.css | 7 + dist/tui-image-editor.min.js | 28 +- 8 files changed, 13227 insertions(+), 1638 deletions(-) create mode 100644 dist/svg/icon-a.svg create mode 100644 dist/svg/icon-b.svg create mode 100644 dist/svg/icon-c.svg create mode 100644 dist/svg/icon-d.svg create mode 100644 dist/tui-image-editor.css create mode 100644 dist/tui-image-editor.min.css diff --git a/dist/svg/icon-a.svg b/dist/svg/icon-a.svg new file mode 100644 index 000000000..edd7b06ba --- /dev/null +++ b/dist/svg/icon-a.svg @@ -0,0 +1,239 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/dist/svg/icon-b.svg b/dist/svg/icon-b.svg new file mode 100644 index 000000000..dc077e527 --- /dev/null +++ b/dist/svg/icon-b.svg @@ -0,0 +1,228 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/dist/svg/icon-c.svg b/dist/svg/icon-c.svg new file mode 100644 index 000000000..2c818c43f --- /dev/null +++ b/dist/svg/icon-c.svg @@ -0,0 +1,228 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/dist/svg/icon-d.svg b/dist/svg/icon-d.svg new file mode 100644 index 000000000..aaf4bda0d --- /dev/null +++ b/dist/svg/icon-d.svg @@ -0,0 +1,228 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/dist/tui-image-editor.css b/dist/tui-image-editor.css new file mode 100644 index 000000000..e662918b2 --- /dev/null +++ b/dist/tui-image-editor.css @@ -0,0 +1,853 @@ +/*! + * tui-image-editor.js + * @version 3.2.0 + * @author NHNEnt FE Development Lab + * @license MIT + */ +body > textarea { + position: fixed !important; +} +.tui-image-editor-container { + marign: 0; + padding: 0; + box-sizing: border-box; + min-height: 300px; + height: 100%; + position: relative; + background-color: #282828; + overflow: hidden; +} +.tui-image-editor-container div, +.tui-image-editor-container ul, +.tui-image-editor-container label, +.tui-image-editor-container input, +.tui-image-editor-container li { + box-sizing: border-box; + margin: 0; + padding: 0; + -ms-user-select: none; + -moz-user-select: -moz-none; + -khtml-user-select: none; + -webkit-user-select: none; + user-select: none; +} +.tui-image-editor-container .tui-image-editor-header { +/* BUTTON AND LOGO */ + min-width: 533px; + position: absolute; + background-color: #151515; + top: 0; + width: 100%; +} +.tui-image-editor-container .tui-image-editor-header-buttons, +.tui-image-editor-container .tui-image-editor-controls-buttons { + float: right; + margin: 8px; +} +.tui-image-editor-container .tui-image-editor-header-logo, +.tui-image-editor-container .tui-image-editor-controls-logo { + float: left; + width: 30%; + padding: 17px; +} +.tui-image-editor-container .tui-image-editor-controls-logo, +.tui-image-editor-container .tui-image-editor-controls-buttons { + width: 270px; + height: 100%; + display: none; +} +.tui-image-editor-container .tui-image-editor-header-buttons button, +.tui-image-editor-container .tui-image-editor-controls-buttons button { + position: relative; + width: 120px; + height: 40px; + outline: none; + border-radius: 20px; + border: 1px solid #ddd; + padding-top: 5px; + font-family: NotoSans, sans-serif; + font-size: 12px; + font-weight: bold; + cursor: pointer; +} +.tui-image-editor-container .tui-image-editor-download-btn { + background-color: #fdba3b; + border-color: #fdba3b; + color: #fff; +} +.tui-image-editor-container .tui-image-editor-load-btn { + position: absolute; + left: 0; + right: 0; + display: inline-block; + top: 0; + bottom: 0; + width: 100%; + cursor: pointer; + opacity: 0; +} +.tui-image-editor-container .tui-image-editor-main-container { + position: absolute; + width: 100%; + top: 0; + bottom: 64px; +} +.tui-image-editor-container .tui-image-editor-main { + position: absolute; + text-align: center; + top: 64px; + bottom: 0; + right: 0; + left: 0; +} +.tui-image-editor-container .tui-image-editor-wrap { + position: absolute; + bottom: 150px; + width: 100%; + overflow: auto; +} +.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap { + display: table; + width: 100%; + height: 100%; +} +.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap .tui-image-editor-align-wrap { + display: table-cell; + vertical-align: middle; +} +.tui-image-editor-container .tui-image-editor { + position: static; + display: inline-block; +} +.tui-image-editor-container .tui-image-editor-menu { + width: auto; + list-style: none; + padding: 0; + margin: 0 auto; + display: table-cell; + text-align: center; + vertical-align: middle; + white-space: nowrap; +} +.tui-image-editor-container .tui-image-editor-menu > .tui-image-editor-item { + position: relative; + display: inline-block; + border-radius: 2px; + padding: 7px 8px 3px 8px; + cursor: pointer; + margin: 0 4px; +} +.tui-image-editor-container .tui-image-editor-menu > .tui-image-editor-item[title]:hover:before { + content: ''; + position: absolute; + display: inline-block; + margin: 0 auto 0; + width: 0; + height: 0; + border-right: 7px solid transparent; + border-top: 7px solid #2f2f2f; + border-left: 7px solid transparent; + position: absolute; + left: 13px; + top: -2px; +} +.tui-image-editor-container .tui-image-editor-menu > .tui-image-editor-item[title]:hover:after { + content: attr(title); + position: absolute; + display: inline-block; + background-color: #2f2f2f; + color: #fff; + padding: 5px 8px; + font-size: 11px; + font-weight: lighter; + border-radius: 3px; + max-height: 23px; + top: -22px; + left: 0; + min-width: 24px; +} +.tui-image-editor-container .tui-image-editor-menu > .tui-image-editor-item.active { + background-color: #fff; + transition: all 0.3s ease; +} +.tui-image-editor-container .tui-image-editor-wrap { + position: absolute; +} +.tui-image-editor-container .tui-image-editor-grid-visual { + display: none; + position: absolute; + width: 100%; + height: 100%; +} +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor, +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor { + transition: none; +} +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-grid-visual, +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-grid-visual { + display: block; +} +.tui-image-editor-container .tui-image-editor-grid-visual table { + width: 100%; + height: 100%; + border-collapse: collapse; + box-shadow: 0 0 1px 0 rgba(0,0,0,0.3); +} +.tui-image-editor-container .tui-image-editor-grid-visual table td { + border: 1px solid #fff; + box-shadow: 0 0 1px 0 rgba(0,0,0,0.3); +} +.tui-image-editor-container .tui-image-editor-grid-visual table td.dot:before { + content: ''; + position: absolute; + width: 8px; + height: 8px; + border: 1px solid #cdcdcd; + border-radius: 100%; + background-color: #fff; +} +.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-top:before { + top: -4px; + left: -4px; +} +.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-top:before { + top: -4px; + right: -4px; +} +.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-bottom:before { + bottom: -4px; + left: -4px; +} +.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-bottom:before { + bottom: -4px; + right: -4px; +} +.tui-image-editor-container .tui-image-editor-submenu { + display: none; + position: absolute; + bottom: 0; + width: 100%; + height: 150px; + white-space: nowrap; +} +.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover svg > use.active { + display: block; +} +.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item li { + display: inline-block; + vertical-align: top; +} +.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-newline { + display: block; + margin-top: 14px; +} +.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button { + position: relative; + cursor: pointer; + display: inline-block; + font-weight: normal; + font-size: 11px; + margin: 0 7px 0 7px; +} +.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item label { + display: inline-block; + cursor: pointer; + padding-top: 5px; + font-family: NotoSans, sans-serif; + font-size: 11px; + letter-spacing: 0.7px; +} +.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.apply label, +.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.cancel label { + vertical-align: 7px; +} +.tui-image-editor-container .tui-image-editor-submenu > div { + display: none; + vertical-align: bottom; +} +.tui-image-editor-container .tui-image-editor-partition > div { + width: 1px; + height: 52px; + border-left: 1px solid #3c3c3c; + margin: 0 12px 0 14px; +} +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-partition > div { + height: 108px; + margin: 0 29px 0 0px; +} +.tui-image-editor-container .tui-image-editor-submenu-align { + text-align: left; + margin-right: 30px; +} +.tui-image-editor-container .tui-image-editor-submenu-align label { + width: 55px; + white-space: nowrap; +} +.tui-image-editor-container .tui-image-editor-submenu-align:first-child { + margin-right: 0; +} +.tui-image-editor-container .tui-image-editor-submenu-align:first-child label { + width: 70px; +} +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-crop .tui-image-editor-submenu > div.tui-image-editor-menu-crop, +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-submenu > div.tui-image-editor-menu-flip, +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-submenu > div.tui-image-editor-menu-rotate, +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-shape .tui-image-editor-submenu > div.tui-image-editor-menu-shape, +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-text .tui-image-editor-submenu > div.tui-image-editor-menu-text, +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-mask .tui-image-editor-submenu > div.tui-image-editor-menu-mask, +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-icon .tui-image-editor-submenu > div.tui-image-editor-menu-icon, +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-draw .tui-image-editor-submenu > div.tui-image-editor-menu-draw, +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-submenu > div.tui-image-editor-menu-filter { + display: table-cell; +} +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-crop .tui-image-editor-submenu, +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-submenu, +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-submenu, +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-shape .tui-image-editor-submenu, +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-text .tui-image-editor-submenu, +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-mask .tui-image-editor-submenu, +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-icon .tui-image-editor-submenu, +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-draw .tui-image-editor-submenu, +.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-submenu { + display: table; +} +.tui-image-editor-container .filter-color-item { + display: inline-block; +} +.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox { + display: block; +} +.tui-image-editor-container .tui-image-editor-checkbox-wrap { + display: inline-block !important; + text-align: left; +} +.tui-image-editor-container .tui-image-editor-checkbox-wrap.fixed-width { + width: 187px; + white-space: normal; +} +.tui-image-editor-container .tui-image-editor-checkbox { + display: inline-block; + margin: 1px 0 1px 0; +} +.tui-image-editor-container .tui-image-editor-checkbox input { + width: 14px; + height: 14px; + opacity: 0; +} +.tui-image-editor-container .tui-image-editor-checkbox input + label { + color: #fff; + height: 14px; + position: relative; +} +.tui-image-editor-container .tui-image-editor-checkbox input + label:before { + content: ''; + position: absolute; + width: 14px; + height: 14px; + background-color: #fff; + top: 4px; + left: -19px; + display: inline-block; + margin: 0; + text-align: center; + font-size: 11px; + border: 0; + border-radius: 2px; + padding-top: 1px; + box-sizing: border-box; +} +.tui-image-editor-container .tui-image-editor-checkbox input[type='checkbox']:checked + label:before { + background-size: cover; + background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAMBJREFUKBWVkjEOwjAMRe2WgZW7IIHEDdhghhuwcQ42rlJugAQS54Cxa5cq1QM5TUpByZfS2j9+dlJVt/tX5ZxbS4ZU9VLkQvSHKTIGRaVJYFmKrBbTCJxE2UgCdDzMZDkHrOV6b95V0US6UmgKodujEZbJg0B0ZgEModO5lrY1TMQf1TpyJGBEjD+E2NPN7ukIUDiF/BfEXgRiGEw8NgkffYGYwCi808fpn/6OvfUfsDr/Vc1IfRf8sKnFVqeiVQfDu0tf/nWH9gAAAABJRU5ErkJggg=="); +} +.tui-image-editor-container .tui-image-editor-selectlist-wrap { + position: relative; +} +.tui-image-editor-container .tui-image-editor-selectlist-wrap select { + width: 100%; + height: 25px; + margin-top: 9px; + border: 0; + outline: 0; + border-radius: 0; + border: 1px solid #cbdbdb; + background-color: #fff; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + padding: 0 7px 0 7px; +} +.tui-image-editor-container .tui-image-editor-selectlist-wrap:after { + content: ''; + position: absolute; + display: inline-block; + width: 14px; + height: 14px; + right: 5px; + bottom: 5px; + background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAHlJREFUKBVjYBgFOEOAEVkmPDxc89+/f6eAYjzI4kD2FyYmJrOVK1deh4kzwRggGiQBVJCELAZig8SQNYHEmEEEMrh69eo1HR0dfqCYJUickZGxf9WqVf3IakBsFBthklpaWmVA9mEQhrJhUoTp0NBQCRAmrHL4qgAAuu4cWZOZIGsAAAAASUVORK5CYII="); + background-size: cover; +} +.tui-image-editor-container .tui-image-editor-selectlist-wrap select::-ms-expand { + display: none; +} +.tui-image-editor-container .tui-image-editor-range { + position: relative; + top: 7px; + width: 166px; + height: 17px; + display: inline-block; +} +.tui-image-editor-container .tui-image-editor-virtual-range-bar { + top: 7px; + position: absolute; + width: 100%; + height: 2px; + background-color: #666; +} +.tui-image-editor-container .tui-image-editor-virtual-range-subbar { + position: absolute; + height: 100%; + left: 0; + right: 0; + background-color: #d1d1d1; +} +.tui-image-editor-container .tui-image-editor-virtual-range-pointer { + position: absolute; + cursor: pointer; + top: -5px; + left: 0; + width: 12px; + height: 12px; + background-color: #fff; + border-radius: 100%; +} +.tui-image-editor-container .tui-image-editor-range-wrap { + display: inline-block; +} +.tui-image-editor-container .tui-image-editor-range-wrap.short .tui-image-editor-range { + width: 100px; +} +.tui-image-editor-container .color-picker-control .tui-image-editor-range { + width: 108px; +} +.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-pointer { + background-color: #333; +} +.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-bar { + background-color: #ccc; +} +.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-subbar { + background-color: #606060; +} +.tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short { + margin-top: 0; + margin-left: 17px; +} +.tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label { + color: #8e8e8e; + font-weight: normal; +} +.tui-image-editor-container .tui-image-editor-range-wrap label { + vertical-align: baseline; + font-size: 11px; + margin-right: 7px; + color: #fff; +} +.tui-image-editor-container .tui-image-editor-range-value { + cursor: default; + width: 40px; + height: 24px; + outline: none; + border-radius: 2px; + box-shadow: none; + border: 1px solid #d5d5d5; + text-align: center; + background-color: #1c1c1c; + color: #fff; + font-weight: lighter; + vertical-align: baseline; + font-family: NotoSans, sans-serif; + padding-top: 2px; +} +.tui-image-editor-container .tui-image-editor-controls { + position: absolute; + background-color: #151515; + width: 100%; + height: 64px; + display: table; + bottom: 0; + z-index: 1; +} +.tui-image-editor-container .tui-image-editor-icpartition { + display: inline-block; + background-color: #282828; + width: 1px; + height: 24px; +} +.tui-image-editor-container.left .tui-image-editor-menu > .tui-image-editor-item[title]:before { + left: 28px; + top: 11px; + border-right: 7px solid #2f2f2f; + border-top: 7px solid transparent; + border-bottom: 7px solid transparent; +} +.tui-image-editor-container.left .tui-image-editor-menu > .tui-image-editor-item[title]:after { + top: 7px; + left: 39px; + width: 27px; +} +.tui-image-editor-container.left .tui-image-editor-submenu { + left: 0; + height: 100%; + width: 248px; +} +.tui-image-editor-container.left .tui-image-editor-main-container { + left: 64px; + width: calc(100% - 64px); + height: 100%; +} +.tui-image-editor-container.left .tui-image-editor-controls { + width: 64px; + height: 100%; + display: table; +} +.tui-image-editor-container.left .tui-image-editor-menu, +.tui-image-editor-container.right .tui-image-editor-menu { + white-space: initial; +} +.tui-image-editor-container.left .tui-image-editor-submenu, +.tui-image-editor-container.right .tui-image-editor-submenu { + white-space: normal; +} +.tui-image-editor-container.left .tui-image-editor-submenu > div, +.tui-image-editor-container.right .tui-image-editor-submenu > div { + vertical-align: middle; +} +.tui-image-editor-container.left .tui-image-editor-controls li, +.tui-image-editor-container.right .tui-image-editor-controls li { + display: inline-block; + margin: 4px auto; +} +.tui-image-editor-container.left .tui-image-editor-icpartition, +.tui-image-editor-container.right .tui-image-editor-icpartition { + position: relative; + top: -7px; + width: 24px; + height: 1px; +} +.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition, +.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition { + display: block; + width: 75%; + margin: auto; +} +.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition > div, +.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition > div { + border-left: 0; + height: 10px; + border-bottom: 1px solid #3c3c3c; + width: 100%; + margin: 0; +} +.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-align, +.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-align { + margin-right: 0; +} +.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-item li, +.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-item li { + margin-top: 15px; +} +.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-colorpicker-clearfix li, +.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-colorpicker-clearfix li { + margin-top: 0; +} +.tui-image-editor-container.left .tui-image-editor-checkbox-wrap.fixed-width, +.tui-image-editor-container.right .tui-image-editor-checkbox-wrap.fixed-width { + width: 182px; + white-space: normal; +} +.tui-image-editor-container.left .tui-image-editor-range-wrap.tui-image-editor-newline label.range, +.tui-image-editor-container.right .tui-image-editor-range-wrap.tui-image-editor-newline label.range { + display: block; + text-align: left; + width: 75%; + margin: auto; +} +.tui-image-editor-container.left .tui-image-editor-range, +.tui-image-editor-container.right .tui-image-editor-range { + width: 136px; +} +.tui-image-editor-container.left #tie-icon-add-button .tui-image-editor-button, +.tui-image-editor-container.right #tie-icon-add-button .tui-image-editor-button { + width: 45px; +} +.tui-image-editor-container.right .tui-image-editor-menu > .tui-image-editor-item[title]:before { + left: -3px; + top: 11px; + border-left: 7px solid #2f2f2f; + border-top: 7px solid transparent; + border-bottom: 7px solid transparent; +} +.tui-image-editor-container.right .tui-image-editor-menu > .tui-image-editor-item[title]:after { + top: 7px; + left: -44px; + width: 27px; +} +.tui-image-editor-container.right .tui-image-editor-submenu { + right: 0; + height: 100%; + width: 248px; +} +.tui-image-editor-container.right .tui-image-editor-main-container { + right: 64px; + width: calc(100% - 64px); + height: 100%; +} +.tui-image-editor-container.right .tui-image-editor-controls { + right: 0; + width: 64px; + height: 100%; + display: table; +} +.tui-image-editor-container.top .tui-image-editor-submenu .tui-image-editor-partition.only-left-right, +.tui-image-editor-container.bottom .tui-image-editor-submenu .tui-image-editor-partition.only-left-right { + display: none; +} +.tui-image-editor-container.bottom .tui-image-editor-submenu > div { + padding-bottom: 24px; +} +.tui-image-editor-container.top .color-picker-control .triangle { + top: -11px; + border-right: 12px solid transparent; + border-top: 0px; + border-left: 12px solid transparent; + border-bottom: 12px solid #fff; +} +.tui-image-editor-container.top .tui-image-editor-size-wrap { + height: calc(100% - 64px); +} +.tui-image-editor-container.top .tui-image-editor-main-container { + bottom: 0; +} +.tui-image-editor-container.top .tui-image-editor-menu > .tui-image-editor-item[title]:before { + left: 13px; + border-top: 0; + border-bottom: 7px solid #2f2f2f; + top: 33px; +} +.tui-image-editor-container.top .tui-image-editor-menu > .tui-image-editor-item[title]:after { + top: 38px; +} +.tui-image-editor-container.top .tui-image-editor-submenu { + top: 0; + bottom: inherit; +} +.tui-image-editor-container.top .tui-image-editor-submenu > div { + padding-top: 24px; + vertical-align: top; +} +.tui-image-editor-container.top .tui-image-editor-controls-logo { + display: table-cell; +} +.tui-image-editor-container.top .tui-image-editor-controls-buttons { + display: table-cell; +} +.tui-image-editor-container.top .tui-image-editor-main { + top: 64px; + height: 100%; +} +.tui-image-editor-container.top .tui-image-editor-controls { + top: 0; + bottom: inherit; +} +.tui-image-editor-container .svg_ic-menu { + width: 24px; + height: 24px; +} +.tui-image-editor-container .svg_ic-submenu { + width: 32px; + height: 32px; +} +.tui-image-editor-container .svg_img-bi { + width: 257px; + height: 26px; +} +.tui-image-editor-container .tui-image-editor-controls svg > use { + display: none; +} +.tui-image-editor-container .tui-image-editor-controls svg > use.normal { + display: block; +} +.tui-image-editor-container .tui-image-editor-controls .active svg > use.active { + display: block; +} +.tui-image-editor-container .tui-image-editor-controls .enabled svg > use.enabled { + display: block; +} +.tui-image-editor-container .tui-image-editor-controls .active svg > use.normal, +.tui-image-editor-container .tui-image-editor-controls .enabled svg > use.normal { + display: none; +} +.tui-image-editor-container div.tui-colorpicker-clearfix { + width: 159px; + height: 28px; + border: 1px solid #d5d5d5; + border-radius: 2px; + background-color: #f5f5f5; + margin-top: 6px; + padding: 4px 7px 4px 7px; +} +.tui-image-editor-container .tui-colorpicker-palette-hex { + width: 114px; + background-color: #f5f5f5; + border: 0; + font-size: 11px; + margin-top: 2px; +} +.tui-image-editor-container .tui-colorpicker-palette-preview { + border-radius: 100%; + float: left; + width: 16px; + height: 16px; +} +.tui-image-editor-container .color-picker-control { + position: absolute; + display: none; + z-index: 99; + width: 188px; + height: 112px; + background-color: #fff; + box-shadow: 0 3px 22px 0px #000; + padding: 14px; + border-radius: 2px; +} +.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-toggle-slider { + display: none; +} +.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button { + border-radius: 100%; + margin: 2px; +} +.tui-image-editor-container .color-picker-control .triangle { + width: 0; + height: 0; + border-right: 12px solid transparent; + border-top: 12px solid #fff; + border-left: 12px solid transparent; + position: absolute; + bottom: -11px; + left: 77px; +} +.tui-image-editor-container .color-picker-control .tui-colorpicker-container, +.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-container ul, +.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-container { + width: 100%; + height: auto; +} +.tui-image-editor-container .filter-color-item .color-picker-control label { + font-color: #333; + font-weight: normal; + margin-right: 7pxleft; +} +.tui-image-editor-container .color-picker { + width: 100%; + height: auto; +} +.tui-image-editor-container .color-picker-value { + width: 30px; + height: 30px; + border: 0px; + border-radius: 100%; + margin: auto; + margin-bottom: 4px; +} +.tui-image-editor-container .color-picker-value.transparent { + border: 1px solid #cbcbcb; + background-size: cover; + background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAdBJREFUWAnFl0FuwjAQRZ0ukiugHqFSOQNdseuKW3ALzkA4BateICvUGyCxrtRFd4WuunH/TzykaYJrnLEYaTJJsP2+x8GZZCbQrLU5mj7Bn+EP8HvnCObd+R7xBV5lWfaNON4AnsA38E94qLEt+0yiFaBzAV/Bv+Cxxr4co7hKCDpw1q9wLeNYYdlAwyn8TYt8Hme3+8D5ozcTaMCZ68PXa2tnM2sbEcOZAJhrrpl2DAcTOGNjZPSfCdzkw6JrfbiMv+osBe4y9WOedhm4jZfhbENWuxS44H9Wz/xw4WzqLOAqh1+zycgAwzEMzr5k5gaHOa9ULBwuuDkFlHI1Kl4PJ66kgIpnoywOTmRFAYcbwYk9UMApWkD8zAV5ihcwHk4Rx7gl0IFTQL0EFc+CTQ9OZHWH3YhlVJiVpTHbrTGLhTHLZVgff6s9lyBsI9KduSS83oj+34rTwJutmBmCnMsvozRwZqB5GTkBw6/jdPDu69iJ6BYk6eCcfbcgcQIK/MByaaiMqm8rHcjol2TnpWDhyAKSGdA3FrxtJUToX0ODqatetfGE+8tyEUOV8GY5dGRwLP/MBS4RHQr4bT7NRAQjlcOTfZxmv2G+c4hI8nn+Ax5PG/zhI393AAAAAElFTkSuQmCC"); +} +.tui-image-editor-container .color-picker-value + label { + color: #fff; +} +.tui-image-editor-container .tui-image-editor-submenu svg > use { + display: none; +} +.tui-image-editor-container .tui-image-editor-submenu svg > use.normal { + display: block; +} +#tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype="icon-bubble"] svg > use.active, +#tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype="icon-heart"] svg > use.active, +#tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype="icon-location"] svg > use.active, +#tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype="icon-polygon"] svg > use.active, +#tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype="icon-star"] svg > use.active, +#tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype="icon-arrow-3"] svg > use.active, +#tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype="icon-arrow-2"] svg > use.active, +#tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype="icon-arrow"] svg > use.active { + display: block; +} +#tie-draw-line-select-button.line .tui-image-editor-button.line svg > use.normal, +#tie-draw-line-select-button.free .tui-image-editor-button.free svg > use.normal { + display: none; +} +#tie-draw-line-select-button.line .tui-image-editor-button.line svg > use.active, +#tie-draw-line-select-button.free .tui-image-editor-button.free svg > use.active { + display: block; +} +#tie-flip-button.resetFlip .tui-image-editor-button.resetFlip svg > use.normal, +#tie-flip-button.flipX .tui-image-editor-button.flipX svg > use.normal, +#tie-flip-button.flipY .tui-image-editor-button.flipY svg > use.normal { + display: none; +} +#tie-flip-button.resetFlip .tui-image-editor-button.resetFlip svg > use.active, +#tie-flip-button.flipX .tui-image-editor-button.flipX svg > use.active, +#tie-flip-button.flipY .tui-image-editor-button.flipY svg > use.active { + display: block; +} +#tie-mask-apply.apply.active .tui-image-editor-button.apply label { + color: #fff; +} +#tie-mask-apply.apply.active .tui-image-editor-button.apply svg > use.active { + display: block; +} +#tie-crop-button .tui-image-editor-button.apply { + margin-right: 24px; +} +#tie-crop-button .tui-image-editor-button.apply.active svg > use.active { + display: block; +} +#tie-shape-button.rect .tui-image-editor-button.rect svg > use.normal, +#tie-shape-button.circle .tui-image-editor-button.circle svg > use.normal, +#tie-shape-button.triangle .tui-image-editor-button.triangle svg > use.normal { + display: none; +} +#tie-shape-button.rect .tui-image-editor-button.rect svg > use.active, +#tie-shape-button.circle .tui-image-editor-button.circle svg > use.active, +#tie-shape-button.triangle .tui-image-editor-button.triangle svg > use.active { + display: block; +} +#tie-text-effect-button .tui-image-editor-button.active svg > use.active { + display: block; +} +#tie-text-align-button.left .tui-image-editor-button.left svg > use.active, +#tie-text-align-button.center .tui-image-editor-button.center svg > use.active, +#tie-text-align-button.right .tui-image-editor-button.right svg > use.active { + display: block; +} +#tie-mask-image-file, +#tie-icon-image-file { + opacity: 0; + position: absolute; + width: 100%; + height: 100%; + border: 1px solid #008000; + cursor: inherit; + left: 0; + top: 0; +} +.tui-image-editor-container.top.tui-image-editor-top-optimization .tui-image-editor-controls ul { + text-align: right; +} +.tui-image-editor-container.top.tui-image-editor-top-optimization .tui-image-editor-controls-logo { + display: none; +} diff --git a/dist/tui-image-editor.js b/dist/tui-image-editor.js index fd19b23c2..ee8459b5a 100644 --- a/dist/tui-image-editor.js +++ b/dist/tui-image-editor.js @@ -1,6 +1,6 @@ /*! * tui-image-editor.js - * @version 3.1.0 + * @version 3.2.0 * @author NHNEnt FE Development Lab * @license MIT */ @@ -13,7 +13,7 @@ exports["ImageEditor"] = factory(require("tui-code-snippet"), require("fabric/dist/fabric.require")); else root["tui"] = root["tui"] || {}, root["tui"]["ImageEditor"] = factory((root["tui"] && root["tui"]["util"]), root["fabric"]); -})(this, function(__WEBPACK_EXTERNAL_MODULE_2__, __WEBPACK_EXTERNAL_MODULE_74__) { +})(this, function(__WEBPACK_EXTERNAL_MODULE_3__, __WEBPACK_EXTERNAL_MODULE_105__) { return /******/ (function(modules) { // webpackBootstrap /******/ // The module cache /******/ var installedModules = {}; @@ -62,47 +62,51 @@ return /******/ (function(modules) { // webpackBootstrap 'use strict'; - var _imageEditor = __webpack_require__(1); + __webpack_require__(1); + + var _imageEditor = __webpack_require__(2); var _imageEditor2 = _interopRequireDefault(_imageEditor); - __webpack_require__(99); + __webpack_require__(130); + + __webpack_require__(132); - __webpack_require__(100); + __webpack_require__(133); - __webpack_require__(101); + __webpack_require__(134); - __webpack_require__(102); + __webpack_require__(135); - __webpack_require__(103); + __webpack_require__(136); - __webpack_require__(104); + __webpack_require__(137); - __webpack_require__(105); + __webpack_require__(138); - __webpack_require__(106); + __webpack_require__(139); - __webpack_require__(107); + __webpack_require__(140); - __webpack_require__(108); + __webpack_require__(141); - __webpack_require__(109); + __webpack_require__(142); - __webpack_require__(110); + __webpack_require__(143); - __webpack_require__(111); + __webpack_require__(144); - __webpack_require__(112); + __webpack_require__(145); - __webpack_require__(113); + __webpack_require__(146); - __webpack_require__(114); + __webpack_require__(147); - __webpack_require__(115); + __webpack_require__(148); - __webpack_require__(116); + __webpack_require__(149); - __webpack_require__(117); + __webpack_require__(150); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } @@ -112,6 +116,473 @@ return /******/ (function(modules) { // webpackBootstrap /***/ }), /* 1 */ +/***/ (function(module, exports) { + + "use strict"; + + // https://developer.mozilla.org/en-US/docs/Web/API/Element/closest + // Any copyright is dedicated to the Public Domain. http://creativecommons.org/publicdomain/zero/1.0/if (!Element.prototype.matches) + Element.prototype.matches = Element.prototype.msMatchesSelector || Element.prototype.webkitMatchesSelector; + + if (!Element.prototype.closest) Element.prototype.closest = function (s) { + var el = this; + if (!document.documentElement.contains(el)) return null; + do { + if (el.matches(s)) return el; + el = el.parentElement || el.parentNode; + } while (el !== null && el.nodeType === 1); + return null; + }; + + /* + * classList.js: Cross-browser full element.classList implementation. + * 1.1.20170427 + * + * By Eli Grey, http://eligrey.com + * License: Dedicated to the public domain. + * See https://github.com/eligrey/classList.js/blob/master/LICENSE.md + */ + + /*global self, document, DOMException */ + + /*! @source http://purl.eligrey.com/github/classList.js/blob/master/classList.js */ + + if ("document" in window.self) { + + // Full polyfill for browsers with no classList support + // Including IE < Edge missing SVGElement.classList + if (!("classList" in document.createElement("_")) || document.createElementNS && !("classList" in document.createElementNS("http://www.w3.org/2000/svg", "g"))) { + + (function (view) { + + "use strict"; + + if (!('Element' in view)) return; + + var classListProp = "classList", + protoProp = "prototype", + elemCtrProto = view.Element[protoProp], + objCtr = Object, + strTrim = String[protoProp].trim || function () { + return this.replace(/^\s+|\s+$/g, ""); + }, + arrIndexOf = Array[protoProp].indexOf || function (item) { + var i = 0, + len = this.length; + for (; i < len; i++) { + if (i in this && this[i] === item) { + return i; + } + } + return -1; + } + // Vendors: please allow content code to instantiate DOMExceptions + , + DOMEx = function DOMEx(type, message) { + this.name = type; + this.code = DOMException[type]; + this.message = message; + }, + checkTokenAndGetIndex = function checkTokenAndGetIndex(classList, token) { + if (token === "") { + throw new DOMEx("SYNTAX_ERR", "An invalid or illegal string was specified"); + } + if (/\s/.test(token)) { + throw new DOMEx("INVALID_CHARACTER_ERR", "String contains an invalid character"); + } + return arrIndexOf.call(classList, token); + }, + ClassList = function ClassList(elem) { + var trimmedClasses = strTrim.call(elem.getAttribute("class") || ""), + classes = trimmedClasses ? trimmedClasses.split(/\s+/) : [], + i = 0, + len = classes.length; + for (; i < len; i++) { + this.push(classes[i]); + } + this._updateClassName = function () { + elem.setAttribute("class", this.toString()); + }; + }, + classListProto = ClassList[protoProp] = [], + classListGetter = function classListGetter() { + return new ClassList(this); + }; + // Most DOMException implementations don't allow calling DOMException's toString() + // on non-DOMExceptions. Error's toString() is sufficient here. + DOMEx[protoProp] = Error[protoProp]; + classListProto.item = function (i) { + return this[i] || null; + }; + classListProto.contains = function (token) { + token += ""; + return checkTokenAndGetIndex(this, token) !== -1; + }; + classListProto.add = function () { + var tokens = arguments, + i = 0, + l = tokens.length, + token, + updated = false; + do { + token = tokens[i] + ""; + if (checkTokenAndGetIndex(this, token) === -1) { + this.push(token); + updated = true; + } + } while (++i < l); + + if (updated) { + this._updateClassName(); + } + }; + classListProto.remove = function () { + var tokens = arguments, + i = 0, + l = tokens.length, + token, + updated = false, + index; + do { + token = tokens[i] + ""; + index = checkTokenAndGetIndex(this, token); + while (index !== -1) { + this.splice(index, 1); + updated = true; + index = checkTokenAndGetIndex(this, token); + } + } while (++i < l); + + if (updated) { + this._updateClassName(); + } + }; + classListProto.toggle = function (token, force) { + token += ""; + + var result = this.contains(token), + method = result ? force !== true && "remove" : force !== false && "add"; + + if (method) { + this[method](token); + } + + if (force === true || force === false) { + return force; + } else { + return !result; + } + }; + classListProto.toString = function () { + return this.join(" "); + }; + + if (objCtr.defineProperty) { + var classListPropDesc = { + get: classListGetter, + enumerable: true, + configurable: true + }; + try { + objCtr.defineProperty(elemCtrProto, classListProp, classListPropDesc); + } catch (ex) { + // IE 8 doesn't support enumerable:true + // adding undefined to fight this issue https://github.com/eligrey/classList.js/issues/36 + // modernie IE8-MSW7 machine has IE8 8.0.6001.18702 and is affected + if (ex.number === undefined || ex.number === -0x7FF5EC54) { + classListPropDesc.enumerable = false; + objCtr.defineProperty(elemCtrProto, classListProp, classListPropDesc); + } + } + } else if (objCtr[protoProp].__defineGetter__) { + elemCtrProto.__defineGetter__(classListProp, classListGetter); + } + })(window.self); + } + + // There is full or partial native classList support, so just check if we need + // to normalize the add/remove and toggle APIs. + + (function () { + "use strict"; + + var testElement = document.createElement("_"); + + testElement.classList.add("c1", "c2"); + + // Polyfill for IE 10/11 and Firefox <26, where classList.add and + // classList.remove exist but support only one argument at a time. + if (!testElement.classList.contains("c2")) { + var createMethod = function createMethod(method) { + var original = DOMTokenList.prototype[method]; + + DOMTokenList.prototype[method] = function (token) { + var i, + len = arguments.length; + + for (i = 0; i < len; i++) { + token = arguments[i]; + original.call(this, token); + } + }; + }; + createMethod('add'); + createMethod('remove'); + } + + testElement.classList.toggle("c3", false); + + // Polyfill for IE 10 and Firefox <24, where classList.toggle does not + // support the second argument. + if (testElement.classList.contains("c3")) { + var _toggle = DOMTokenList.prototype.toggle; + + DOMTokenList.prototype.toggle = function (token, force) { + if (1 in arguments && !this.contains(token) === !force) { + return force; + } else { + return _toggle.call(this, token); + } + }; + } + + testElement = null; + })(); + } + + /*! + * @copyright Copyright (c) 2017 IcoMoon.io + * @license Licensed under MIT license + * See https://github.com/Keyamoon/svgxuse + * @version 1.2.6 + */ + /*jslint browser: true */ + /*global XDomainRequest, MutationObserver, window */ + (function () { + "use strict"; + + if (typeof window !== "undefined" && window.addEventListener) { + var cache = Object.create(null); // holds xhr objects to prevent multiple requests + var checkUseElems; + var tid; // timeout id + var debouncedCheck = function debouncedCheck() { + clearTimeout(tid); + tid = setTimeout(checkUseElems, 100); + }; + var unobserveChanges = function unobserveChanges() { + return; + }; + var observeChanges = function observeChanges() { + var observer; + window.addEventListener("resize", debouncedCheck, false); + window.addEventListener("orientationchange", debouncedCheck, false); + if (window.MutationObserver) { + observer = new MutationObserver(debouncedCheck); + observer.observe(document.documentElement, { + childList: true, + subtree: true, + attributes: true + }); + unobserveChanges = function unobserveChanges() { + try { + observer.disconnect(); + window.removeEventListener("resize", debouncedCheck, false); + window.removeEventListener("orientationchange", debouncedCheck, false); + } catch (ignore) {} + }; + } else { + document.documentElement.addEventListener("DOMSubtreeModified", debouncedCheck, false); + unobserveChanges = function unobserveChanges() { + document.documentElement.removeEventListener("DOMSubtreeModified", debouncedCheck, false); + window.removeEventListener("resize", debouncedCheck, false); + window.removeEventListener("orientationchange", debouncedCheck, false); + }; + } + }; + var createRequest = function createRequest(url) { + // In IE 9, cross origin requests can only be sent using XDomainRequest. + // XDomainRequest would fail if CORS headers are not set. + // Therefore, XDomainRequest should only be used with cross origin requests. + function getOrigin(loc) { + var a; + if (loc.protocol !== undefined) { + a = loc; + } else { + a = document.createElement("a"); + a.href = loc; + } + return a.protocol.replace(/:/g, "") + a.host; + } + var Request; + var origin; + var origin2; + if (window.XMLHttpRequest) { + Request = new XMLHttpRequest(); + origin = getOrigin(location); + origin2 = getOrigin(url); + if (Request.withCredentials === undefined && origin2 !== "" && origin2 !== origin) { + Request = XDomainRequest || undefined; + } else { + Request = XMLHttpRequest; + } + } + return Request; + }; + var xlinkNS = "http://www.w3.org/1999/xlink"; + checkUseElems = function checkUseElems() { + var base; + var bcr; + var fallback = ""; // optional fallback URL in case no base path to SVG file was given and no symbol definition was found. + var hash; + var href; + var i; + var inProgressCount = 0; + var isHidden; + var Request; + var url; + var uses; + var xhr; + function observeIfDone() { + // If done with making changes, start watching for chagnes in DOM again + inProgressCount -= 1; + if (inProgressCount === 0) { + // if all xhrs were resolved + unobserveChanges(); // make sure to remove old handlers + observeChanges(); // watch for changes to DOM + } + } + function attrUpdateFunc(spec) { + return function () { + if (cache[spec.base] !== true) { + spec.useEl.setAttributeNS(xlinkNS, "xlink:href", "#" + spec.hash); + if (spec.useEl.hasAttribute("href")) { + spec.useEl.setAttribute("href", "#" + spec.hash); + } + } + }; + } + function onloadFunc(xhr) { + return function () { + var body = document.body; + var x = document.createElement("x"); + var svg; + xhr.onload = null; + x.innerHTML = xhr.responseText; + svg = x.getElementsByTagName("svg")[0]; + if (svg) { + svg.setAttribute("aria-hidden", "true"); + svg.style.position = "absolute"; + svg.style.width = 0; + svg.style.height = 0; + svg.style.overflow = "hidden"; + body.insertBefore(svg, body.firstChild); + } + observeIfDone(); + }; + } + function onErrorTimeout(xhr) { + return function () { + xhr.onerror = null; + xhr.ontimeout = null; + observeIfDone(); + }; + } + unobserveChanges(); // stop watching for changes to DOM + // find all use elements + uses = document.getElementsByTagName("use"); + for (i = 0; i < uses.length; i += 1) { + try { + bcr = uses[i].getBoundingClientRect(); + } catch (ignore) { + // failed to get bounding rectangle of the use element + bcr = false; + } + href = uses[i].getAttribute("href") || uses[i].getAttributeNS(xlinkNS, "href") || uses[i].getAttribute("xlink:href"); + if (href && href.split) { + url = href.split("#"); + } else { + url = ["", ""]; + } + base = url[0]; + hash = url[1]; + isHidden = bcr && bcr.left === 0 && bcr.right === 0 && bcr.top === 0 && bcr.bottom === 0; + if (bcr && bcr.width === 0 && bcr.height === 0 && !isHidden) { + // the use element is empty + // if there is a reference to an external SVG, try to fetch it + // use the optional fallback URL if there is no reference to an external SVG + if (fallback && !base.length && hash && !document.getElementById(hash)) { + base = fallback; + } + if (uses[i].hasAttribute("href")) { + uses[i].setAttributeNS(xlinkNS, "xlink:href", href); + } + if (base.length) { + // schedule updating xlink:href + xhr = cache[base]; + if (xhr !== true) { + // true signifies that prepending the SVG was not required + setTimeout(attrUpdateFunc({ + useEl: uses[i], + base: base, + hash: hash + }), 0); + } + if (xhr === undefined) { + Request = createRequest(base); + if (Request !== undefined) { + xhr = new Request(); + cache[base] = xhr; + xhr.onload = onloadFunc(xhr); + xhr.onerror = onErrorTimeout(xhr); + xhr.ontimeout = onErrorTimeout(xhr); + xhr.open("GET", base); + xhr.send(); + inProgressCount += 1; + } + } + } + } else { + if (!isHidden) { + if (cache[base] === undefined) { + // remember this URL if the use element was not empty and no request was sent + cache[base] = true; + } else if (cache[base].onload) { + // if it turns out that prepending the SVG is not necessary, + // abort the in-progress xhr. + cache[base].abort(); + delete cache[base].onload; + cache[base] = true; + } + } else if (base.length && cache[base]) { + setTimeout(attrUpdateFunc({ + useEl: uses[i], + base: base, + hash: hash + }), 0); + } + } + } + uses = ""; + inProgressCount += 1; + observeIfDone(); + }; + var _winLoad; + _winLoad = function winLoad() { + window.removeEventListener("load", _winLoad, false); // to prevent memory leaks + tid = setTimeout(checkUseElems, 0); + }; + if (document.readyState !== "complete") { + // The load event fires when all resources have finished loading, which allows detecting whether SVG use elements are empty. + window.addEventListener("load", _winLoad, false); + } else { + // No need to add a listener if the document is already loaded, initialize immediately. + _winLoad(); + } + } + })(); + +/***/ }), +/* 2 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -122,27 +593,39 @@ return /******/ (function(modules) { // webpackBootstrap */ - var _tuiCodeSnippet = __webpack_require__(2); + var _tuiCodeSnippet = __webpack_require__(3); var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); - var _invoker2 = __webpack_require__(3); + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _invoker2 = __webpack_require__(68); var _invoker3 = _interopRequireDefault(_invoker2); - var _command = __webpack_require__(68); + var _ui = __webpack_require__(74); + + var _ui2 = _interopRequireDefault(_ui); + + var _action = __webpack_require__(102); + + var _action2 = _interopRequireDefault(_action); + + var _command = __webpack_require__(69); var _command2 = _interopRequireDefault(_command); - var _graphics = __webpack_require__(73); + var _graphics = __webpack_require__(104); var _graphics2 = _interopRequireDefault(_graphics); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); - var _util = __webpack_require__(71); + var _util = __webpack_require__(72); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } @@ -160,19 +643,62 @@ return /******/ (function(modules) { // webpackBootstrap * Image editor * @class * @param {string|jQuery|HTMLElement} wrapper - Wrapper's element or selector - * @param {Object} [option] - Canvas max width & height of css - * @param {number} option.cssMaxWidth - Canvas css-max-width - * @param {number} option.cssMaxHeight - Canvas css-max-height - * @param {Boolean} [option.usageStatistics=true] - Let us know the hostname. If you don't want to send the hostname, please set to false. + * @param {Object} [options] - Canvas max width & height of css + * @param {number} [options.includeUI] - Use the provided UI + * @param {Object} [options.includeUI.loadImage] - Basic editing image + * @param {string} options.includeUI.loadImage.path - image path + * @param {string} options.includeUI.loadImage.name - image name + * @param {Object} [options.includeUI.theme] - Theme object + * @param {Array} [options.includeUI.menu] - It can be selected when only specific menu is used. [default all] + * @param {string} [options.includeUI.initMenu] - The first menu to be selected and started. + * @param {string} [options.includeUI.menuBarPosition=bottom] - Menu bar position [top | bottom | left | right] + * @param {number} options.cssMaxWidth - Canvas css-max-width + * @param {number} options.cssMaxHeight - Canvas css-max-height + * @param {Boolean} [options.usageStatistics=true] - Let us know the hostname. If you don't want to send the hostname, please set to false. + * @example + * var ImageEditor = require('tui-image-editor'); + * var blackTheme = require('./js/theme/black-theme.js'); + * var instance = new ImageEditor(document.querySelector('#tui-image-editor'), { + * includeUI: { + * loadImage: { + * path: 'img/sampleImage.jpg', + * name: 'SampleImage' + * }, + * theme: blackTheme, // or whiteTheme + * menu: ['shape', 'filter'], + * initMenu: 'filter', + * menuBarPosition: 'bottom' + * }, + * cssMaxWidth: 700, + * cssMaxHeight: 500, + * selectionStyle: { + * cornerSize: 20, + * rotatingPointOffset: 70 + * } + * }); */ var ImageEditor = function () { - function ImageEditor(wrapper, option) { + function ImageEditor(wrapper, options) { _classCallCheck(this, ImageEditor); - option = _tuiCodeSnippet2.default.extend({ + options = _tuiCodeSnippet2.default.extend({ + includeUI: false, usageStatistics: true - }, option); + }, options); + + this.mode = null; + + this.activeObjectId = null; + + /** + * UI instance + * @type {Ui} + */ + if (options.includeUI) { + this.ui = new _ui2.default(wrapper, options.includeUI, this.getActions()); + options = this.ui.setUiDefaultSelectionStyle(options); + } /** * Invoker @@ -186,7 +712,12 @@ return /******/ (function(modules) { // webpackBootstrap * @type {Graphics} * @private */ - this._graphics = new _graphics2.default(wrapper, option.cssMaxWidth, option.cssMaxHeight); + this._graphics = new _graphics2.default(this.ui ? this.ui.getEditorArea() : wrapper, { + cssMaxWidth: options.cssMaxWidth, + cssMaxHeight: options.cssMaxHeight, + useItext: !!this.ui, + useDragAddIcon: !!this.ui + }); /** * Event handler list @@ -202,20 +733,30 @@ return /******/ (function(modules) { // webpackBootstrap createdPath: this._onCreatedPath, addText: this._onAddText.bind(this), addObject: this._onAddObject.bind(this), + addObjectAfter: this._onAddObjectAfter.bind(this), textEditing: this._onTextEditing.bind(this), - textChanged: this._onTextChanged.bind(this) + textChanged: this._onTextChanged.bind(this), + iconCreateResize: this._onIconCreateResize.bind(this), + iconCreateEnd: this._onIconCreateEnd.bind(this), + selectionCleared: this._selectionCleared.bind(this), + selectionCreated: this._selectionCreated.bind(this) }; this._attachInvokerEvents(); this._attachGraphicsEvents(); this._attachDomEvents(); + this._setSelectionStyle(options.selectionStyle, { + applyCropSelectionStyle: options.applyCropSelectionStyle, + applyGroupSelectionStyle: options.applyGroupSelectionStyle + }); - if (option.selectionStyle) { - this._setSelectionStyle(option.selectionStyle); + if (options.usageStatistics) { + (0, _util.sendHostName)(); } - if (option.usageStatistics) { - (0, _util.sendHostName)(); + if (this.ui) { + this.ui.initCanvas(); + this.setReAction(); } } @@ -233,7 +774,6 @@ return /******/ (function(modules) { // webpackBootstrap * @property {boolean} flipY - y axis * @property {Number} angle - angle */ - /** * Rotation status * @typedef {Number} RotateStatus @@ -275,15 +815,35 @@ return /******/ (function(modules) { // webpackBootstrap /** * Set selection style by init option - * @param {Object} styles - Selection styles + * @param {Object} selectionStyle - Selection styles + * @param {Object} applyTargets - Selection apply targets + * @param {boolean} applyCropSelectionStyle - whether apply with crop selection style or not + * @param {boolean} applyGroupSelectionStyle - whether apply with group selection style or not * @private */ _createClass(ImageEditor, [{ key: '_setSelectionStyle', - value: function _setSelectionStyle(styles) { - this._graphics.setSelectionStyle(styles); + value: function _setSelectionStyle(selectionStyle, _ref) { + var applyCropSelectionStyle = _ref.applyCropSelectionStyle, + applyGroupSelectionStyle = _ref.applyGroupSelectionStyle; + + if (selectionStyle) { + this._graphics.setSelectionStyle(selectionStyle); + } + + if (applyCropSelectionStyle) { + this._graphics.setCropSelectionStyle(selectionStyle); + } + + if (applyGroupSelectionStyle) { + this.on('selectionCreated', function (eventTarget) { + if (eventTarget.type === 'group') { + eventTarget.set(selectionStyle); + } + }); + } } /** @@ -336,7 +896,12 @@ return /******/ (function(modules) { // webpackBootstrap 'addText': this._handlers.addText, 'addObject': this._handlers.addObject, 'textEditing': this._handlers.textEditing, - 'textChanged': this._handlers.textChanged + 'textChanged': this._handlers.textChanged, + 'iconCreateResize': this._handlers.iconCreateResize, + 'iconCreateEnd': this._handlers.iconCreateEnd, + 'selectionCleared': this._handlers.selectionCleared, + 'selectionCreated': this._handlers.selectionCreated, + 'addObjectAfter': this._handlers.addObjectAfter }); } @@ -374,9 +939,6 @@ return /******/ (function(modules) { // webpackBootstrap }, { key: '_onKeyDown', value: function _onKeyDown(e) { - var activeObject = this._graphics.getActiveObject(); - var activeObjectId = this._graphics.getObjectId(activeObject); - if ((e.ctrlKey || e.metaKey) && e.keyCode === keyCodes.Z) { // There is no error message on shortcut when it's empty this.undo()['catch'](function () {}); @@ -387,13 +949,56 @@ return /******/ (function(modules) { // webpackBootstrap this.redo()['catch'](function () {}); } - if ((e.keyCode === keyCodes.BACKSPACE || e.keyCode === keyCodes.DEL) && activeObject) { + if (e.keyCode === keyCodes.BACKSPACE || e.keyCode === keyCodes.DEL) { e.preventDefault(); - this.removeObject(activeObjectId); + this.removeActiveObject(); } } /* eslint-enable complexity */ + /** + * Remove Active Object + */ + + }, { + key: 'removeActiveObject', + value: function removeActiveObject() { + var activeObject = this._graphics.getActiveObject(); + var activeObjectGroup = this._graphics.getActiveGroupObject(); + + if (activeObjectGroup) { + var objects = activeObjectGroup.getObjects(); + this.discardSelection(); + this._removeObjectStream(objects); + } else if (activeObject) { + var activeObjectId = this._graphics.getObjectId(activeObject); + this.removeObject(activeObjectId); + } + } + + /** + * RemoveObject Sequential processing for prevent invoke lock + * @param {Array.} targetObjects - target Objects for remove + * @returns {object} targetObjects + * @private + */ + + }, { + key: '_removeObjectStream', + value: function _removeObjectStream(targetObjects) { + var _this = this; + + if (!targetObjects.length) { + return true; + } + + var targetObject = targetObjects.pop(); + + return this.removeObject(this._graphics.getObjectId(targetObject)).then(function () { + return _this._removeObjectStream(targetObjects); + }); + } + /** * mouse down event handler * @param {Event} event mouse down event @@ -557,6 +1162,31 @@ return /******/ (function(modules) { // webpackBootstrap this._graphics.renderAll(); } + /** + * discard selction + * @example + * imageEditor.discardSelection(); + */ + + }, { + key: 'discardSelection', + value: function discardSelection() { + this._graphics.discardSelection(); + } + + /** + * selectable status change + * @param {boolean} selectable - selctable status + * @example + * imageEditor.changeSelectableAll(false); // or true + */ + + }, { + key: 'changeSelectableAll', + value: function changeSelectableAll(selectable) { + this._graphics.changeSelectableAll(selectable); + } + /** * Invoke command * @param {String} commandName - Command name @@ -622,7 +1252,7 @@ return /******/ (function(modules) { // webpackBootstrap key: 'loadImageFromFile', value: function loadImageFromFile(imgFile, imageName) { if (!imgFile) { - return Promise.reject(rejectMessages.invalidParameters); + return _promise2.default.reject(rejectMessages.invalidParameters); } var imgUrl = URL.createObjectURL(imgFile); @@ -651,7 +1281,7 @@ return /******/ (function(modules) { // webpackBootstrap key: 'loadImageFromURL', value: function loadImageFromURL(url, imageName) { if (!imageName || !url) { - return Promise.reject(rejectMessages.invalidParameters); + return _promise2.default.reject(rejectMessages.invalidParameters); } return this.execute(commands.LOAD_IMAGE, imageName, url); @@ -671,7 +1301,7 @@ return /******/ (function(modules) { // webpackBootstrap key: 'addImageObject', value: function addImageObject(imgUrl) { if (!imgUrl) { - return Promise.reject(rejectMessages.invalidParameters); + return _promise2.default.reject(rejectMessages.invalidParameters); } return this.execute(commands.ADD_IMAGE_OBJECT, imgUrl); @@ -726,7 +1356,7 @@ return /******/ (function(modules) { // webpackBootstrap value: function crop(rect) { var data = this._graphics.getCroppedImageData(rect); if (!data) { - return Promise.reject(rejectMessages.invalidParameters); + return _promise2.default.reject(rejectMessages.invalidParameters); } return this.loadImageFromURL(data.url, data.imageName); @@ -1112,6 +1742,20 @@ return /******/ (function(modules) { // webpackBootstrap return this.execute(commands.CHANGE_TEXT_STYLE, id, styleObj); } + /** + * change text mode + * @param {string} type - change type + * @private + */ + + }, { + key: '_changeActivateMode', + value: function _changeActivateMode(type) { + if (type !== 'ICON' && this.getDrawingMode() !== type) { + this.startDrawingMode(type); + } + } + /** * 'textChanged' event handler * @param {Object} objectProps changed object properties @@ -1124,6 +1768,34 @@ return /******/ (function(modules) { // webpackBootstrap this.changeText(objectProps.id, objectProps.text); } + /** + * 'iconCreateResize' event handler + * @param {Object} originPointer origin pointer + * @param {Number} originPointer.x x position + * @param {Number} originPointer.y y position + * @private + */ + + }, { + key: '_onIconCreateResize', + value: function _onIconCreateResize(originPointer) { + this.fire(events.ICON_CREATE_RESIZE, originPointer); + } + + /** + * 'iconCreateEnd' event handler + * @param {Object} originPointer origin pointer + * @param {Number} originPointer.x x position + * @param {Number} originPointer.y y position + * @private + */ + + }, { + key: '_onIconCreateEnd', + value: function _onIconCreateEnd(originPointer) { + this.fire(events.ICON_CREATE_END, originPointer); + } + /** * 'textEditing' event handler * @private @@ -1190,6 +1862,41 @@ return /******/ (function(modules) { // webpackBootstrap this._pushAddObjectCommand(obj); } + /** + * 'addObjectAfter' event handler + * @param {Object} objectProps added object properties + * @private + */ + + }, { + key: '_onAddObjectAfter', + value: function _onAddObjectAfter(objectProps) { + this.fire(events.ADD_OBJECT_AFTER, objectProps); + } + + /** + * 'selectionCleared' event handler + * @private + */ + + }, { + key: '_selectionCleared', + value: function _selectionCleared() { + this.fire(events.SELECTION_CLEARED); + } + + /** + * 'selectionCreated' event handler + * @param {Object} eventTarget - Fabric object + * @private + */ + + }, { + key: '_selectionCreated', + value: function _selectionCreated(eventTarget) { + this.fire(events.SELECTION_CREATED, eventTarget); + } + /** * Register custom icons * @param {{iconType: string, pathValue: string}} infos - Infos to register icons @@ -1206,6 +1913,19 @@ return /******/ (function(modules) { // webpackBootstrap this._graphics.registerPaths(infos); } + /** + * Change canvas cursor type + * @param {string} cursorType - cursor type + * @example + * imageEditor.changeCursor('crosshair'); + */ + + }, { + key: 'changeCursor', + value: function changeCursor(cursorType) { + this._graphics.changeCursor(cursorType); + } + /** * Add icon on canvas * @param {string} type - Icon type ('arrow', 'cancel', custom icon name) @@ -1407,7 +2127,7 @@ return /******/ (function(modules) { // webpackBootstrap key: 'resizeCanvasDimension', value: function resizeCanvasDimension(dimension) { if (!dimension) { - return Promise.reject(rejectMessages.invalidParameters); + return _promise2.default.reject(rejectMessages.invalidParameters); } return this.execute(commands.RESIZE_CANVAS_DIMENSION, dimension); @@ -1420,7 +2140,7 @@ return /******/ (function(modules) { // webpackBootstrap }, { key: 'destroy', value: function destroy() { - var _this = this; + var _this2 = this; this.stopDrawingMode(); this._detachDomEvents(); @@ -1428,7 +2148,7 @@ return /******/ (function(modules) { // webpackBootstrap this._graphics = null; forEach(this, function (value, key) { - _this[key] = null; + _this2[key] = null; }, this); } @@ -1474,18 +2194,38 @@ return /******/ (function(modules) { // webpackBootstrap } /** - * Get properties of active object corresponding key + * Set properties of active object, Do not leave an invoke history. * @param {number} id - object id - * @param {Array|ObjectProps|string} keys - property's key - * @returns {ObjectProps} properties if id is valid or null - * @example - * var props = imageEditor.getObjectProperties(id, 'left'); - * console.log(props); - * @example - * var props = imageEditor.getObjectProperties(id, ['left', 'top', 'width', 'height']); - * console.log(props); + * @param {Object} keyValue - key & value * @example - * var props = imageEditor.getObjectProperties(id, { + * imageEditor.setObjectPropertiesQuietly(id, { + * left:100, + * top:100, + * width: 200, + * height: 200, + * opacity: 0.5 + * }); + */ + + }, { + key: 'setObjectPropertiesQuietly', + value: function setObjectPropertiesQuietly(id, keyValue) { + this._graphics.setObjectProperties(id, keyValue); + } + + /** + * Get properties of active object corresponding key + * @param {number} id - object id + * @param {Array|ObjectProps|string} keys - property's key + * @returns {ObjectProps} properties if id is valid or null + * @example + * var props = imageEditor.getObjectProperties(id, 'left'); + * console.log(props); + * @example + * var props = imageEditor.getObjectProperties(id, ['left', 'top', 'width', 'height']); + * console.log(props); + * @example + * var props = imageEditor.getObjectProperties(id, { * left: null, * top: null, * width: null, @@ -1594,1095 +2334,730 @@ return /******/ (function(modules) { // webpackBootstrap return ImageEditor; }(); + _action2.default.mixin(ImageEditor); CustomEvents.mixin(ImageEditor); + module.exports = ImageEditor; /***/ }), -/* 2 */ +/* 3 */ /***/ (function(module, exports) { - module.exports = __WEBPACK_EXTERNAL_MODULE_2__; + module.exports = __WEBPACK_EXTERNAL_MODULE_3__; /***/ }), -/* 3 */ +/* 4 */ /***/ (function(module, exports, __webpack_require__) { - 'use strict'; - - var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); /** - * @author NHN Ent. FE Development Team - * @fileoverview Invoker - invoke commands - */ - - - var _tuiCodeSnippet = __webpack_require__(2); + __webpack_require__(5); + __webpack_require__(6); + __webpack_require__(50); + __webpack_require__(54); + module.exports = __webpack_require__(14).Promise; - var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); +/***/ }), +/* 5 */ +/***/ (function(module, exports) { - var _promise = __webpack_require__(4); + - var _promise2 = _interopRequireDefault(_promise); +/***/ }), +/* 6 */ +/***/ (function(module, exports, __webpack_require__) { - var _command = __webpack_require__(68); + 'use strict'; + var $at = __webpack_require__(7)(true); - var _command2 = _interopRequireDefault(_command); + // 21.1.3.27 String.prototype[@@iterator]() + __webpack_require__(10)(String, 'String', function(iterated){ + this._t = String(iterated); // target + this._i = 0; // next index + // 21.1.5.2.1 %StringIteratorPrototype%.next() + }, function(){ + var O = this._t + , index = this._i + , point; + if(index >= O.length)return {value: undefined, done: true}; + point = $at(O, index); + this._i += point.length; + return {value: point, done: false}; + }); - var _consts = __webpack_require__(72); +/***/ }), +/* 7 */ +/***/ (function(module, exports, __webpack_require__) { - var _consts2 = _interopRequireDefault(_consts); + var toInteger = __webpack_require__(8) + , defined = __webpack_require__(9); + // true -> String#at + // false -> String#codePointAt + module.exports = function(TO_STRING){ + return function(that, pos){ + var s = String(defined(that)) + , i = toInteger(pos) + , l = s.length + , a, b; + if(i < 0 || i >= l)return TO_STRING ? '' : undefined; + a = s.charCodeAt(i); + return a < 0xd800 || a > 0xdbff || i + 1 === l || (b = s.charCodeAt(i + 1)) < 0xdc00 || b > 0xdfff + ? TO_STRING ? s.charAt(i) : a + : TO_STRING ? s.slice(i, i + 2) : (a - 0xd800 << 10) + (b - 0xdc00) + 0x10000; + }; + }; - function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } +/***/ }), +/* 8 */ +/***/ (function(module, exports) { - function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + // 7.1.4 ToInteger + var ceil = Math.ceil + , floor = Math.floor; + module.exports = function(it){ + return isNaN(it = +it) ? 0 : (it > 0 ? floor : ceil)(it); + }; - var eventNames = _consts2.default.eventNames, - rejectMessages = _consts2.default.rejectMessages; - var isFunction = _tuiCodeSnippet2.default.isFunction, - isString = _tuiCodeSnippet2.default.isString, - CustomEvents = _tuiCodeSnippet2.default.CustomEvents; +/***/ }), +/* 9 */ +/***/ (function(module, exports) { - /** - * Invoker - * @class - * @ignore - */ + // 7.2.1 RequireObjectCoercible(argument) + module.exports = function(it){ + if(it == undefined)throw TypeError("Can't call method on " + it); + return it; + }; - var Invoker = function () { - function Invoker() { - _classCallCheck(this, Invoker); +/***/ }), +/* 10 */ +/***/ (function(module, exports, __webpack_require__) { - /** - * Undo stack - * @type {Array.} - * @private - */ - this._undoStack = []; + 'use strict'; + var LIBRARY = __webpack_require__(11) + , $export = __webpack_require__(12) + , redefine = __webpack_require__(27) + , hide = __webpack_require__(17) + , has = __webpack_require__(28) + , Iterators = __webpack_require__(29) + , $iterCreate = __webpack_require__(30) + , setToStringTag = __webpack_require__(46) + , getPrototypeOf = __webpack_require__(48) + , ITERATOR = __webpack_require__(47)('iterator') + , BUGGY = !([].keys && 'next' in [].keys()) // Safari has buggy iterators w/o `next` + , FF_ITERATOR = '@@iterator' + , KEYS = 'keys' + , VALUES = 'values'; - /** - * Redo stack - * @type {Array.} - * @private - */ - this._redoStack = []; + var returnThis = function(){ return this; }; - /** - * Lock-flag for executing command - * @type {boolean} - * @private - */ - this._isLocked = false; + module.exports = function(Base, NAME, Constructor, next, DEFAULT, IS_SET, FORCED){ + $iterCreate(Constructor, NAME, next); + var getMethod = function(kind){ + if(!BUGGY && kind in proto)return proto[kind]; + switch(kind){ + case KEYS: return function keys(){ return new Constructor(this, kind); }; + case VALUES: return function values(){ return new Constructor(this, kind); }; + } return function entries(){ return new Constructor(this, kind); }; + }; + var TAG = NAME + ' Iterator' + , DEF_VALUES = DEFAULT == VALUES + , VALUES_BUG = false + , proto = Base.prototype + , $native = proto[ITERATOR] || proto[FF_ITERATOR] || DEFAULT && proto[DEFAULT] + , $default = $native || getMethod(DEFAULT) + , $entries = DEFAULT ? !DEF_VALUES ? $default : getMethod('entries') : undefined + , $anyNative = NAME == 'Array' ? proto.entries || $native : $native + , methods, key, IteratorPrototype; + // Fix native + if($anyNative){ + IteratorPrototype = getPrototypeOf($anyNative.call(new Base)); + if(IteratorPrototype !== Object.prototype){ + // Set @@toStringTag to native iterators + setToStringTag(IteratorPrototype, TAG, true); + // fix for some old engines + if(!LIBRARY && !has(IteratorPrototype, ITERATOR))hide(IteratorPrototype, ITERATOR, returnThis); } + } + // fix Array#{values, @@iterator}.name in V8 / FF + if(DEF_VALUES && $native && $native.name !== VALUES){ + VALUES_BUG = true; + $default = function values(){ return $native.call(this); }; + } + // Define iterator + if((!LIBRARY || FORCED) && (BUGGY || VALUES_BUG || !proto[ITERATOR])){ + hide(proto, ITERATOR, $default); + } + // Plug for library + Iterators[NAME] = $default; + Iterators[TAG] = returnThis; + if(DEFAULT){ + methods = { + values: DEF_VALUES ? $default : getMethod(VALUES), + keys: IS_SET ? $default : getMethod(KEYS), + entries: $entries + }; + if(FORCED)for(key in methods){ + if(!(key in proto))redefine(proto, key, methods[key]); + } else $export($export.P + $export.F * (BUGGY || VALUES_BUG), NAME, methods); + } + return methods; + }; - /** - * Invoke command execution - * @param {Command} command - Command - * @returns {Promise} - * @private - */ - - - _createClass(Invoker, [{ - key: '_invokeExecution', - value: function _invokeExecution(command) { - var _this = this; - - this.lock(); - - var args = command.args; - - if (!args) { - args = []; - } +/***/ }), +/* 11 */ +/***/ (function(module, exports) { - return command.execute.apply(command, args).then(function (value) { - _this.pushUndoStack(command); - _this.unlock(); - if (isFunction(command.executeCallback)) { - command.executeCallback(value); - } + module.exports = true; - return value; - })['catch'](function (message) { - _this.unlock(); +/***/ }), +/* 12 */ +/***/ (function(module, exports, __webpack_require__) { - return _promise2.default.reject(message); - }); - } + var global = __webpack_require__(13) + , core = __webpack_require__(14) + , ctx = __webpack_require__(15) + , hide = __webpack_require__(17) + , PROTOTYPE = 'prototype'; - /** - * Invoke command undo - * @param {Command} command - Command - * @returns {Promise} - * @private - */ + var $export = function(type, name, source){ + var IS_FORCED = type & $export.F + , IS_GLOBAL = type & $export.G + , IS_STATIC = type & $export.S + , IS_PROTO = type & $export.P + , IS_BIND = type & $export.B + , IS_WRAP = type & $export.W + , exports = IS_GLOBAL ? core : core[name] || (core[name] = {}) + , expProto = exports[PROTOTYPE] + , target = IS_GLOBAL ? global : IS_STATIC ? global[name] : (global[name] || {})[PROTOTYPE] + , key, own, out; + if(IS_GLOBAL)source = name; + for(key in source){ + // contains in native + own = !IS_FORCED && target && target[key] !== undefined; + if(own && key in exports)continue; + // export native or passed + out = own ? target[key] : source[key]; + // prevent global pollution for namespaces + exports[key] = IS_GLOBAL && typeof target[key] != 'function' ? source[key] + // bind timers to global for call from export context + : IS_BIND && own ? ctx(out, global) + // wrap global constructors for prevent change them in library + : IS_WRAP && target[key] == out ? (function(C){ + var F = function(a, b, c){ + if(this instanceof C){ + switch(arguments.length){ + case 0: return new C; + case 1: return new C(a); + case 2: return new C(a, b); + } return new C(a, b, c); + } return C.apply(this, arguments); + }; + F[PROTOTYPE] = C[PROTOTYPE]; + return F; + // make static versions for prototype methods + })(out) : IS_PROTO && typeof out == 'function' ? ctx(Function.call, out) : out; + // export proto methods to core.%CONSTRUCTOR%.methods.%NAME% + if(IS_PROTO){ + (exports.virtual || (exports.virtual = {}))[key] = out; + // export proto methods to core.%CONSTRUCTOR%.prototype.%NAME% + if(type & $export.R && expProto && !expProto[key])hide(expProto, key, out); + } + } + }; + // type bitmap + $export.F = 1; // forced + $export.G = 2; // global + $export.S = 4; // static + $export.P = 8; // proto + $export.B = 16; // bind + $export.W = 32; // wrap + $export.U = 64; // safe + $export.R = 128; // real proto method for `library` + module.exports = $export; - }, { - key: '_invokeUndo', - value: function _invokeUndo(command) { - var _this2 = this; +/***/ }), +/* 13 */ +/***/ (function(module, exports) { - this.lock(); + // https://github.com/zloirock/core-js/issues/86#issuecomment-115759028 + var global = module.exports = typeof window != 'undefined' && window.Math == Math + ? window : typeof self != 'undefined' && self.Math == Math ? self : Function('return this')(); + if(typeof __g == 'number')__g = global; // eslint-disable-line no-undef - var args = command.args; +/***/ }), +/* 14 */ +/***/ (function(module, exports) { - if (!args) { - args = []; - } + var core = module.exports = {version: '2.4.0'}; + if(typeof __e == 'number')__e = core; // eslint-disable-line no-undef - return command.undo.apply(command, args).then(function (value) { - _this2.pushRedoStack(command); - _this2.unlock(); - if (isFunction(command.undoCallback)) { - command.undoCallback(value); - } +/***/ }), +/* 15 */ +/***/ (function(module, exports, __webpack_require__) { - return value; - })['catch'](function (message) { - _this2.unlock(); + // optional / simple context binding + var aFunction = __webpack_require__(16); + module.exports = function(fn, that, length){ + aFunction(fn); + if(that === undefined)return fn; + switch(length){ + case 1: return function(a){ + return fn.call(that, a); + }; + case 2: return function(a, b){ + return fn.call(that, a, b); + }; + case 3: return function(a, b, c){ + return fn.call(that, a, b, c); + }; + } + return function(/* ...args */){ + return fn.apply(that, arguments); + }; + }; - return _promise2.default.reject(message); - }); - } +/***/ }), +/* 16 */ +/***/ (function(module, exports) { - /** - * fire REDO_STACK_CHANGED event - * @private - */ + module.exports = function(it){ + if(typeof it != 'function')throw TypeError(it + ' is not a function!'); + return it; + }; - }, { - key: '_fireRedoStackChanged', - value: function _fireRedoStackChanged() { - this.fire(eventNames.REDO_STACK_CHANGED, this._redoStack.length); - } +/***/ }), +/* 17 */ +/***/ (function(module, exports, __webpack_require__) { - /** - * fire UNDO_STACK_CHANGED event - * @private - */ + var dP = __webpack_require__(18) + , createDesc = __webpack_require__(26); + module.exports = __webpack_require__(22) ? function(object, key, value){ + return dP.f(object, key, createDesc(1, value)); + } : function(object, key, value){ + object[key] = value; + return object; + }; - }, { - key: '_fireUndoStackChanged', - value: function _fireUndoStackChanged() { - this.fire(eventNames.UNDO_STACK_CHANGED, this._undoStack.length); - } +/***/ }), +/* 18 */ +/***/ (function(module, exports, __webpack_require__) { - /** - * Lock this invoker - */ + var anObject = __webpack_require__(19) + , IE8_DOM_DEFINE = __webpack_require__(21) + , toPrimitive = __webpack_require__(25) + , dP = Object.defineProperty; - }, { - key: 'lock', - value: function lock() { - this._isLocked = true; - } + exports.f = __webpack_require__(22) ? Object.defineProperty : function defineProperty(O, P, Attributes){ + anObject(O); + P = toPrimitive(P, true); + anObject(Attributes); + if(IE8_DOM_DEFINE)try { + return dP(O, P, Attributes); + } catch(e){ /* empty */ } + if('get' in Attributes || 'set' in Attributes)throw TypeError('Accessors not supported!'); + if('value' in Attributes)O[P] = Attributes.value; + return O; + }; - /** - * Unlock this invoker - */ +/***/ }), +/* 19 */ +/***/ (function(module, exports, __webpack_require__) { - }, { - key: 'unlock', - value: function unlock() { - this._isLocked = false; - } + var isObject = __webpack_require__(20); + module.exports = function(it){ + if(!isObject(it))throw TypeError(it + ' is not an object!'); + return it; + }; - /** - * Invoke command - * Store the command to the undoStack - * Clear the redoStack - * @param {String} commandName - Command name - * @param {...*} args - Arguments for creating command - * @returns {Promise} - */ +/***/ }), +/* 20 */ +/***/ (function(module, exports) { - }, { - key: 'execute', - value: function execute() { - var _this3 = this; + module.exports = function(it){ + return typeof it === 'object' ? it !== null : typeof it === 'function'; + }; - if (this._isLocked) { - return _promise2.default.reject(rejectMessages.isLock); - } +/***/ }), +/* 21 */ +/***/ (function(module, exports, __webpack_require__) { - for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { - args[_key] = arguments[_key]; - } + module.exports = !__webpack_require__(22) && !__webpack_require__(23)(function(){ + return Object.defineProperty(__webpack_require__(24)('div'), 'a', {get: function(){ return 7; }}).a != 7; + }); - var command = args[0]; +/***/ }), +/* 22 */ +/***/ (function(module, exports, __webpack_require__) { - if (isString(command)) { - command = _command2.default.create.apply(_command2.default, args); - } + // Thank's IE8 for his funny defineProperty + module.exports = !__webpack_require__(23)(function(){ + return Object.defineProperty({}, 'a', {get: function(){ return 7; }}).a != 7; + }); - return this._invokeExecution(command).then(function (value) { - _this3.clearRedoStack(); +/***/ }), +/* 23 */ +/***/ (function(module, exports) { - return value; - }); - } + module.exports = function(exec){ + try { + return !!exec(); + } catch(e){ + return true; + } + }; - /** - * Undo command - * @returns {Promise} - */ +/***/ }), +/* 24 */ +/***/ (function(module, exports, __webpack_require__) { - }, { - key: 'undo', - value: function undo() { - var command = this._undoStack.pop(); - var promise = void 0; - var message = ''; - - if (command && this._isLocked) { - this.pushUndoStack(command, true); - command = null; - } - if (command) { - if (this.isEmptyUndoStack()) { - this._fireUndoStackChanged(); - } - promise = this._invokeUndo(command); - } else { - message = rejectMessages.undo; - if (this._isLocked) { - message = message + ' Because ' + rejectMessages.isLock; - } - promise = _promise2.default.reject(message); - } - - return promise; - } - - /** - * Redo command - * @returns {Promise} - */ - - }, { - key: 'redo', - value: function redo() { - var command = this._redoStack.pop(); - var promise = void 0; - var message = ''; - - if (command && this._isLocked) { - this.pushRedoStack(command, true); - command = null; - } - if (command) { - if (this.isEmptyRedoStack()) { - this._fireRedoStackChanged(); - } - promise = this._invokeExecution(command); - } else { - message = rejectMessages.redo; - if (this._isLocked) { - message = message + ' Because ' + rejectMessages.isLock; - } - promise = _promise2.default.reject(message); - } - - return promise; - } - - /** - * Push undo stack - * @param {Command} command - command - * @param {boolean} [isSilent] - Fire event or not - */ - - }, { - key: 'pushUndoStack', - value: function pushUndoStack(command, isSilent) { - this._undoStack.push(command); - if (!isSilent) { - this._fireUndoStackChanged(); - } - } - - /** - * Push redo stack - * @param {Command} command - command - * @param {boolean} [isSilent] - Fire event or not - */ - - }, { - key: 'pushRedoStack', - value: function pushRedoStack(command, isSilent) { - this._redoStack.push(command); - if (!isSilent) { - this._fireRedoStackChanged(); - } - } - - /** - * Return whether the redoStack is empty - * @returns {boolean} - */ - - }, { - key: 'isEmptyRedoStack', - value: function isEmptyRedoStack() { - return this._redoStack.length === 0; - } - - /** - * Return whether the undoStack is empty - * @returns {boolean} - */ - - }, { - key: 'isEmptyUndoStack', - value: function isEmptyUndoStack() { - return this._undoStack.length === 0; - } - - /** - * Clear undoStack - */ - - }, { - key: 'clearUndoStack', - value: function clearUndoStack() { - if (!this.isEmptyUndoStack()) { - this._undoStack = []; - this._fireUndoStackChanged(); - } - } - - /** - * Clear redoStack - */ - - }, { - key: 'clearRedoStack', - value: function clearRedoStack() { - if (!this.isEmptyRedoStack()) { - this._redoStack = []; - this._fireRedoStackChanged(); - } - } - }]); - - return Invoker; - }(); - - CustomEvents.mixin(Invoker); - module.exports = Invoker; + var isObject = __webpack_require__(20) + , document = __webpack_require__(13).document + // in old IE typeof document.createElement is 'object' + , is = isObject(document) && isObject(document.createElement); + module.exports = function(it){ + return is ? document.createElement(it) : {}; + }; /***/ }), -/* 4 */ +/* 25 */ /***/ (function(module, exports, __webpack_require__) { - __webpack_require__(5); - __webpack_require__(6); - __webpack_require__(50); - __webpack_require__(54); - module.exports = __webpack_require__(14).Promise; + // 7.1.1 ToPrimitive(input [, PreferredType]) + var isObject = __webpack_require__(20); + // instead of the ES6 spec version, we didn't implement @@toPrimitive case + // and the second argument - flag - preferred type is a string + module.exports = function(it, S){ + if(!isObject(it))return it; + var fn, val; + if(S && typeof (fn = it.toString) == 'function' && !isObject(val = fn.call(it)))return val; + if(typeof (fn = it.valueOf) == 'function' && !isObject(val = fn.call(it)))return val; + if(!S && typeof (fn = it.toString) == 'function' && !isObject(val = fn.call(it)))return val; + throw TypeError("Can't convert object to primitive value"); + }; /***/ }), -/* 5 */ +/* 26 */ /***/ (function(module, exports) { - + module.exports = function(bitmap, value){ + return { + enumerable : !(bitmap & 1), + configurable: !(bitmap & 2), + writable : !(bitmap & 4), + value : value + }; + }; /***/ }), -/* 6 */ +/* 27 */ /***/ (function(module, exports, __webpack_require__) { - 'use strict'; - var $at = __webpack_require__(7)(true); - - // 21.1.3.27 String.prototype[@@iterator]() - __webpack_require__(10)(String, 'String', function(iterated){ - this._t = String(iterated); // target - this._i = 0; // next index - // 21.1.5.2.1 %StringIteratorPrototype%.next() - }, function(){ - var O = this._t - , index = this._i - , point; - if(index >= O.length)return {value: undefined, done: true}; - point = $at(O, index); - this._i += point.length; - return {value: point, done: false}; - }); + module.exports = __webpack_require__(17); /***/ }), -/* 7 */ -/***/ (function(module, exports, __webpack_require__) { +/* 28 */ +/***/ (function(module, exports) { - var toInteger = __webpack_require__(8) - , defined = __webpack_require__(9); - // true -> String#at - // false -> String#codePointAt - module.exports = function(TO_STRING){ - return function(that, pos){ - var s = String(defined(that)) - , i = toInteger(pos) - , l = s.length - , a, b; - if(i < 0 || i >= l)return TO_STRING ? '' : undefined; - a = s.charCodeAt(i); - return a < 0xd800 || a > 0xdbff || i + 1 === l || (b = s.charCodeAt(i + 1)) < 0xdc00 || b > 0xdfff - ? TO_STRING ? s.charAt(i) : a - : TO_STRING ? s.slice(i, i + 2) : (a - 0xd800 << 10) + (b - 0xdc00) + 0x10000; - }; + var hasOwnProperty = {}.hasOwnProperty; + module.exports = function(it, key){ + return hasOwnProperty.call(it, key); }; /***/ }), -/* 8 */ +/* 29 */ /***/ (function(module, exports) { - // 7.1.4 ToInteger - var ceil = Math.ceil - , floor = Math.floor; - module.exports = function(it){ - return isNaN(it = +it) ? 0 : (it > 0 ? floor : ceil)(it); - }; + module.exports = {}; /***/ }), -/* 9 */ -/***/ (function(module, exports) { +/* 30 */ +/***/ (function(module, exports, __webpack_require__) { - // 7.2.1 RequireObjectCoercible(argument) - module.exports = function(it){ - if(it == undefined)throw TypeError("Can't call method on " + it); - return it; + 'use strict'; + var create = __webpack_require__(31) + , descriptor = __webpack_require__(26) + , setToStringTag = __webpack_require__(46) + , IteratorPrototype = {}; + + // 25.1.2.1.1 %IteratorPrototype%[@@iterator]() + __webpack_require__(17)(IteratorPrototype, __webpack_require__(47)('iterator'), function(){ return this; }); + + module.exports = function(Constructor, NAME, next){ + Constructor.prototype = create(IteratorPrototype, {next: descriptor(1, next)}); + setToStringTag(Constructor, NAME + ' Iterator'); }; /***/ }), -/* 10 */ +/* 31 */ /***/ (function(module, exports, __webpack_require__) { - 'use strict'; - var LIBRARY = __webpack_require__(11) - , $export = __webpack_require__(12) - , redefine = __webpack_require__(27) - , hide = __webpack_require__(17) - , has = __webpack_require__(28) - , Iterators = __webpack_require__(29) - , $iterCreate = __webpack_require__(30) - , setToStringTag = __webpack_require__(46) - , getPrototypeOf = __webpack_require__(48) - , ITERATOR = __webpack_require__(47)('iterator') - , BUGGY = !([].keys && 'next' in [].keys()) // Safari has buggy iterators w/o `next` - , FF_ITERATOR = '@@iterator' - , KEYS = 'keys' - , VALUES = 'values'; - - var returnThis = function(){ return this; }; + // 19.1.2.2 / 15.2.3.5 Object.create(O [, Properties]) + var anObject = __webpack_require__(19) + , dPs = __webpack_require__(32) + , enumBugKeys = __webpack_require__(44) + , IE_PROTO = __webpack_require__(41)('IE_PROTO') + , Empty = function(){ /* empty */ } + , PROTOTYPE = 'prototype'; - module.exports = function(Base, NAME, Constructor, next, DEFAULT, IS_SET, FORCED){ - $iterCreate(Constructor, NAME, next); - var getMethod = function(kind){ - if(!BUGGY && kind in proto)return proto[kind]; - switch(kind){ - case KEYS: return function keys(){ return new Constructor(this, kind); }; - case VALUES: return function values(){ return new Constructor(this, kind); }; - } return function entries(){ return new Constructor(this, kind); }; - }; - var TAG = NAME + ' Iterator' - , DEF_VALUES = DEFAULT == VALUES - , VALUES_BUG = false - , proto = Base.prototype - , $native = proto[ITERATOR] || proto[FF_ITERATOR] || DEFAULT && proto[DEFAULT] - , $default = $native || getMethod(DEFAULT) - , $entries = DEFAULT ? !DEF_VALUES ? $default : getMethod('entries') : undefined - , $anyNative = NAME == 'Array' ? proto.entries || $native : $native - , methods, key, IteratorPrototype; - // Fix native - if($anyNative){ - IteratorPrototype = getPrototypeOf($anyNative.call(new Base)); - if(IteratorPrototype !== Object.prototype){ - // Set @@toStringTag to native iterators - setToStringTag(IteratorPrototype, TAG, true); - // fix for some old engines - if(!LIBRARY && !has(IteratorPrototype, ITERATOR))hide(IteratorPrototype, ITERATOR, returnThis); - } - } - // fix Array#{values, @@iterator}.name in V8 / FF - if(DEF_VALUES && $native && $native.name !== VALUES){ - VALUES_BUG = true; - $default = function values(){ return $native.call(this); }; - } - // Define iterator - if((!LIBRARY || FORCED) && (BUGGY || VALUES_BUG || !proto[ITERATOR])){ - hide(proto, ITERATOR, $default); - } - // Plug for library - Iterators[NAME] = $default; - Iterators[TAG] = returnThis; - if(DEFAULT){ - methods = { - values: DEF_VALUES ? $default : getMethod(VALUES), - keys: IS_SET ? $default : getMethod(KEYS), - entries: $entries - }; - if(FORCED)for(key in methods){ - if(!(key in proto))redefine(proto, key, methods[key]); - } else $export($export.P + $export.F * (BUGGY || VALUES_BUG), NAME, methods); - } - return methods; + // Create object with fake `null` prototype: use iframe Object with cleared prototype + var createDict = function(){ + // Thrash, waste and sodomy: IE GC bug + var iframe = __webpack_require__(24)('iframe') + , i = enumBugKeys.length + , lt = '<' + , gt = '>' + , iframeDocument; + iframe.style.display = 'none'; + __webpack_require__(45).appendChild(iframe); + iframe.src = 'javascript:'; // eslint-disable-line no-script-url + // createDict = iframe.contentWindow.Object; + // html.removeChild(iframe); + iframeDocument = iframe.contentWindow.document; + iframeDocument.open(); + iframeDocument.write(lt + 'script' + gt + 'document.F=Object' + lt + '/script' + gt); + iframeDocument.close(); + createDict = iframeDocument.F; + while(i--)delete createDict[PROTOTYPE][enumBugKeys[i]]; + return createDict(); }; -/***/ }), -/* 11 */ -/***/ (function(module, exports) { + module.exports = Object.create || function create(O, Properties){ + var result; + if(O !== null){ + Empty[PROTOTYPE] = anObject(O); + result = new Empty; + Empty[PROTOTYPE] = null; + // add "__proto__" for Object.getPrototypeOf polyfill + result[IE_PROTO] = O; + } else result = createDict(); + return Properties === undefined ? result : dPs(result, Properties); + }; - module.exports = true; /***/ }), -/* 12 */ +/* 32 */ /***/ (function(module, exports, __webpack_require__) { - var global = __webpack_require__(13) - , core = __webpack_require__(14) - , ctx = __webpack_require__(15) - , hide = __webpack_require__(17) - , PROTOTYPE = 'prototype'; + var dP = __webpack_require__(18) + , anObject = __webpack_require__(19) + , getKeys = __webpack_require__(33); - var $export = function(type, name, source){ - var IS_FORCED = type & $export.F - , IS_GLOBAL = type & $export.G - , IS_STATIC = type & $export.S - , IS_PROTO = type & $export.P - , IS_BIND = type & $export.B - , IS_WRAP = type & $export.W - , exports = IS_GLOBAL ? core : core[name] || (core[name] = {}) - , expProto = exports[PROTOTYPE] - , target = IS_GLOBAL ? global : IS_STATIC ? global[name] : (global[name] || {})[PROTOTYPE] - , key, own, out; - if(IS_GLOBAL)source = name; - for(key in source){ - // contains in native - own = !IS_FORCED && target && target[key] !== undefined; - if(own && key in exports)continue; - // export native or passed - out = own ? target[key] : source[key]; - // prevent global pollution for namespaces - exports[key] = IS_GLOBAL && typeof target[key] != 'function' ? source[key] - // bind timers to global for call from export context - : IS_BIND && own ? ctx(out, global) - // wrap global constructors for prevent change them in library - : IS_WRAP && target[key] == out ? (function(C){ - var F = function(a, b, c){ - if(this instanceof C){ - switch(arguments.length){ - case 0: return new C; - case 1: return new C(a); - case 2: return new C(a, b); - } return new C(a, b, c); - } return C.apply(this, arguments); - }; - F[PROTOTYPE] = C[PROTOTYPE]; - return F; - // make static versions for prototype methods - })(out) : IS_PROTO && typeof out == 'function' ? ctx(Function.call, out) : out; - // export proto methods to core.%CONSTRUCTOR%.methods.%NAME% - if(IS_PROTO){ - (exports.virtual || (exports.virtual = {}))[key] = out; - // export proto methods to core.%CONSTRUCTOR%.prototype.%NAME% - if(type & $export.R && expProto && !expProto[key])hide(expProto, key, out); - } - } + module.exports = __webpack_require__(22) ? Object.defineProperties : function defineProperties(O, Properties){ + anObject(O); + var keys = getKeys(Properties) + , length = keys.length + , i = 0 + , P; + while(length > i)dP.f(O, P = keys[i++], Properties[P]); + return O; }; - // type bitmap - $export.F = 1; // forced - $export.G = 2; // global - $export.S = 4; // static - $export.P = 8; // proto - $export.B = 16; // bind - $export.W = 32; // wrap - $export.U = 64; // safe - $export.R = 128; // real proto method for `library` - module.exports = $export; /***/ }), -/* 13 */ -/***/ (function(module, exports) { - - // https://github.com/zloirock/core-js/issues/86#issuecomment-115759028 - var global = module.exports = typeof window != 'undefined' && window.Math == Math - ? window : typeof self != 'undefined' && self.Math == Math ? self : Function('return this')(); - if(typeof __g == 'number')__g = global; // eslint-disable-line no-undef +/* 33 */ +/***/ (function(module, exports, __webpack_require__) { -/***/ }), -/* 14 */ -/***/ (function(module, exports) { + // 19.1.2.14 / 15.2.3.14 Object.keys(O) + var $keys = __webpack_require__(34) + , enumBugKeys = __webpack_require__(44); - var core = module.exports = {version: '2.4.0'}; - if(typeof __e == 'number')__e = core; // eslint-disable-line no-undef + module.exports = Object.keys || function keys(O){ + return $keys(O, enumBugKeys); + }; /***/ }), -/* 15 */ +/* 34 */ /***/ (function(module, exports, __webpack_require__) { - // optional / simple context binding - var aFunction = __webpack_require__(16); - module.exports = function(fn, that, length){ - aFunction(fn); - if(that === undefined)return fn; - switch(length){ - case 1: return function(a){ - return fn.call(that, a); - }; - case 2: return function(a, b){ - return fn.call(that, a, b); - }; - case 3: return function(a, b, c){ - return fn.call(that, a, b, c); - }; + var has = __webpack_require__(28) + , toIObject = __webpack_require__(35) + , arrayIndexOf = __webpack_require__(38)(false) + , IE_PROTO = __webpack_require__(41)('IE_PROTO'); + + module.exports = function(object, names){ + var O = toIObject(object) + , i = 0 + , result = [] + , key; + for(key in O)if(key != IE_PROTO)has(O, key) && result.push(key); + // Don't enum bug & hidden keys + while(names.length > i)if(has(O, key = names[i++])){ + ~arrayIndexOf(result, key) || result.push(key); } - return function(/* ...args */){ - return fn.apply(that, arguments); - }; + return result; }; /***/ }), -/* 16 */ -/***/ (function(module, exports) { +/* 35 */ +/***/ (function(module, exports, __webpack_require__) { + // to indexed object, toObject with fallback for non-array-like ES3 strings + var IObject = __webpack_require__(36) + , defined = __webpack_require__(9); module.exports = function(it){ - if(typeof it != 'function')throw TypeError(it + ' is not a function!'); - return it; + return IObject(defined(it)); }; /***/ }), -/* 17 */ +/* 36 */ /***/ (function(module, exports, __webpack_require__) { - var dP = __webpack_require__(18) - , createDesc = __webpack_require__(26); - module.exports = __webpack_require__(22) ? function(object, key, value){ - return dP.f(object, key, createDesc(1, value)); - } : function(object, key, value){ - object[key] = value; - return object; - }; - -/***/ }), -/* 18 */ -/***/ (function(module, exports, __webpack_require__) { - - var anObject = __webpack_require__(19) - , IE8_DOM_DEFINE = __webpack_require__(21) - , toPrimitive = __webpack_require__(25) - , dP = Object.defineProperty; - - exports.f = __webpack_require__(22) ? Object.defineProperty : function defineProperty(O, P, Attributes){ - anObject(O); - P = toPrimitive(P, true); - anObject(Attributes); - if(IE8_DOM_DEFINE)try { - return dP(O, P, Attributes); - } catch(e){ /* empty */ } - if('get' in Attributes || 'set' in Attributes)throw TypeError('Accessors not supported!'); - if('value' in Attributes)O[P] = Attributes.value; - return O; - }; - -/***/ }), -/* 19 */ -/***/ (function(module, exports, __webpack_require__) { - - var isObject = __webpack_require__(20); - module.exports = function(it){ - if(!isObject(it))throw TypeError(it + ' is not an object!'); - return it; + // fallback for non-array-like ES3 and non-enumerable old V8 strings + var cof = __webpack_require__(37); + module.exports = Object('z').propertyIsEnumerable(0) ? Object : function(it){ + return cof(it) == 'String' ? it.split('') : Object(it); }; /***/ }), -/* 20 */ +/* 37 */ /***/ (function(module, exports) { + var toString = {}.toString; + module.exports = function(it){ - return typeof it === 'object' ? it !== null : typeof it === 'function'; + return toString.call(it).slice(8, -1); }; /***/ }), -/* 21 */ -/***/ (function(module, exports, __webpack_require__) { - - module.exports = !__webpack_require__(22) && !__webpack_require__(23)(function(){ - return Object.defineProperty(__webpack_require__(24)('div'), 'a', {get: function(){ return 7; }}).a != 7; - }); - -/***/ }), -/* 22 */ +/* 38 */ /***/ (function(module, exports, __webpack_require__) { - // Thank's IE8 for his funny defineProperty - module.exports = !__webpack_require__(23)(function(){ - return Object.defineProperty({}, 'a', {get: function(){ return 7; }}).a != 7; - }); - -/***/ }), -/* 23 */ -/***/ (function(module, exports) { - - module.exports = function(exec){ - try { - return !!exec(); - } catch(e){ - return true; - } + // false -> Array#indexOf + // true -> Array#includes + var toIObject = __webpack_require__(35) + , toLength = __webpack_require__(39) + , toIndex = __webpack_require__(40); + module.exports = function(IS_INCLUDES){ + return function($this, el, fromIndex){ + var O = toIObject($this) + , length = toLength(O.length) + , index = toIndex(fromIndex, length) + , value; + // Array#includes uses SameValueZero equality algorithm + if(IS_INCLUDES && el != el)while(length > index){ + value = O[index++]; + if(value != value)return true; + // Array#toIndex ignores holes, Array#includes - not + } else for(;length > index; index++)if(IS_INCLUDES || index in O){ + if(O[index] === el)return IS_INCLUDES || index || 0; + } return !IS_INCLUDES && -1; + }; }; /***/ }), -/* 24 */ +/* 39 */ /***/ (function(module, exports, __webpack_require__) { - var isObject = __webpack_require__(20) - , document = __webpack_require__(13).document - // in old IE typeof document.createElement is 'object' - , is = isObject(document) && isObject(document.createElement); + // 7.1.15 ToLength + var toInteger = __webpack_require__(8) + , min = Math.min; module.exports = function(it){ - return is ? document.createElement(it) : {}; + return it > 0 ? min(toInteger(it), 0x1fffffffffffff) : 0; // pow(2, 53) - 1 == 9007199254740991 }; /***/ }), -/* 25 */ +/* 40 */ /***/ (function(module, exports, __webpack_require__) { - // 7.1.1 ToPrimitive(input [, PreferredType]) - var isObject = __webpack_require__(20); - // instead of the ES6 spec version, we didn't implement @@toPrimitive case - // and the second argument - flag - preferred type is a string - module.exports = function(it, S){ - if(!isObject(it))return it; - var fn, val; - if(S && typeof (fn = it.toString) == 'function' && !isObject(val = fn.call(it)))return val; - if(typeof (fn = it.valueOf) == 'function' && !isObject(val = fn.call(it)))return val; - if(!S && typeof (fn = it.toString) == 'function' && !isObject(val = fn.call(it)))return val; - throw TypeError("Can't convert object to primitive value"); + var toInteger = __webpack_require__(8) + , max = Math.max + , min = Math.min; + module.exports = function(index, length){ + index = toInteger(index); + return index < 0 ? max(index + length, 0) : min(index, length); }; /***/ }), -/* 26 */ -/***/ (function(module, exports) { +/* 41 */ +/***/ (function(module, exports, __webpack_require__) { - module.exports = function(bitmap, value){ - return { - enumerable : !(bitmap & 1), - configurable: !(bitmap & 2), - writable : !(bitmap & 4), - value : value - }; + var shared = __webpack_require__(42)('keys') + , uid = __webpack_require__(43); + module.exports = function(key){ + return shared[key] || (shared[key] = uid(key)); }; /***/ }), -/* 27 */ +/* 42 */ /***/ (function(module, exports, __webpack_require__) { - module.exports = __webpack_require__(17); + var global = __webpack_require__(13) + , SHARED = '__core-js_shared__' + , store = global[SHARED] || (global[SHARED] = {}); + module.exports = function(key){ + return store[key] || (store[key] = {}); + }; /***/ }), -/* 28 */ +/* 43 */ /***/ (function(module, exports) { - var hasOwnProperty = {}.hasOwnProperty; - module.exports = function(it, key){ - return hasOwnProperty.call(it, key); + var id = 0 + , px = Math.random(); + module.exports = function(key){ + return 'Symbol('.concat(key === undefined ? '' : key, ')_', (++id + px).toString(36)); }; /***/ }), -/* 29 */ +/* 44 */ /***/ (function(module, exports) { - module.exports = {}; + // IE 8- don't enum bug keys + module.exports = ( + 'constructor,hasOwnProperty,isPrototypeOf,propertyIsEnumerable,toLocaleString,toString,valueOf' + ).split(','); /***/ }), -/* 30 */ +/* 45 */ /***/ (function(module, exports, __webpack_require__) { - 'use strict'; - var create = __webpack_require__(31) - , descriptor = __webpack_require__(26) - , setToStringTag = __webpack_require__(46) - , IteratorPrototype = {}; + module.exports = __webpack_require__(13).document && document.documentElement; - // 25.1.2.1.1 %IteratorPrototype%[@@iterator]() - __webpack_require__(17)(IteratorPrototype, __webpack_require__(47)('iterator'), function(){ return this; }); +/***/ }), +/* 46 */ +/***/ (function(module, exports, __webpack_require__) { - module.exports = function(Constructor, NAME, next){ - Constructor.prototype = create(IteratorPrototype, {next: descriptor(1, next)}); - setToStringTag(Constructor, NAME + ' Iterator'); + var def = __webpack_require__(18).f + , has = __webpack_require__(28) + , TAG = __webpack_require__(47)('toStringTag'); + + module.exports = function(it, tag, stat){ + if(it && !has(it = stat ? it : it.prototype, TAG))def(it, TAG, {configurable: true, value: tag}); }; /***/ }), -/* 31 */ +/* 47 */ /***/ (function(module, exports, __webpack_require__) { - // 19.1.2.2 / 15.2.3.5 Object.create(O [, Properties]) - var anObject = __webpack_require__(19) - , dPs = __webpack_require__(32) - , enumBugKeys = __webpack_require__(44) - , IE_PROTO = __webpack_require__(41)('IE_PROTO') - , Empty = function(){ /* empty */ } - , PROTOTYPE = 'prototype'; - - // Create object with fake `null` prototype: use iframe Object with cleared prototype - var createDict = function(){ - // Thrash, waste and sodomy: IE GC bug - var iframe = __webpack_require__(24)('iframe') - , i = enumBugKeys.length - , lt = '<' - , gt = '>' - , iframeDocument; - iframe.style.display = 'none'; - __webpack_require__(45).appendChild(iframe); - iframe.src = 'javascript:'; // eslint-disable-line no-script-url - // createDict = iframe.contentWindow.Object; - // html.removeChild(iframe); - iframeDocument = iframe.contentWindow.document; - iframeDocument.open(); - iframeDocument.write(lt + 'script' + gt + 'document.F=Object' + lt + '/script' + gt); - iframeDocument.close(); - createDict = iframeDocument.F; - while(i--)delete createDict[PROTOTYPE][enumBugKeys[i]]; - return createDict(); - }; + var store = __webpack_require__(42)('wks') + , uid = __webpack_require__(43) + , Symbol = __webpack_require__(13).Symbol + , USE_SYMBOL = typeof Symbol == 'function'; - module.exports = Object.create || function create(O, Properties){ - var result; - if(O !== null){ - Empty[PROTOTYPE] = anObject(O); - result = new Empty; - Empty[PROTOTYPE] = null; - // add "__proto__" for Object.getPrototypeOf polyfill - result[IE_PROTO] = O; - } else result = createDict(); - return Properties === undefined ? result : dPs(result, Properties); + var $exports = module.exports = function(name){ + return store[name] || (store[name] = + USE_SYMBOL && Symbol[name] || (USE_SYMBOL ? Symbol : uid)('Symbol.' + name)); }; + $exports.store = store; /***/ }), -/* 32 */ +/* 48 */ /***/ (function(module, exports, __webpack_require__) { - var dP = __webpack_require__(18) - , anObject = __webpack_require__(19) - , getKeys = __webpack_require__(33); + // 19.1.2.9 / 15.2.3.2 Object.getPrototypeOf(O) + var has = __webpack_require__(28) + , toObject = __webpack_require__(49) + , IE_PROTO = __webpack_require__(41)('IE_PROTO') + , ObjectProto = Object.prototype; - module.exports = __webpack_require__(22) ? Object.defineProperties : function defineProperties(O, Properties){ - anObject(O); - var keys = getKeys(Properties) - , length = keys.length - , i = 0 - , P; - while(length > i)dP.f(O, P = keys[i++], Properties[P]); - return O; + module.exports = Object.getPrototypeOf || function(O){ + O = toObject(O); + if(has(O, IE_PROTO))return O[IE_PROTO]; + if(typeof O.constructor == 'function' && O instanceof O.constructor){ + return O.constructor.prototype; + } return O instanceof Object ? ObjectProto : null; }; /***/ }), -/* 33 */ -/***/ (function(module, exports, __webpack_require__) { - - // 19.1.2.14 / 15.2.3.14 Object.keys(O) - var $keys = __webpack_require__(34) - , enumBugKeys = __webpack_require__(44); - - module.exports = Object.keys || function keys(O){ - return $keys(O, enumBugKeys); - }; - -/***/ }), -/* 34 */ -/***/ (function(module, exports, __webpack_require__) { - - var has = __webpack_require__(28) - , toIObject = __webpack_require__(35) - , arrayIndexOf = __webpack_require__(38)(false) - , IE_PROTO = __webpack_require__(41)('IE_PROTO'); - - module.exports = function(object, names){ - var O = toIObject(object) - , i = 0 - , result = [] - , key; - for(key in O)if(key != IE_PROTO)has(O, key) && result.push(key); - // Don't enum bug & hidden keys - while(names.length > i)if(has(O, key = names[i++])){ - ~arrayIndexOf(result, key) || result.push(key); - } - return result; - }; - -/***/ }), -/* 35 */ -/***/ (function(module, exports, __webpack_require__) { - - // to indexed object, toObject with fallback for non-array-like ES3 strings - var IObject = __webpack_require__(36) - , defined = __webpack_require__(9); - module.exports = function(it){ - return IObject(defined(it)); - }; - -/***/ }), -/* 36 */ -/***/ (function(module, exports, __webpack_require__) { - - // fallback for non-array-like ES3 and non-enumerable old V8 strings - var cof = __webpack_require__(37); - module.exports = Object('z').propertyIsEnumerable(0) ? Object : function(it){ - return cof(it) == 'String' ? it.split('') : Object(it); - }; - -/***/ }), -/* 37 */ -/***/ (function(module, exports) { - - var toString = {}.toString; - - module.exports = function(it){ - return toString.call(it).slice(8, -1); - }; - -/***/ }), -/* 38 */ -/***/ (function(module, exports, __webpack_require__) { - - // false -> Array#indexOf - // true -> Array#includes - var toIObject = __webpack_require__(35) - , toLength = __webpack_require__(39) - , toIndex = __webpack_require__(40); - module.exports = function(IS_INCLUDES){ - return function($this, el, fromIndex){ - var O = toIObject($this) - , length = toLength(O.length) - , index = toIndex(fromIndex, length) - , value; - // Array#includes uses SameValueZero equality algorithm - if(IS_INCLUDES && el != el)while(length > index){ - value = O[index++]; - if(value != value)return true; - // Array#toIndex ignores holes, Array#includes - not - } else for(;length > index; index++)if(IS_INCLUDES || index in O){ - if(O[index] === el)return IS_INCLUDES || index || 0; - } return !IS_INCLUDES && -1; - }; - }; - -/***/ }), -/* 39 */ -/***/ (function(module, exports, __webpack_require__) { - - // 7.1.15 ToLength - var toInteger = __webpack_require__(8) - , min = Math.min; - module.exports = function(it){ - return it > 0 ? min(toInteger(it), 0x1fffffffffffff) : 0; // pow(2, 53) - 1 == 9007199254740991 - }; - -/***/ }), -/* 40 */ -/***/ (function(module, exports, __webpack_require__) { - - var toInteger = __webpack_require__(8) - , max = Math.max - , min = Math.min; - module.exports = function(index, length){ - index = toInteger(index); - return index < 0 ? max(index + length, 0) : min(index, length); - }; - -/***/ }), -/* 41 */ -/***/ (function(module, exports, __webpack_require__) { - - var shared = __webpack_require__(42)('keys') - , uid = __webpack_require__(43); - module.exports = function(key){ - return shared[key] || (shared[key] = uid(key)); - }; - -/***/ }), -/* 42 */ -/***/ (function(module, exports, __webpack_require__) { - - var global = __webpack_require__(13) - , SHARED = '__core-js_shared__' - , store = global[SHARED] || (global[SHARED] = {}); - module.exports = function(key){ - return store[key] || (store[key] = {}); - }; - -/***/ }), -/* 43 */ -/***/ (function(module, exports) { - - var id = 0 - , px = Math.random(); - module.exports = function(key){ - return 'Symbol('.concat(key === undefined ? '' : key, ')_', (++id + px).toString(36)); - }; - -/***/ }), -/* 44 */ -/***/ (function(module, exports) { - - // IE 8- don't enum bug keys - module.exports = ( - 'constructor,hasOwnProperty,isPrototypeOf,propertyIsEnumerable,toLocaleString,toString,valueOf' - ).split(','); - -/***/ }), -/* 45 */ -/***/ (function(module, exports, __webpack_require__) { - - module.exports = __webpack_require__(13).document && document.documentElement; - -/***/ }), -/* 46 */ -/***/ (function(module, exports, __webpack_require__) { - - var def = __webpack_require__(18).f - , has = __webpack_require__(28) - , TAG = __webpack_require__(47)('toStringTag'); - - module.exports = function(it, tag, stat){ - if(it && !has(it = stat ? it : it.prototype, TAG))def(it, TAG, {configurable: true, value: tag}); - }; - -/***/ }), -/* 47 */ -/***/ (function(module, exports, __webpack_require__) { - - var store = __webpack_require__(42)('wks') - , uid = __webpack_require__(43) - , Symbol = __webpack_require__(13).Symbol - , USE_SYMBOL = typeof Symbol == 'function'; - - var $exports = module.exports = function(name){ - return store[name] || (store[name] = - USE_SYMBOL && Symbol[name] || (USE_SYMBOL ? Symbol : uid)('Symbol.' + name)); - }; - - $exports.store = store; - -/***/ }), -/* 48 */ -/***/ (function(module, exports, __webpack_require__) { - - // 19.1.2.9 / 15.2.3.2 Object.getPrototypeOf(O) - var has = __webpack_require__(28) - , toObject = __webpack_require__(49) - , IE_PROTO = __webpack_require__(41)('IE_PROTO') - , ObjectProto = Object.prototype; - - module.exports = Object.getPrototypeOf || function(O){ - O = toObject(O); - if(has(O, IE_PROTO))return O[IE_PROTO]; - if(typeof O.constructor == 'function' && O instanceof O.constructor){ - return O.constructor.prototype; - } return O instanceof Object ? ObjectProto : null; - }; - -/***/ }), -/* 49 */ +/* 49 */ /***/ (function(module, exports, __webpack_require__) { // 7.1.13 ToObject(argument) @@ -3302,602 +3677,9716 @@ return /******/ (function(modules) { // webpackBootstrap , Promise = global.Promise , isNode = __webpack_require__(37)(process) == 'process'; - module.exports = function(){ - var head, last, notify; + module.exports = function(){ + var head, last, notify; + + var flush = function(){ + var parent, fn; + if(isNode && (parent = process.domain))parent.exit(); + while(head){ + fn = head.fn; + head = head.next; + try { + fn(); + } catch(e){ + if(head)notify(); + else last = undefined; + throw e; + } + } last = undefined; + if(parent)parent.enter(); + }; + + // Node.js + if(isNode){ + notify = function(){ + process.nextTick(flush); + }; + // browsers with MutationObserver + } else if(Observer){ + var toggle = true + , node = document.createTextNode(''); + new Observer(flush).observe(node, {characterData: true}); // eslint-disable-line no-new + notify = function(){ + node.data = toggle = !toggle; + }; + // environments with maybe non-completely correct, but existent Promise + } else if(Promise && Promise.resolve){ + var promise = Promise.resolve(); + notify = function(){ + promise.then(flush); + }; + // for other environments - macrotask based on: + // - setImmediate + // - MessageChannel + // - window.postMessag + // - onreadystatechange + // - setTimeout + } else { + notify = function(){ + // strange IE + webpack dev server bug - use .call(global) + macrotask.call(global, flush); + }; + } + + return function(fn){ + var task = {fn: fn, next: undefined}; + if(last)last.next = task; + if(!head){ + head = task; + notify(); + } last = task; + }; + }; + +/***/ }), +/* 65 */ +/***/ (function(module, exports, __webpack_require__) { + + var hide = __webpack_require__(17); + module.exports = function(target, src, safe){ + for(var key in src){ + if(safe && target[key])target[key] = src[key]; + else hide(target, key, src[key]); + } return target; + }; + +/***/ }), +/* 66 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + var global = __webpack_require__(13) + , core = __webpack_require__(14) + , dP = __webpack_require__(18) + , DESCRIPTORS = __webpack_require__(22) + , SPECIES = __webpack_require__(47)('species'); + + module.exports = function(KEY){ + var C = typeof core[KEY] == 'function' ? core[KEY] : global[KEY]; + if(DESCRIPTORS && C && !C[SPECIES])dP.f(C, SPECIES, { + configurable: true, + get: function(){ return this; } + }); + }; + +/***/ }), +/* 67 */ +/***/ (function(module, exports, __webpack_require__) { + + var ITERATOR = __webpack_require__(47)('iterator') + , SAFE_CLOSING = false; + + try { + var riter = [7][ITERATOR](); + riter['return'] = function(){ SAFE_CLOSING = true; }; + Array.from(riter, function(){ throw 2; }); + } catch(e){ /* empty */ } + + module.exports = function(exec, skipClosing){ + if(!skipClosing && !SAFE_CLOSING)return false; + var safe = false; + try { + var arr = [7] + , iter = arr[ITERATOR](); + iter.next = function(){ return {done: safe = true}; }; + arr[ITERATOR] = function(){ return iter; }; + exec(arr); + } catch(e){ /* empty */ } + return safe; + }; + +/***/ }), +/* 68 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); /** + * @author NHN Ent. FE Development Team + * @fileoverview Invoker - invoke commands + */ + + + var _tuiCodeSnippet = __webpack_require__(3); + + var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + + var _promise = __webpack_require__(4); + + var _promise2 = _interopRequireDefault(_promise); + + var _command = __webpack_require__(69); + + var _command2 = _interopRequireDefault(_command); + + var _consts = __webpack_require__(73); + + var _consts2 = _interopRequireDefault(_consts); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + var eventNames = _consts2.default.eventNames, + rejectMessages = _consts2.default.rejectMessages; + var isFunction = _tuiCodeSnippet2.default.isFunction, + isString = _tuiCodeSnippet2.default.isString, + CustomEvents = _tuiCodeSnippet2.default.CustomEvents; + + /** + * Invoker + * @class + * @ignore + */ + + var Invoker = function () { + function Invoker() { + _classCallCheck(this, Invoker); + + /** + * Undo stack + * @type {Array.} + * @private + */ + this._undoStack = []; + + /** + * Redo stack + * @type {Array.} + * @private + */ + this._redoStack = []; + + /** + * Lock-flag for executing command + * @type {boolean} + * @private + */ + this._isLocked = false; + } + + /** + * Invoke command execution + * @param {Command} command - Command + * @returns {Promise} + * @private + */ + + + _createClass(Invoker, [{ + key: '_invokeExecution', + value: function _invokeExecution(command) { + var _this = this; + + this.lock(); + + var args = command.args; + + if (!args) { + args = []; + } + + return command.execute.apply(command, args).then(function (value) { + _this.pushUndoStack(command); + _this.unlock(); + if (isFunction(command.executeCallback)) { + command.executeCallback(value); + } + + return value; + })['catch'](function (message) { + _this.unlock(); + + return _promise2.default.reject(message); + }); + } + + /** + * Invoke command undo + * @param {Command} command - Command + * @returns {Promise} + * @private + */ + + }, { + key: '_invokeUndo', + value: function _invokeUndo(command) { + var _this2 = this; + + this.lock(); + + var args = command.args; + + if (!args) { + args = []; + } + + return command.undo.apply(command, args).then(function (value) { + _this2.pushRedoStack(command); + _this2.unlock(); + if (isFunction(command.undoCallback)) { + command.undoCallback(value); + } + + return value; + })['catch'](function (message) { + _this2.unlock(); + + return _promise2.default.reject(message); + }); + } + + /** + * fire REDO_STACK_CHANGED event + * @private + */ + + }, { + key: '_fireRedoStackChanged', + value: function _fireRedoStackChanged() { + this.fire(eventNames.REDO_STACK_CHANGED, this._redoStack.length); + } + + /** + * fire UNDO_STACK_CHANGED event + * @private + */ + + }, { + key: '_fireUndoStackChanged', + value: function _fireUndoStackChanged() { + this.fire(eventNames.UNDO_STACK_CHANGED, this._undoStack.length); + } + + /** + * Lock this invoker + */ + + }, { + key: 'lock', + value: function lock() { + this._isLocked = true; + } + + /** + * Unlock this invoker + */ + + }, { + key: 'unlock', + value: function unlock() { + this._isLocked = false; + } + + /** + * Invoke command + * Store the command to the undoStack + * Clear the redoStack + * @param {String} commandName - Command name + * @param {...*} args - Arguments for creating command + * @returns {Promise} + */ + + }, { + key: 'execute', + value: function execute() { + var _this3 = this; + + if (this._isLocked) { + return _promise2.default.reject(rejectMessages.isLock); + } + + for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; + } + + var command = args[0]; + + if (isString(command)) { + command = _command2.default.create.apply(_command2.default, args); + } + + return this._invokeExecution(command).then(function (value) { + _this3.clearRedoStack(); + + return value; + }); + } + + /** + * Undo command + * @returns {Promise} + */ + + }, { + key: 'undo', + value: function undo() { + var command = this._undoStack.pop(); + var promise = void 0; + var message = ''; + + if (command && this._isLocked) { + this.pushUndoStack(command, true); + command = null; + } + if (command) { + if (this.isEmptyUndoStack()) { + this._fireUndoStackChanged(); + } + promise = this._invokeUndo(command); + } else { + message = rejectMessages.undo; + if (this._isLocked) { + message = message + ' Because ' + rejectMessages.isLock; + } + promise = _promise2.default.reject(message); + } + + return promise; + } + + /** + * Redo command + * @returns {Promise} + */ + + }, { + key: 'redo', + value: function redo() { + var command = this._redoStack.pop(); + var promise = void 0; + var message = ''; + + if (command && this._isLocked) { + this.pushRedoStack(command, true); + command = null; + } + if (command) { + if (this.isEmptyRedoStack()) { + this._fireRedoStackChanged(); + } + promise = this._invokeExecution(command); + } else { + message = rejectMessages.redo; + if (this._isLocked) { + message = message + ' Because ' + rejectMessages.isLock; + } + promise = _promise2.default.reject(message); + } + + return promise; + } + + /** + * Push undo stack + * @param {Command} command - command + * @param {boolean} [isSilent] - Fire event or not + */ + + }, { + key: 'pushUndoStack', + value: function pushUndoStack(command, isSilent) { + this._undoStack.push(command); + if (!isSilent) { + this._fireUndoStackChanged(); + } + } + + /** + * Push redo stack + * @param {Command} command - command + * @param {boolean} [isSilent] - Fire event or not + */ + + }, { + key: 'pushRedoStack', + value: function pushRedoStack(command, isSilent) { + this._redoStack.push(command); + if (!isSilent) { + this._fireRedoStackChanged(); + } + } + + /** + * Return whether the redoStack is empty + * @returns {boolean} + */ + + }, { + key: 'isEmptyRedoStack', + value: function isEmptyRedoStack() { + return this._redoStack.length === 0; + } + + /** + * Return whether the undoStack is empty + * @returns {boolean} + */ + + }, { + key: 'isEmptyUndoStack', + value: function isEmptyUndoStack() { + return this._undoStack.length === 0; + } + + /** + * Clear undoStack + */ + + }, { + key: 'clearUndoStack', + value: function clearUndoStack() { + if (!this.isEmptyUndoStack()) { + this._undoStack = []; + this._fireUndoStackChanged(); + } + } + + /** + * Clear redoStack + */ + + }, { + key: 'clearRedoStack', + value: function clearRedoStack() { + if (!this.isEmptyRedoStack()) { + this._redoStack = []; + this._fireRedoStackChanged(); + } + } + }]); + + return Invoker; + }(); + + CustomEvents.mixin(Invoker); + module.exports = Invoker; + +/***/ }), +/* 69 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _command = __webpack_require__(70); + + var _command2 = _interopRequireDefault(_command); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + var commands = {}; + + /** + * Create a command + * @param {string} name - Command name + * @param {...*} args - Arguments for creating command + * @returns {Command} + * @ignore + */ + /** + * @author NHN Ent. FE Development Team + * @fileoverview Command factory + */ + function create(name) { + var actions = commands[name]; + if (actions) { + for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { + args[_key - 1] = arguments[_key]; + } + + return new _command2.default(actions, args); + } + + return null; + } + + /** + * Register a command with name as a key + * @param {Object} command - {name:{string}, execute: {function}, undo: {function}} + * @param {string} command.name - command name + * @param {function} command.execute - executable function + * @param {function} command.undo - undo function + * @ignore + */ + function register(command) { + commands[command.name] = command; + } + + module.exports = { + create: create, + register: register + }; + +/***/ }), +/* 70 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); /** + * @author NHN Ent. FE Development Team + * @fileoverview Command interface + */ + + + var _errorMessage = __webpack_require__(71); + + var _errorMessage2 = _interopRequireDefault(_errorMessage); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + var createMessage = _errorMessage2.default.create; + var errorTypes = _errorMessage2.default.types; + + /** + * Command class + * @class + * @param {{name:function, execute: function, undo: function, + * executeCallback: function, undoCallback: function}} actions - Command actions + * @param {Array} args - passing arguments on execute, undo + * @ignore + */ + + var Command = function () { + function Command(actions, args) { + _classCallCheck(this, Command); + + /** + * command name + * @type {string} + */ + this.name = actions.name; + + /** + * arguments + * @type {Array} + */ + this.args = args; + + /** + * Execute function + * @type {function} + */ + this.execute = actions.execute; + + /** + * Undo function + * @type {function} + */ + this.undo = actions.undo; + + /** + * executeCallback + * @type {function} + */ + this.executeCallback = actions.executeCallback || null; + + /** + * undoCallback + * @type {function} + */ + this.undoCallback = actions.undoCallback || null; + + /** + * data for undo + * @type {Object} + */ + this.undoData = {}; + } + + /** + * Execute action + * @param {Object.} compMap - Components injection + * @abstract + */ + + + _createClass(Command, [{ + key: 'execute', + value: function execute() { + throw new Error(createMessage(errorTypes.UN_IMPLEMENTATION, 'execute')); + } + + /** + * Undo action + * @param {Object.} compMap - Components injection + * @abstract + */ + + }, { + key: 'undo', + value: function undo() { + throw new Error(createMessage(errorTypes.UN_IMPLEMENTATION, 'undo')); + } + + /** + * Attach execute callabck + * @param {function} callback - Callback after execution + * @returns {Command} this + */ + + }, { + key: 'setExecuteCallback', + value: function setExecuteCallback(callback) { + this.executeCallback = callback; + + return this; + } + + /** + * Attach undo callback + * @param {function} callback - Callback after undo + * @returns {Command} this + */ + + }, { + key: 'setUndoCallback', + value: function setUndoCallback(callback) { + this.undoCallback = callback; + + return this; + } + }]); + + return Command; + }(); + + module.exports = Command; + +/***/ }), +/* 71 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _tuiCodeSnippet = __webpack_require__(3); + + var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + + var _util = __webpack_require__(72); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + /** + * @author NHN Ent. FE Development Team + * @fileoverview Error-message factory + */ + var types = (0, _util.keyMirror)('UN_IMPLEMENTATION', 'NO_COMPONENT_NAME'); + var messages = { + UN_IMPLEMENTATION: 'Should implement a method: ', + NO_COMPONENT_NAME: 'Should set a component name' + }; + var map = { + UN_IMPLEMENTATION: function UN_IMPLEMENTATION(methodName) { + return messages.UN_IMPLEMENTATION + methodName; + }, + NO_COMPONENT_NAME: function NO_COMPONENT_NAME() { + return messages.NO_COMPONENT_NAME; + } + }; + + module.exports = { + types: _tuiCodeSnippet2.default.extend({}, types), + + create: function create(type) { + type = type.toLowerCase(); + var func = map[type]; + + for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { + args[_key - 1] = arguments[_key]; + } + + return func.apply(undefined, args); + } + }; + +/***/ }), +/* 72 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _tuiCodeSnippet = __webpack_require__(3); + + var min = Math.min, + max = Math.max; /** + * @author NHN Ent. FE Development Team + * @fileoverview Util + */ + + var hostnameSent = false; + + module.exports = { + /** + * Clamp value + * @param {number} value - Value + * @param {number} minValue - Minimum value + * @param {number} maxValue - Maximum value + * @returns {number} clamped value + */ + clamp: function clamp(value, minValue, maxValue) { + var temp = void 0; + if (minValue > maxValue) { + temp = minValue; + minValue = maxValue; + maxValue = temp; + } + + return max(minValue, min(value, maxValue)); + }, + + + /** + * Make key-value object from arguments + * @returns {object.} + */ + keyMirror: function keyMirror() { + var obj = {}; + + for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; + } + + (0, _tuiCodeSnippet.forEach)(args, function (key) { + obj[key] = key; + }); + + return obj; + }, + + + /** + * Make CSSText + * @param {Object} styleObj - Style info object + * @returns {string} Connected string of style + */ + makeStyleText: function makeStyleText(styleObj) { + var styleStr = ''; + + (0, _tuiCodeSnippet.forEach)(styleObj, function (value, prop) { + styleStr += prop + ': ' + value + ';'; + }); + + return styleStr; + }, + + + /** + * Get object's properties + * @param {Object} obj - object + * @param {Array} keys - keys + * @returns {Object} properties object + */ + getProperties: function getProperties(obj, keys) { + var props = {}; + var length = keys.length; + + var i = 0; + var key = void 0; + + for (i = 0; i < length; i += 1) { + key = keys[i]; + props[key] = obj[key]; + } + + return props; + }, + + + /** + * ParseInt simpliment + * @param {number} value - Value + * @returns {number} + */ + toInteger: function toInteger(value) { + return parseInt(value, 10); + }, + + + /** + * String to camelcase string + * @param {string} targetString - change target + * @returns {string} + * @private + */ + toCamelCase: function toCamelCase(targetString) { + return targetString.replace(/-([a-z])/g, function ($0, $1) { + return $1.toUpperCase(); + }); + }, + + + /** + * Check browser file api support + * @returns {boolean} + * @private + */ + isSupportFileApi: function isSupportFileApi() { + return !!(window.File && window.FileList && window.FileReader); + }, + + + /** + * hex to rgb + * @param {string} color - hex color + * @param {string} alpha - color alpha value + * @returns {string} rgb expression + */ + getRgb: function getRgb(color, alpha) { + if (color.length === 4) { + color = '' + color + color.slice(1, 4); + } + var r = parseInt(color.slice(1, 3), 16); + var g = parseInt(color.slice(3, 5), 16); + var b = parseInt(color.slice(5, 7), 16); + var a = alpha || 1; + + return 'rgba(' + r + ', ' + g + ', ' + b + ', ' + a + ')'; + }, + + + /** + * send hostname + */ + sendHostName: function sendHostName() { + var _location = location, + hostname = _location.hostname; + + if (hostnameSent) { + return; + } + hostnameSent = true; + + (0, _tuiCodeSnippet.imagePing)('https://www.google-analytics.com/collect', { + v: 1, + t: 'event', + tid: 'UA-115377265-9', + cid: hostname, + dp: hostname, + dh: 'image-editor' + }); + }, + + + /** + * Apply css resource + * @param {string} styleBuffer - serialized css text + * @param {string} tagId - style tag id + */ + styleLoad: function styleLoad(styleBuffer, tagId) { + var _document$getElements = document.getElementsByTagName('head'), + head = _document$getElements[0]; + + var linkElement = document.createElement('link'); + var styleData = encodeURIComponent(styleBuffer); + if (tagId) { + linkElement.id = tagId; + // linkElement.id = 'tui-image-editor-theme-style'; + } + linkElement.setAttribute('rel', 'stylesheet'); + linkElement.setAttribute('type', 'text/css'); + linkElement.setAttribute('href', 'data:text/css;charset=UTF-8,' + styleData); + head.appendChild(linkElement); + }, + + + /** + * Get selector + * @param {HTMLElement} targetElement - target element + * @returns {Function} selector + */ + getSelector: function getSelector(targetElement) { + return function (str) { + return targetElement.querySelector(str); + }; + }, + + + /** + * Change base64 to blob + * @param {String} data - base64 string data + * @returns {Blob} Blob Data + */ + base64ToBlob: function base64ToBlob(data) { + var rImageType = /data:(image\/.+);base64,/; + var mimeString = ''; + var raw = void 0, + uInt8Array = void 0, + i = void 0; + + raw = data.replace(rImageType, function (header, imageType) { + mimeString = imageType; + + return ''; + }); + + raw = atob(raw); + var rawLength = raw.length; + uInt8Array = new Uint8Array(rawLength); // eslint-disable-line + + for (i = 0; i < rawLength; i += 1) { + uInt8Array[i] = raw.charCodeAt(i); + } + + return new Blob([uInt8Array], { type: mimeString }); + } + }; + +/***/ }), +/* 73 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var _util = __webpack_require__(72); + + var _util2 = _interopRequireDefault(_util); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + module.exports = { + /** + * Component names + * @type {Object.} + */ + componentNames: _util2.default.keyMirror('IMAGE_LOADER', 'CROPPER', 'FLIP', 'ROTATION', 'FREE_DRAWING', 'LINE', 'TEXT', 'ICON', 'FILTER', 'SHAPE'), + + /** + * Command names + * @type {Object.} + */ + commandNames: { + 'CLEAR_OBJECTS': 'clearObjects', + 'LOAD_IMAGE': 'loadImage', + 'FLIP_IMAGE': 'flip', + 'ROTATE_IMAGE': 'rotate', + 'ADD_OBJECT': 'addObject', + 'REMOVE_OBJECT': 'removeObject', + 'APPLY_FILTER': 'applyFilter', + 'REMOVE_FILTER': 'removeFilter', + 'ADD_ICON': 'addIcon', + 'CHANGE_ICON_COLOR': 'changeIconColor', + 'ADD_SHAPE': 'addShape', + 'CHANGE_SHAPE': 'changeShape', + 'ADD_TEXT': 'addText', + 'CHANGE_TEXT': 'changeText', + 'CHANGE_TEXT_STYLE': 'changeTextStyle', + 'ADD_IMAGE_OBJECT': 'addImageObject', + 'RESIZE_CANVAS_DIMENSION': 'resizeCanvasDimension', + 'SET_OBJECT_PROPERTIES': 'setObjectProperties', + 'SET_OBJECT_POSITION': 'setObjectPosition' + }, + + /** + * Event names + * @type {Object.} + */ + eventNames: { + OBJECT_ACTIVATED: 'objectActivated', + OBJECT_MOVED: 'objectMoved', + OBJECT_SCALED: 'objectScaled', + OBJECT_CREATED: 'objectCreated', + TEXT_EDITING: 'textEditing', + TEXT_CHANGED: 'textChanged', + ICON_CREATE_RESIZE: 'iconCreateResize', + ICON_CREATE_END: 'iconCreateEnd', + ADD_TEXT: 'addText', + ADD_OBJECT: 'addObject', + ADD_OBJECT_AFTER: 'addObjectAfter', + MOUSE_DOWN: 'mousedown', + MOUSE_UP: 'mouseup', + MOUSE_MOVE: 'mousemove', + // UNDO/REDO Events + REDO_STACK_CHANGED: 'redoStackChanged', + UNDO_STACK_CHANGED: 'undoStackChanged', + SELECTION_CLEARED: 'selectionCleared', + SELECTION_CREATED: 'selectionCreated' + }, + + /** + * Editor states + * @type {Object.} + */ + drawingModes: _util2.default.keyMirror('NORMAL', 'CROPPER', 'FREE_DRAWING', 'LINE_DRAWING', 'TEXT', 'SHAPE'), + + /** + * Shortcut key values + * @type {Object.} + */ + keyCodes: { + Z: 90, + Y: 89, + SHIFT: 16, + BACKSPACE: 8, + DEL: 46 + }, + + /** + * Fabric object options + * @type {Object.} + */ + fObjectOptions: { + SELECTION_STYLE: { + borderColor: 'red', + cornerColor: 'green', + cornerSize: 10, + originX: 'center', + originY: 'center', + transparentCorners: false + } + }, + + /** + * Promise reject messages + * @type {Object.} + */ + rejectMessages: { + flip: 'The flipX and flipY setting values are not changed.', + rotation: 'The current angle is same the old angle.', + loadImage: 'The background image is empty.', + isLock: 'The executing command state is locked.', + undo: 'The promise of undo command is reject.', + redo: 'The promise of redo command is reject.', + invalidDrawingMode: 'This operation is not supported in the drawing mode', + invalidParameters: 'Invalid parameters', + noActiveObject: 'There is no active object.', + unsupportedType: 'Unsupported object type', + noObject: 'The object is not in canvas.', + addedObject: 'The object is already added.' + }, + + /** + * Default icon menu svg path + * @type {Object.} + */ + defaultIconPath: { + 'icon-arrow': 'M40 12V0l24 24-24 24V36H0V12h40z', + 'icon-arrow-2': 'M49,32 H3 V22 h46 l-18,-18 h12 l23,23 L43,50 h-12 l18,-18 z ', + 'icon-arrow-3': 'M43.349998,27 L17.354,53 H1.949999 l25.996,-26 L1.949999,1 h15.404 L43.349998,27 z ', + 'icon-star': 'M35,54.557999 l-19.912001,10.468 l3.804,-22.172001 l-16.108,-15.7 l22.26,-3.236 L35,3.746 l9.956,20.172001 l22.26,3.236 l-16.108,15.7 l3.804,22.172001 z ', + 'icon-star-2': 'M17,31.212 l-7.194,4.08 l-4.728,-6.83 l-8.234,0.524 l-1.328,-8.226 l-7.644,-3.14 l2.338,-7.992 l-5.54,-6.18 l5.54,-6.176 l-2.338,-7.994 l7.644,-3.138 l1.328,-8.226 l8.234,0.522 l4.728,-6.83 L17,-24.312 l7.194,-4.08 l4.728,6.83 l8.234,-0.522 l1.328,8.226 l7.644,3.14 l-2.338,7.992 l5.54,6.178 l-5.54,6.178 l2.338,7.992 l-7.644,3.14 l-1.328,8.226 l-8.234,-0.524 l-4.728,6.83 z ', + 'icon-polygon': 'M3,31 L19,3 h32 l16,28 l-16,28 H19 z ', + 'icon-location': 'M24 62C8 45.503 0 32.837 0 24 0 10.745 10.745 0 24 0s24 10.745 24 24c0 8.837-8 21.503-24 38zm0-28c5.523 0 10-4.477 10-10s-4.477-10-10-10-10 4.477-10 10 4.477 10 10 10z', + 'icon-heart': 'M49.994999,91.349998 l-6.96,-6.333 C18.324001,62.606995 2.01,47.829002 2.01,29.690998 C2.01,14.912998 13.619999,3.299999 28.401001,3.299999 c8.349,0 16.362,5.859 21.594,12 c5.229,-6.141 13.242001,-12 21.591,-12 c14.778,0 26.390999,11.61 26.390999,26.390999 c0,18.138 -16.314001,32.916 -41.025002,55.374001 l-6.96,6.285 z ', + 'icon-bubble': 'M44 48L34 58V48H12C5.373 48 0 42.627 0 36V12C0 5.373 5.373 0 12 0h40c6.627 0 12 5.373 12 12v24c0 6.627-5.373 12-12 12h-8z' + }, + + defaultRotateRangeValus: { + realTimeEvent: true, + min: -360, + max: 360, + value: 0 + }, + + defaultDrawRangeValus: { + min: 5, + max: 30, + value: 12 + }, + + defaultShapeStrokeValus: { + realTimeEvent: false, + min: 2, + max: 300, + value: 3 + }, + + defaultTextRangeValus: { + realTimeEvent: true, + min: 10, + max: 100, + value: 50 + }, + + defaultFilterRangeValus: { + tintOpacityRange: { + min: 0, + max: 1, + value: 0.7 + }, + removewhiteThresholdRange: { + min: 0, + max: 255, + value: 60 + }, + removewhiteDistanceRange: { + min: 0, + max: 255, + value: 10 + }, + gradientTransparencyRange: { + min: 0, + max: 255, + value: 100 + }, + brightnessRange: { + min: -255, + max: 255, + value: 100 + }, + noiseRange: { + min: 0, + max: 1000, + value: 100 + }, + pixelateRange: { + min: 2, + max: 20, + value: 4 + }, + colorfilterThresholeRange: { + min: 0, + max: 255, + value: 45 + } + } + }; /** + * @author NHN Ent. FE Development Team + * @fileoverview Constants + */ + +/***/ }), +/* 74 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _tuiCodeSnippet = __webpack_require__(3); + + var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + + var _util = __webpack_require__(72); + + var _util2 = _interopRequireDefault(_util); + + var _mainContainer = __webpack_require__(75); + + var _mainContainer2 = _interopRequireDefault(_mainContainer); + + var _controls = __webpack_require__(76); + + var _controls2 = _interopRequireDefault(_controls); + + var _theme = __webpack_require__(77); + + var _theme2 = _interopRequireDefault(_theme); + + var _shape = __webpack_require__(80); + + var _shape2 = _interopRequireDefault(_shape); + + var _crop = __webpack_require__(86); + + var _crop2 = _interopRequireDefault(_crop); + + var _flip = __webpack_require__(88); + + var _flip2 = _interopRequireDefault(_flip); + + var _rotate = __webpack_require__(90); + + var _rotate2 = _interopRequireDefault(_rotate); + + var _text = __webpack_require__(92); + + var _text2 = _interopRequireDefault(_text); + + var _mask = __webpack_require__(94); + + var _mask2 = _interopRequireDefault(_mask); + + var _icon = __webpack_require__(96); + + var _icon2 = _interopRequireDefault(_icon); + + var _draw = __webpack_require__(98); + + var _draw2 = _interopRequireDefault(_draw); + + var _filter = __webpack_require__(100); + + var _filter2 = _interopRequireDefault(_filter); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + var SUB_UI_COMPONENT = { + Shape: _shape2.default, + Crop: _crop2.default, + Flip: _flip2.default, + Rotate: _rotate2.default, + Text: _text2.default, + Mask: _mask2.default, + Icon: _icon2.default, + Draw: _draw2.default, + Filter: _filter2.default + }; + + var BI_EXPRESSION_MINSIZE_WHEN_TOP_POSITION = '1300'; + + /** + * Ui class + * @class + * @param {string|jQuery|HTMLElement} element - Wrapper's element or selector + * @param {Object} [options] - Ui setting options + * @param {number} option.loadImage - Init default load image + * @param {number} option.initMenu - Init start menu + * @param {Boolean} [option.menuBarPosition=bottom] - Let + * @param {Boolean} [option.applyCropSelectionStyle=false] - Let + * @param {Objecdt} actions - ui action instance + * @ignore + */ + + var Ui = function () { + function Ui(element, options, actions) { + _classCallCheck(this, Ui); + + this.options = this._initializeOption(options); + + this._actions = actions; + this.submenu = false; + this.imageSize = {}; + this.uiSize = {}; + this.theme = new _theme2.default(this.options.theme); + + this._submenuChangeTransection = false; + this._selectedElement = null; + this._mainElement = null; + this._editorElementWrap = null; + this._editorElement = null; + this._menuElement = null; + this._subMenuElement = null; + this._makeUiElement(element); + this._setUiSize(); + + this._els = { + 'undo': this._menuElement.querySelector('#tie-btn-undo'), + 'redo': this._menuElement.querySelector('#tie-btn-redo'), + 'reset': this._menuElement.querySelector('#tie-btn-reset'), + 'delete': this._menuElement.querySelector('#tie-btn-delete'), + 'deleteAll': this._menuElement.querySelector('#tie-btn-delete-all'), + 'download': this._selectedElement.querySelectorAll('.tui-image-editor-download-btn'), + 'load': this._selectedElement.querySelectorAll('.tui-image-editor-load-btn') + }; + + this._makeSubMenu(); + } + + /** + * Set Default Selection for includeUI + * @param {Object} option - imageEditor options + * @returns {Object} - extends selectionStyle option + */ + + + _createClass(Ui, [{ + key: 'setUiDefaultSelectionStyle', + value: function setUiDefaultSelectionStyle(option) { + return _tuiCodeSnippet2.default.extend({ + applyCropSelectionStyle: true, + applyGroupSelectionStyle: true, + selectionStyle: { + cornerStyle: 'circle', + cornerSize: 20, + cornerColor: '#fff', + cornerStrokeColor: '#000', + transparentCorners: false, + lineWidth: 2, + borderColor: '#fff' + } + }, option); + } + + /** + * Change editor size + * @param {Object} resizeInfo - ui & image size info + * @param {Object} resizeInfo.uiSize - image size dimension + * @param {Number} resizeInfo.uiSize.width - ui width + * @param {Number} resizeInfo.uiSize.height - ui height + * @param {Object} resizeInfo.imageSize - image size dimension + * @param {Number} resizeInfo.imageSize.oldWidth - old width + * @param {Number} resizeInfo.imageSize.oldHeight - old height + * @param {Number} resizeInfo.imageSize.newWidth - new width + * @param {Number} resizeInfo.imageSize.newHeight - new height + */ + + }, { + key: 'resizeEditor', + value: function resizeEditor() { + var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}, + uiSize = _ref.uiSize, + _ref$imageSize = _ref.imageSize, + imageSize = _ref$imageSize === undefined ? this.imageSize : _ref$imageSize; + + if (imageSize !== this.imageSize) { + this.imageSize = imageSize; + } + if (uiSize) { + this._setUiSize(uiSize); + } + + var _getEditorDimension2 = this._getEditorDimension(), + width = _getEditorDimension2.width, + height = _getEditorDimension2.height; + + var editorElementStyle = this._editorElement.style; + var menuBarPosition = this.options.menuBarPosition; + + + editorElementStyle.height = height + 'px'; + editorElementStyle.width = width + 'px'; + + var _getEditorPosition2 = this._getEditorPosition(menuBarPosition), + top = _getEditorPosition2.top, + bottom = _getEditorPosition2.bottom, + left = _getEditorPosition2.left, + right = _getEditorPosition2.right; + + this._editorElementWrap.style.bottom = bottom + 'px'; + this._editorElementWrap.style.top = top + 'px'; + this._editorElementWrap.style.left = left + 'px'; + this._editorElementWrap.style.width = 'calc(100% - ' + right + 'px)'; + var selectElementClassList = this._selectedElement.classList; + + if (menuBarPosition === 'top' && this._selectedElement.offsetWidth < BI_EXPRESSION_MINSIZE_WHEN_TOP_POSITION) { + selectElementClassList.add('tui-image-editor-top-optimization'); + } else { + selectElementClassList.remove('tui-image-editor-top-optimization'); + } + } + + /** + * Change undo button status + * @param {Boolean} enableStatus - enabled status + */ + + }, { + key: 'changeUndoButtonStatus', + value: function changeUndoButtonStatus(enableStatus) { + if (enableStatus) { + this._els.undo.classList.add('enabled'); + } else { + this._els.undo.classList.remove('enabled'); + } + } + + /** + * Change redo button status + * @param {Boolean} enableStatus - enabled status + */ + + }, { + key: 'changeRedoButtonStatus', + value: function changeRedoButtonStatus(enableStatus) { + if (enableStatus) { + this._els.redo.classList.add('enabled'); + } else { + this._els.redo.classList.remove('enabled'); + } + } + + /** + * Change reset button status + * @param {Boolean} enableStatus - enabled status + */ + + }, { + key: 'changeResetButtonStatus', + value: function changeResetButtonStatus(enableStatus) { + if (enableStatus) { + this._els.reset.classList.add('enabled'); + } else { + this._els.reset.classList.remove('enabled'); + } + } + + /** + * Change delete-all button status + * @param {Boolean} enableStatus - enabled status + */ + + }, { + key: 'changeDeleteAllButtonEnabled', + value: function changeDeleteAllButtonEnabled(enableStatus) { + if (enableStatus) { + this._els.deleteAll.classList.add('enabled'); + } else { + this._els.deleteAll.classList.remove('enabled'); + } + } + + /** + * Change delete button status + * @param {Boolean} enableStatus - enabled status + */ + + }, { + key: 'changeDeleteButtonEnabled', + value: function changeDeleteButtonEnabled(enableStatus) { + if (enableStatus) { + this._els['delete'].classList.add('enabled'); + } else { + this._els['delete'].classList.remove('enabled'); + } + } + + /** + * Change delete button status + * @param {Object} [options] - Ui setting options + * @param {number} option.loadImage - Init default load image + * @param {number} option.initMenu - Init start menu + * @param {Boolean} [option.menuBarPosition=bottom] - Let + * @param {Boolean} [option.applyCropSelectionStyle=false] - Let + * @returns {Object} initialize option + * @private + */ + + }, { + key: '_initializeOption', + value: function _initializeOption(options) { + return _tuiCodeSnippet2.default.extend({ + loadImage: { + path: '', + name: '' + }, + menuIconPath: '', + menu: ['crop', 'flip', 'rotate', 'draw', 'shape', 'icon', 'text', 'mask', 'filter'], + initMenu: false, + uiSize: { + width: '100%', + height: '100%' + }, + menuBarPosition: 'bottom' + }, options); + } + + /** + * Set ui container size + * @param {Object} uiSize - ui dimension + * @param {number} width - width + * @param {number} height - height + * @private + */ + + }, { + key: '_setUiSize', + value: function _setUiSize() { + var uiSize = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.options.uiSize; + + var elementDimension = this._selectedElement.style; + elementDimension.width = uiSize.width; + elementDimension.height = uiSize.height; + } + + /** + * Make submenu dom element + * @private + */ + + }, { + key: '_makeSubMenu', + value: function _makeSubMenu() { + var _this = this; + + _tuiCodeSnippet2.default.forEach(this.options.menu, function (menuName) { + var SubComponentClass = SUB_UI_COMPONENT[menuName.replace(/^[a-z]/, function ($0) { + return $0.toUpperCase(); + })]; + + // make menu element + _this._makeMenuElement(menuName); + + // menu btn element + _this._els[menuName] = _this._menuElement.querySelector('#tie-btn-' + menuName); + + // submenu ui instance + _this[menuName] = new SubComponentClass(_this._subMenuElement, { + iconStyle: _this.theme.getStyle('submenu.icon'), + menuBarPosition: _this.options.menuBarPosition + }); + }); + } + + /** + * Make primary ui dom element + * @param {string|jQuery|HTMLElement} element - Wrapper's element or selector + * @private + */ + + }, { + key: '_makeUiElement', + value: function _makeUiElement(element) { + var selectedElement = void 0; + + window.snippet = _tuiCodeSnippet2.default; + + if (element.jquery) { + selectedElement = element[0]; + } else if (element.nodeType) { + selectedElement = element; + } else { + selectedElement = document.querySelector(element); + } + var selector = _util2.default.getSelector(selectedElement); + + selectedElement.classList.add('tui-image-editor-container'); + selectedElement.innerHTML = (0, _controls2.default)({ + biImage: this.theme.getStyle('common.bi'), + iconStyle: this.theme.getStyle('menu.icon'), + loadButtonStyle: this.theme.getStyle('loadButton'), + downloadButtonStyle: this.theme.getStyle('downloadButton') + }) + (0, _mainContainer2.default)({ + biImage: this.theme.getStyle('common.bi'), + commonStyle: this.theme.getStyle('common'), + headerStyle: this.theme.getStyle('header'), + loadButtonStyle: this.theme.getStyle('loadButton'), + downloadButtonStyle: this.theme.getStyle('downloadButton'), + submenuStyle: this.theme.getStyle('submenu') + }); + + this._selectedElement = selectedElement; + this._selectedElement.classList.add(this.options.menuBarPosition); + + this._mainElement = selector('.tui-image-editor-main'); + this._editorElementWrap = selector('.tui-image-editor-wrap'); + this._editorElement = selector('.tui-image-editor'); + this._menuElement = selector('.tui-image-editor-menu'); + this._subMenuElement = selector('.tui-image-editor-submenu'); + } + + /** + * Make menu ui dom element + * @param {string} menuName - menu name + * @private + */ + + }, { + key: '_makeMenuElement', + value: function _makeMenuElement(menuName) { + var btnElement = document.createElement('li'); + + var _theme$getStyle = this.theme.getStyle('menu.icon'), + normal = _theme$getStyle.normal, + active = _theme$getStyle.active; + + var menuItemHtml = '\n \n \n \n \n '; + + btnElement.id = 'tie-btn-' + menuName; + btnElement.className = 'tui-image-editor-item'; + btnElement.title = menuName; + btnElement.innerHTML = menuItemHtml; + + this._menuElement.appendChild(btnElement); + } + + /** + * Add help action event + * @param {string} helpName - help menu name + * @private + */ + + }, { + key: '_addHelpActionEvent', + value: function _addHelpActionEvent(helpName) { + var _this2 = this; + + this._els[helpName].addEventListener('click', function () { + _this2._actions.main[helpName](); + }); + } + + /** + * Add download event + * @private + */ + + }, { + key: '_addDownloadEvent', + value: function _addDownloadEvent() { + var _this3 = this; + + _tuiCodeSnippet2.default.forEach(this._els.download, function (element) { + element.addEventListener('click', function () { + _this3._actions.main.download(); + }); + }); + } + + /** + * Add load event + * @private + */ + + }, { + key: '_addLoadEvent', + value: function _addLoadEvent() { + var _this4 = this; + + _tuiCodeSnippet2.default.forEach(this._els.load, function (element) { + element.addEventListener('change', function (event) { + _this4._actions.main.load(event.target.files[0]); + }); + }); + } + + /** + * Add menu event + * @param {string} menuName - menu name + * @private + */ + + }, { + key: '_addMenuEvent', + value: function _addMenuEvent(menuName) { + var _this5 = this; + + this._els[menuName].addEventListener('click', function () { + _this5.changeMenu(menuName); + }); + } + + /** + * Add menu event + * @param {string} menuName - menu name + * @private + */ + + }, { + key: '_addSubMenuEvent', + value: function _addSubMenuEvent(menuName) { + this[menuName].addEvent(this._actions[menuName]); + } + + /** + * get editor area element + * @returns {HTMLElement} editor area html element + */ + + }, { + key: 'getEditorArea', + value: function getEditorArea() { + return this._editorElement; + } + + /** + * Init canvas + */ + + }, { + key: 'initCanvas', + value: function initCanvas() { + var _this6 = this; + + var loadImageInfo = this._getLoadImage(); + if (loadImageInfo) { + this._actions.main.initLoadImage(loadImageInfo.path, loadImageInfo.name).then(function () { + _this6._addHelpActionEvent('undo'); + _this6._addHelpActionEvent('redo'); + _this6._addHelpActionEvent('reset'); + _this6._addHelpActionEvent('delete'); + _this6._addHelpActionEvent('deleteAll'); + + _this6._addDownloadEvent(); + _this6._addLoadEvent(); + + _tuiCodeSnippet2.default.forEach(_this6.options.menu, function (menuName) { + _this6._addMenuEvent(menuName); + _this6._addSubMenuEvent(menuName); + }); + _this6._initMenu(); + }); + } + + var gridVisual = document.createElement('div'); + gridVisual.className = 'tui-image-editor-grid-visual'; + var grid = '\n \n \n \n
'; + gridVisual.innerHTML = grid; + this._editorContainerElement = this._editorElement.querySelector('.tui-image-editor-canvas-container'); + this._editorContainerElement.appendChild(gridVisual); + } + + /** + * get editor area element + * @returns {Object} loadimage optionk + * @private + */ + + }, { + key: '_getLoadImage', + value: function _getLoadImage() { + return this.options.loadImage; + } + + /** + * change menu + * @param {string} menuName - menu name + * @param {boolean} toggle - whether toogle or not + * @param {boolean} discardSelection - discard selection + */ + + }, { + key: 'changeMenu', + value: function changeMenu(menuName) { + var toggle = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true; + var discardSelection = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true; + + if (!this._submenuChangeTransection) { + this._submenuChangeTransection = true; + this._changeMenu(menuName, toggle, discardSelection); + this._submenuChangeTransection = false; + } + } + + /** + * change menu + * @param {string} menuName - menu name + * @param {boolean} toggle - whether toogle or not + * @param {boolean} discardSelection - discard selection + * @private + */ + + }, { + key: '_changeMenu', + value: function _changeMenu(menuName, toggle, discardSelection) { + if (this.submenu) { + this._els[this.submenu].classList.remove('active'); + this._mainElement.classList.remove('tui-image-editor-menu-' + this.submenu); + if (discardSelection) { + this._actions.main.discardSelection(); + } + this._actions.main.changeSelectableAll(true); + this[this.submenu].changeStandbyMode(); + } + + if (this.submenu === menuName && toggle) { + this.submenu = null; + } else { + this._els[menuName].classList.add('active'); + this._mainElement.classList.add('tui-image-editor-menu-' + menuName); + this.submenu = menuName; + this[this.submenu].changeStartMode(); + } + + this.resizeEditor(); + } + + /** + * Init menu + * @private + */ + + }, { + key: '_initMenu', + value: function _initMenu() { + if (this.options.initMenu) { + var evt = document.createEvent('MouseEvents'); + evt.initEvent('click', true, false); + this._els[this.options.initMenu].dispatchEvent(evt); + if (this.icon) { + this.icon.registDefaultIcon(); + } + } + } + + /** + * Get editor dimension + * @returns {Object} - width & height of editor + * @private + */ + + }, { + key: '_getEditorDimension', + value: function _getEditorDimension() { + var maxHeight = parseFloat(this._editorContainerElement.style.maxHeight); + var height = this.imageSize.newHeight > maxHeight ? maxHeight : this.imageSize.newHeight; + + var maxWidth = parseFloat(this._editorContainerElement.style.maxWidth); + var width = this.imageSize.newWidth > maxWidth ? maxWidth : this.imageSize.newWidth; + + return { + width: width, + height: height + }; + } + + /** + * Get editor position + * @param {string} menuBarPosition - top or right or bottom or left + * @returns {Object} - positions (top, right, bottom, left) + * @private + */ + + }, { + key: '_getEditorPosition', + value: function _getEditorPosition(menuBarPosition) { + var bottom = 0; + var top = 0; + var left = 0; + var right = 0; + + if (this.submenu) { + switch (menuBarPosition) { + case 'bottom': + bottom += 150; + break; + case 'top': + top += 150; + break; + case 'left': + left += 248; + right += 248; + break; + case 'right': + right += 248; + break; + default: + break; + } + } + + return { + top: top, + bottom: bottom, + left: left, + right: right + }; + } + }]); + + return Ui; + }(); + + exports.default = Ui; + +/***/ }), +/* 75 */ +/***/ (function(module, exports) { + + "use strict"; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + exports.default = function (_ref) { + var biImage = _ref.biImage, + commonStyle = _ref.commonStyle, + headerStyle = _ref.headerStyle, + loadButtonStyle = _ref.loadButtonStyle, + downloadButtonStyle = _ref.downloadButtonStyle, + submenuStyle = _ref.submenuStyle; + return "\n
\n
\n
\n \n
\n
\n \n \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n"; + }; + +/***/ }), +/* 76 */ +/***/ (function(module, exports) { + + "use strict"; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + exports.default = function (_ref) { + var biImage = _ref.biImage, + _ref$iconStyle = _ref.iconStyle, + normal = _ref$iconStyle.normal, + active = _ref$iconStyle.active, + loadButtonStyle = _ref.loadButtonStyle, + downloadButtonStyle = _ref.downloadButtonStyle; + return "\n
\n
\n \n
\n
    \n
  • \n \n \n \n \n
    • \n
  • \n \n \n \n \n
    • \n
  • \n \n \n \n \n
    • \n
  • \n
    \n
    • \n
  • \n \n \n \n \n
    • \n
  • \n \n \n \n \n
    • \n
  • \n
    \n
    • \n
\n\n
\n \n \n
\n
\n"; + }; + +/***/ }), +/* 77 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _tuiCodeSnippet = __webpack_require__(3); + + var _util = __webpack_require__(72); + + var _style = __webpack_require__(78); + + var _style2 = _interopRequireDefault(_style); + + var _standard = __webpack_require__(79); + + var _standard2 = _interopRequireDefault(_standard); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + /** + * Theme manager + * @class + * @param {Object} customTheme - custom theme + * @ignore + */ + var Theme = function () { + function Theme(customTheme) { + _classCallCheck(this, Theme); + + this.styles = this._changeToObject((0, _tuiCodeSnippet.extend)(_standard2.default, customTheme)); + (0, _util.styleLoad)(this._styleMaker()); + } + + /** + * Get a Style cssText or StyleObject + * @param {string} type - style type + * @returns {string|object} - cssText or StyleObject + */ + + + _createClass(Theme, [{ + key: 'getStyle', + value: function getStyle(type) { + // eslint-disable-line + var result = null; + var firstProperty = type.replace(/\..+$/, ''); + var option = this.styles[type]; + switch (type) { + case 'common.bi': + result = this.styles[type].image; + break; + case 'menu.icon': + case 'submenu.icon': + result = { + active: this.styles[firstProperty + '.activeIcon'], + normal: this.styles[firstProperty + '.normalIcon'] + }; + break; + case 'submenu.label': + result = { + active: this._makeCssText(this.styles[firstProperty + '.activeLabel']), + normal: this._makeCssText(this.styles[firstProperty + '.normalLabel']) + }; + break; + case 'submenu.partition': + result = { + vertical: this._makeCssText((0, _tuiCodeSnippet.extend)({}, option, { borderLeft: '1px solid ' + option.color })), + horizontal: this._makeCssText((0, _tuiCodeSnippet.extend)({}, option, { borderBottom: '1px solid ' + option.color })) + }; + break; + case 'range.pointer': + case 'range.bar': + case 'range.subbar': + option.backgroundColor = option.color; + result = this._makeCssText(option); + break; + default: + result = this._makeCssText(option); + break; + } + + return result; + } + + /** + * Make css resource + * @returns {string} - serialized css text + * @private + */ + + }, { + key: '_styleMaker', + value: function _styleMaker() { + var submenuLabelStyle = this.getStyle('submenu.label'); + var submenuPartitionStyle = this.getStyle('submenu.partition'); + + return (0, _style2.default)({ + subMenuLabelActive: submenuLabelStyle.active, + subMenuLabelNormal: submenuLabelStyle.normal, + submenuPartitionVertical: submenuPartitionStyle.vertical, + submenuPartitionHorizontal: submenuPartitionStyle.horizontal, + biSize: this.getStyle('common.bisize'), + subMenuRangeTitle: this.getStyle('range.title'), + submenuRangePointer: this.getStyle('range.pointer'), + submenuRangeBar: this.getStyle('range.bar'), + submenuRangeSubbar: this.getStyle('range.subbar'), + submenuRangeValue: this.getStyle('range.value'), + submenuColorpickerTitle: this.getStyle('colorpicker.title'), + submenuColorpickerButton: this.getStyle('colorpicker.button'), + submenuCheckbox: this.getStyle('checkbox'), + menuIconSize: this.getStyle('menu.iconSize'), + submenuIconSize: this.getStyle('submenu.iconSize') + }); + } + + /** + * Change to low dimensional object. + * @param {object} styleOptions - style object of user interface + * @returns {object} low level object for style apply + * @private + */ + + }, { + key: '_changeToObject', + value: function _changeToObject(styleOptions) { + var styleObject = {}; + (0, _tuiCodeSnippet.forEach)(styleOptions, function (value, key) { + var keyExplode = key.match(/^(.+)\.([a-z]+)$/i); + var property = keyExplode[1], + subProperty = keyExplode[2]; + + + if (!styleObject[property]) { + styleObject[property] = {}; + } + styleObject[property][subProperty] = value; + }); + + return styleObject; + } + + /** + * Style object to Csstext serialize + * @param {object} styleObject - style object + * @returns {string} - css text string + * @private + */ + + }, { + key: '_makeCssText', + value: function _makeCssText(styleObject) { + var _this = this; + + var converterStack = []; + + (0, _tuiCodeSnippet.forEach)(styleObject, function (value, key) { + if (['backgroundImage'].indexOf(key) > -1 && value !== 'none') { + value = 'url(' + value + ')'; + } + converterStack.push(_this._toUnderScore(key) + ': ' + value); + }); + + return converterStack.join(';'); + } + + /** + * Camel key string to Underscore string + * @param {string} targetString - change target + * @returns {string} + * @private + */ + + }, { + key: '_toUnderScore', + value: function _toUnderScore(targetString) { + return targetString.replace(/([A-Z])/g, function ($0, $1) { + return '-' + $1.toLowerCase(); + }); + } + }]); + + return Theme; + }(); + + exports.default = Theme; + +/***/ }), +/* 78 */ +/***/ (function(module, exports) { + + "use strict"; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + exports.default = function (_ref) { + var subMenuLabelActive = _ref.subMenuLabelActive, + subMenuLabelNormal = _ref.subMenuLabelNormal, + subMenuRangeTitle = _ref.subMenuRangeTitle, + submenuPartitionVertical = _ref.submenuPartitionVertical, + submenuPartitionHorizontal = _ref.submenuPartitionHorizontal, + submenuCheckbox = _ref.submenuCheckbox, + submenuRangePointer = _ref.submenuRangePointer, + submenuRangeValue = _ref.submenuRangeValue, + submenuColorpickerTitle = _ref.submenuColorpickerTitle, + submenuColorpickerButton = _ref.submenuColorpickerButton, + submenuRangeBar = _ref.submenuRangeBar, + submenuRangeSubbar = _ref.submenuRangeSubbar, + submenuIconSize = _ref.submenuIconSize, + menuIconSize = _ref.menuIconSize, + biSize = _ref.biSize; + return "\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype=\"icon-bubble\"] label,\n #tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype=\"icon-heart\"] label,\n #tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype=\"icon-location\"] label,\n #tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype=\"icon-polygon\"] label,\n #tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype=\"icon-star\"] label,\n #tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype=\"icon-arrow-3\"] label,\n #tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype=\"icon-arrow-2\"] label,\n #tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype=\"icon-arrow\"] label,\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype=\"icon-bubble\"] label,\n #tie-draw-line-select-button.line .tui-image-editor-button.line label,\n #tie-draw-line-select-button.free .tui-image-editor-button.free label,\n #tie-flip-button.flipX .tui-image-editor-button.flipX label,\n #tie-flip-button.flipY .tui-image-editor-button.flipY label,\n #tie-flip-button.resetFlip .tui-image-editor-button.resetFlip label,\n #tie-crop-button .tui-image-editor-button.apply.active label,\n #tie-shape-button.rect .tui-image-editor-button.rect label,\n #tie-shape-button.circle .tui-image-editor-button.circle label,\n #tie-shape-button.triangle .tui-image-editor-button.triangle label,\n #tie-text-effect-button .tui-image-editor-button.active label,\n #tie-text-align-button.left .tui-image-editor-button.left label,\n #tie-text-align-button.center .tui-image-editor-button.center label,\n #tie-text-align-button.right .tui-image-editor-button.right label,\n #tie-mask-apply.apply.active .tui-image-editor-button.apply label,\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover > label,\n .tui-image-editor-container .tui-image-editor-checkbox input + label {\n " + subMenuLabelActive + "\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button > label,\n .tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label {\n " + subMenuLabelNormal + "\n }\n .tui-image-editor-container .tui-image-editor-range-wrap label {\n " + subMenuRangeTitle + "\n }\n .tui-image-editor-container .tui-image-editor-partition > div {\n " + submenuPartitionVertical + "\n }\n .tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition > div,\n .tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition > div {\n " + submenuPartitionHorizontal + "\n }\n .tui-image-editor-container .tui-image-editor-checkbox input + label:before {\n " + submenuCheckbox + "\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-pointer {\n " + submenuRangePointer + "\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-bar {\n " + submenuRangeBar + "\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-subbar {\n " + submenuRangeSubbar + "\n }\n .tui-image-editor-container .tui-image-editor-range-value {\n " + submenuRangeValue + "\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value + label {\n " + submenuColorpickerTitle + "\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value {\n " + submenuColorpickerButton + "\n }\n .tui-image-editor-container .svg_ic-menu {\n " + menuIconSize + "\n }\n .tui-image-editor-container .svg_ic-submenu {\n " + submenuIconSize + "\n }\n .tui-image-editor-container .tui-image-editor-controls-logo > img,\n .tui-image-editor-container .tui-image-editor-header-logo > img {\n " + biSize + "\n }\n\n"; + }; + +/***/ }), +/* 79 */ +/***/ (function(module, exports) { + + 'use strict'; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + /** + * @fileoverview The standard theme + * @author NHN Ent. FE Development Team + */ + + /** + * Full configuration for theme.
+ * @typedef {object} themeConfig + * @property {string} common.bi.image - Brand icon image + * @property {string} common.bisize.width - Icon image width + * @property {string} common.bisize.height - Icon Image Height + * @property {string} common.backgroundImage - Background image + * @property {string} common.backgroundColor - Background color + * @property {string} common.border - Full area border style + * @property {string} header.backgroundImage - header area background + * @property {string} header.backgroundColor - header area background color + * @property {string} header.border - header area border style + * @property {string} loadButton.backgroundColor - load button background color + * @property {string} loadButton.border - load button border style + * @property {string} loadButton.color - load button foreground color + * @property {string} loadButton.fontFamily - load button font type + * @property {string} loadButton.fontSize - load button font size + * @property {string} downloadButton.backgroundColor - download button background color + * @property {string} downloadButton.border - download button border style + * @property {string} downloadButton.color - download button foreground color + * @property {string} downloadButton.fontFamily - download button font type + * @property {string} downloadButton.fontSize - download button font size + * @property {string} menu.normalIcon.path - Menu default icon svg bundle file path + * @property {string} menu.normalIcon.name - Menu default icon svg bundle name + * @property {string} menu.activeIcon.path - Menu active icon svg bundle file path + * @property {string} menu.activeIcon.name - Menu active icon svg bundle name + * @property {string} menu.iconSize.width - Menu icon Size Width + * @property {string} menu.iconSize.height - Menu Icon Size Height + * @property {string} submenu.backgroundColor - Sub-menu area background color + * @property {string} submenu.partition.color - Submenu partition line color + * @property {string} submenu.normalIcon.path - Submenu default icon svg bundle file path + * @property {string} submenu.normalIcon.name - Submenu default icon svg bundle name + * @property {string} submenu.activeIcon.path - Submenu active icon svg bundle file path + * @property {string} submenu.activeIcon.name - Submenu active icon svg bundle name + * @property {string} submenu.iconSize.width - Submenu icon Size Width + * @property {string} submenu.iconSize.height - Submenu Icon Size Height + * @property {string} submenu.normalLabel.color - Submenu default label color + * @property {string} submenu.normalLabel.fontWeight - Sub Menu Default Label Font Thickness + * @property {string} submenu.activeLabel.color - Submenu active label color + * @property {string} submenu.activeLabel.fontWeight - Submenu active label Font thickness + * @property {string} checkbox.border - Checkbox border style + * @property {string} checkbox.backgroundColor - Checkbox background color + * @property {string} range.pointer.color - range control pointer color + * @property {string} range.bar.color - range control bar color + * @property {string} range.subbar.color - range control subbar color + * @property {string} range.value.color - range number box font color + * @property {string} range.value.fontWeight - range number box font thickness + * @property {string} range.value.fontSize - range number box font size + * @property {string} range.value.border - range number box border style + * @property {string} range.value.backgroundColor - range number box background color + * @property {string} range.title.color - range title font color + * @property {string} range.title.fontWeight - range title font weight + * @property {string} colorpicker.button.border - colorpicker button border style + * @property {string} colorpicker.title.color - colorpicker button title font color + * @example + // default keys and styles + var customTheme = { + 'common.bi.image': 'https://uicdn.toast.com/toastui/img/tui-image-editor-bi.png', + 'common.bisize.width': '251px', + 'common.bisize.height': '21px', + 'common.backgroundImage': 'none', + 'common.backgroundColor': '#1e1e1e', + 'common.border': '0px', + + // header + 'header.backgroundImage': 'none', + 'header.backgroundColor': 'transparent', + 'header.border': '0px', + + // load button + 'loadButton.backgroundColor': '#fff', + 'loadButton.border': '1px solid #ddd', + 'loadButton.color': '#222', + 'loadButton.fontFamily': 'NotoSans, sans-serif', + 'loadButton.fontSize': '12px', + + // download button + 'downloadButton.backgroundColor': '#fdba3b', + 'downloadButton.border': '1px solid #fdba3b', + 'downloadButton.color': '#fff', + 'downloadButton.fontFamily': 'NotoSans, sans-serif', + 'downloadButton.fontSize': '12px', + + // main icons + 'menu.normalIcon.path': '../dist/svg/icon-b.svg', + 'menu.normalIcon.name': 'icon-b', + 'menu.activeIcon.path': '../dist/svg/icon-a.svg', + 'menu.activeIcon.name': 'icon-a', + 'menu.iconSize.width': '24px', + 'menu.iconSize.height': '24px', + + // submenu primary color + 'submenu.backgroundColor': '#1e1e1e', + 'submenu.partition.color': '#858585', + + // submenu icons + 'submenu.normalIcon.path': '../dist/svg/icon-a.svg', + 'submenu.normalIcon.name': 'icon-a', + 'submenu.activeIcon.path': '../dist/svg/icon-c.svg', + 'submenu.activeIcon.name': 'icon-c', + 'submenu.iconSize.width': '32px', + 'submenu.iconSize.height': '32px', + + // submenu labels + 'submenu.normalLabel.color': '#858585', + 'submenu.normalLabel.fontWeight': 'lighter', + 'submenu.activeLabel.color': '#fff', + 'submenu.activeLabel.fontWeight': 'lighter', + + // checkbox style + 'checkbox.border': '1px solid #ccc', + 'checkbox.backgroundColor': '#fff', + + // rango style + 'range.pointer.color': '#fff', + 'range.bar.color': '#666', + 'range.subbar.color': '#d1d1d1', + 'range.value.color': '#fff', + 'range.value.fontWeight': 'lighter', + 'range.value.fontSize': '11px', + 'range.value.border': '1px solid #353535', + 'range.value.backgroundColor': '#151515', + 'range.title.color': '#fff', + 'range.title.fontWeight': 'lighter', + + // colorpicker style + 'colorpicker.button.border': '1px solid #1e1e1e', + 'colorpicker.title.color': '#fff' + }; + */ + exports.default = { + 'common.bi.image': 'https://uicdn.toast.com/toastui/img/tui-image-editor-bi.png', + 'common.bisize.width': '251px', + 'common.bisize.height': '21px', + 'common.backgroundImage': 'none', + 'common.backgroundColor': '#1e1e1e', + 'common.border': '0px', + + // header + 'header.backgroundImage': 'none', + 'header.backgroundColor': 'transparent', + 'header.border': '0px', + + // load button + 'loadButton.backgroundColor': '#fff', + 'loadButton.border': '1px solid #ddd', + 'loadButton.color': '#222', + 'loadButton.fontFamily': 'NotoSans, sans-serif', + 'loadButton.fontSize': '12px', + + // download button + 'downloadButton.backgroundColor': '#fdba3b', + 'downloadButton.border': '1px solid #fdba3b', + 'downloadButton.color': '#fff', + 'downloadButton.fontFamily': 'NotoSans, sans-serif', + 'downloadButton.fontSize': '12px', + + // main icons + 'menu.normalIcon.path': 'icon-b.svg', + 'menu.normalIcon.name': 'icon-b', + 'menu.activeIcon.path': 'icon-a.svg', + 'menu.activeIcon.name': 'icon-a', + 'menu.iconSize.width': '24px', + 'menu.iconSize.height': '24px', + + // submenu primary color + 'submenu.backgroundColor': 'transparent', + 'submenu.partition.color': '#858585', + + // submenu icons + 'submenu.normalIcon.path': 'icon-a.svg', + 'submenu.normalIcon.name': 'icon-a', + 'submenu.activeIcon.path': 'icon-c.svg', + 'submenu.activeIcon.name': 'icon-c', + 'submenu.iconSize.width': '32px', + 'submenu.iconSize.height': '32px', + + // submenu labels + 'submenu.normalLabel.color': '#858585', + 'submenu.normalLabel.fontWeight': 'lighter', + 'submenu.activeLabel.color': '#fff', + 'submenu.activeLabel.fontWeight': 'lighter', + + // checkbox style + 'checkbox.border': '1px solid #ccc', + 'checkbox.backgroundColor': '#fff', + + // rango style + 'range.pointer.color': '#fff', + 'range.bar.color': '#666', + 'range.subbar.color': '#d1d1d1', + 'range.value.color': '#fff', + 'range.value.fontWeight': 'lighter', + 'range.value.fontSize': '11px', + 'range.value.border': '1px solid #353535', + 'range.value.backgroundColor': '#151515', + 'range.title.color': '#fff', + 'range.title.fontWeight': 'lighter', + + // colorpicker style + 'colorpicker.button.border': '1px solid #1e1e1e', + 'colorpicker.title.color': '#fff' + }; + +/***/ }), +/* 80 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _colorpicker = __webpack_require__(81); + + var _colorpicker2 = _interopRequireDefault(_colorpicker); + + var _range = __webpack_require__(83); + + var _range2 = _interopRequireDefault(_range); + + var _submenuBase = __webpack_require__(84); + + var _submenuBase2 = _interopRequireDefault(_submenuBase); + + var _shape = __webpack_require__(85); + + var _shape2 = _interopRequireDefault(_shape); + + var _util = __webpack_require__(72); + + var _consts = __webpack_require__(73); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } + + var SHAPE_DEFAULT_OPTION = { + stroke: '#ffbb3b', + fill: '', + strokeWidth: 3 + }; + + /** + * Shape ui class + * @class + * @ignore + */ + + var Shape = function (_Submenu) { + _inherits(Shape, _Submenu); + + function Shape(subMenuElement, _ref) { + var iconStyle = _ref.iconStyle, + menuBarPosition = _ref.menuBarPosition; + + _classCallCheck(this, Shape); + + var _this = _possibleConstructorReturn(this, (Shape.__proto__ || Object.getPrototypeOf(Shape)).call(this, subMenuElement, { + name: 'shape', + iconStyle: iconStyle, + menuBarPosition: menuBarPosition, + templateHtml: _shape2.default + })); + + _this.type = null; + _this.options = SHAPE_DEFAULT_OPTION; + + _this._els = { + shapeSelectButton: _this.selector('#tie-shape-button'), + shapeColorButton: _this.selector('#tie-shape-color-button'), + strokeRange: new _range2.default(_this.selector('#tie-stroke-range'), _consts.defaultShapeStrokeValus), + strokeRangeValue: _this.selector('#tie-stroke-range-value'), + fillColorpicker: new _colorpicker2.default(_this.selector('#tie-color-fill'), '', _this.toggleDirection), + strokeColorpicker: new _colorpicker2.default(_this.selector('#tie-color-stroke'), '#ffbb3b', _this.toggleDirection) + }; + return _this; + } + + /** + * Add event for shape + * @param {Object} actions - actions for shape + * @param {Function} actions.changeShape - change shape mode + * @param {Function} actions.setDrawingShape - set dreawing shape + */ + + + _createClass(Shape, [{ + key: 'addEvent', + value: function addEvent(actions) { + this.actions = actions; + + this._els.shapeSelectButton.addEventListener('click', this._changeShapeHandler.bind(this)); + this._els.strokeRange.on('change', this._changeStrokeRangeHandler.bind(this)); + this._els.fillColorpicker.on('change', this._changeFillColorHandler.bind(this)); + this._els.strokeColorpicker.on('change', this._changeStrokeColorHandler.bind(this)); + this._els.strokeRangeValue.value = this._els.strokeRange.value; + this._els.strokeRangeValue.setAttribute('readonly', true); + } + + /** + * Set Shape status + * @param {Object} options - options of shape status + * @param {string} strokeWidth - stroke width + * @param {string} strokeColor - stroke color + * @param {string} fillColor - fill color + */ + + }, { + key: 'setShapeStatus', + value: function setShapeStatus(_ref2) { + var strokeWidth = _ref2.strokeWidth, + strokeColor = _ref2.strokeColor, + fillColor = _ref2.fillColor; + + this._els.strokeRange.value = strokeWidth; + this._els.strokeRange.trigger('change'); + + this._els.strokeColorpicker.color = strokeColor; + this._els.fillColorpicker.color = fillColor; + this.options.stroke = strokeColor; + this.options.fill = fillColor; + this.options.strokeWidth = strokeWidth; + } + + /** + * Executed when the menu starts. + */ + + }, { + key: 'changeStartMode', + value: function changeStartMode() { + this.actions.stopDrawingMode(); + } + + /** + * Returns the menu to its default state. + */ + + }, { + key: 'changeStandbyMode', + value: function changeStandbyMode() { + this.type = null; + this.actions.changeSelectableAll(true); + this._els.shapeSelectButton.classList.remove('circle'); + this._els.shapeSelectButton.classList.remove('triangle'); + this._els.shapeSelectButton.classList.remove('rect'); + } + + /** + * set range stroke max value + * @param {number} maxValue - expect max value for change + */ + + }, { + key: 'setMaxStrokeValue', + value: function setMaxStrokeValue(maxValue) { + var strokeMaxValue = maxValue; + if (strokeMaxValue <= 0) { + strokeMaxValue = _consts.defaultShapeStrokeValus.max; + } + this._els.strokeRange.max = strokeMaxValue; + } + + /** + * Set stroke value + * @param {number} value - expect value for strokeRange change + */ + + }, { + key: 'setStrokeValue', + value: function setStrokeValue(value) { + this._els.strokeRange.value = value; + this._els.strokeRange.trigger('change'); + } + + /** + * Get stroke value + * @returns {number} - stroke range value + */ + + }, { + key: 'getStrokeValue', + value: function getStrokeValue() { + return this._els.strokeRange.value; + } + + /** + * Change icon color + * @param {object} event - add button event object + * @private + */ + + }, { + key: '_changeShapeHandler', + value: function _changeShapeHandler(event) { + var button = event.target.closest('.tui-image-editor-button'); + if (button) { + this.actions.stopDrawingMode(); + this.actions.discardSelection(); + var shapeType = this.getButtonType(button, ['circle', 'triangle', 'rect']); + + if (this.type === shapeType) { + this.changeStandbyMode(); + + return; + } + this.changeStandbyMode(); + this.type = shapeType; + event.currentTarget.classList.add(shapeType); + this.actions.changeSelectableAll(false); + this.actions.modeChange('shape'); + } + } + + /** + * Change stroke range + * @param {number} value - stroke range value + * @private + */ + + }, { + key: '_changeStrokeRangeHandler', + value: function _changeStrokeRangeHandler(value) { + this.options.strokeWidth = (0, _util.toInteger)(value); + this._els.strokeRangeValue.value = (0, _util.toInteger)(value); + + this.actions.changeShape({ + strokeWidth: value + }); + + this.actions.setDrawingShape(this.type, this.options); + } + + /** + * Change shape color + * @param {string} color - fill color + * @private + */ + + }, { + key: '_changeFillColorHandler', + value: function _changeFillColorHandler(color) { + color = color || 'transparent'; + this.options.fill = color; + this.actions.changeShape({ + fill: color + }); + } + + /** + * Change shape stroke color + * @param {string} color - fill color + * @private + */ + + }, { + key: '_changeStrokeColorHandler', + value: function _changeStrokeColorHandler(color) { + color = color || 'transparent'; + this.options.stroke = color; + this.actions.changeShape({ + stroke: color + }); + } + }]); + + return Shape; + }(_submenuBase2.default); + + exports.default = Shape; + +/***/ }), +/* 81 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _tuiCodeSnippet = __webpack_require__(3); + + var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + + var _util = __webpack_require__(72); + + var _tuiColorPicker = __webpack_require__(82); + + var _tuiColorPicker2 = _interopRequireDefault(_tuiColorPicker); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + var PICKER_COLOR = ['#000000', '#2a2a2a', '#545454', '#7e7e7e', '#a8a8a8', '#d2d2d2', '#ffffff', '', '#ff4040', '#ff6518', '#ffbb3b', '#03bd9e', '#00a9ff', '#515ce6', '#9e5fff', '#ff5583']; + + /** + * Colorpicker control class + * @class + * @ignore + */ + + var Colorpicker = function () { + function Colorpicker(colorpickerElement) { + var defaultColor = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '#7e7e7e'; + var toggleDirection = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'up'; + + _classCallCheck(this, Colorpicker); + + var title = colorpickerElement.getAttribute('title'); + + this._show = false; + + this._toggleDirection = toggleDirection; + this._makePickerButtonElement(colorpickerElement, defaultColor); + this._makePickerLayerElement(colorpickerElement, title); + this._color = defaultColor; + this.picker = _tuiColorPicker2.default.create({ + container: this.pickerElement, + preset: PICKER_COLOR, + color: defaultColor + }); + + this._addEvent(colorpickerElement); + } + + /** + * Get color + * @returns {Number} color value + */ + + + _createClass(Colorpicker, [{ + key: '_changeColorElement', + + + /** + * Change color element + * @param {string} color color value + * #private + */ + value: function _changeColorElement(color) { + if (color) { + this.colorElement.classList.remove('transparent'); + this.colorElement.style.backgroundColor = color; + } else { + this.colorElement.style.backgroundColor = '#fff'; + this.colorElement.classList.add('transparent'); + } + } + + /** + * Make picker button element + * @param {HTMLElement} colorpickerElement color picker element + * @param {string} defaultColor color value + * @private + */ + + }, { + key: '_makePickerButtonElement', + value: function _makePickerButtonElement(colorpickerElement, defaultColor) { + colorpickerElement.classList.add('tui-image-editor-button'); + + this.colorElement = document.createElement('div'); + this.colorElement.className = 'color-picker-value'; + if (defaultColor) { + this.colorElement.style.backgroundColor = defaultColor; + } else { + this.colorElement.classList.add('transparent'); + } + } + + /** + * Make picker layer element + * @param {HTMLElement} colorpickerElement color picker element + * @param {string} title picker title + * @private + */ + + }, { + key: '_makePickerLayerElement', + value: function _makePickerLayerElement(colorpickerElement, title) { + var label = document.createElement('label'); + var triangle = document.createElement('div'); + + this.pickerControl = document.createElement('div'); + this.pickerControl.className = 'color-picker-control'; + + this.pickerElement = document.createElement('div'); + this.pickerElement.className = 'color-picker'; + + label.innerHTML = title; + triangle.className = 'triangle'; + + this.pickerControl.appendChild(this.pickerElement); + this.pickerControl.appendChild(triangle); + + colorpickerElement.appendChild(this.pickerControl); + colorpickerElement.appendChild(this.colorElement); + colorpickerElement.appendChild(label); + + this._setPickerControlPosition(); + } + + /** + * Add event + * @param {HTMLElement} colorpickerElement color picker element + * @private + */ + + }, { + key: '_addEvent', + value: function _addEvent(colorpickerElement) { + var _this = this; + + this.picker.on('selectColor', function (value) { + _this._changeColorElement(value.color); + _this._color = value.color; + _this.fire('change', value.color); + }); + colorpickerElement.addEventListener('click', function (event) { + _this._show = !_this._show; + _this.pickerControl.style.display = _this._show ? 'block' : 'none'; + event.stopPropagation(); + }); + document.body.addEventListener('click', function () { + _this._show = false; + _this.pickerControl.style.display = 'none'; + }); + } + + /** + * Set picker control position + * @private + */ + + }, { + key: '_setPickerControlPosition', + value: function _setPickerControlPosition() { + var controlStyle = this.pickerControl.style; + var left = (0, _util.toInteger)(window.getComputedStyle(this.pickerControl, null).width) / 2 - 20; + var top = ((0, _util.toInteger)(window.getComputedStyle(this.pickerControl, null).height) + 12) * -1; + + if (this._toggleDirection === 'down') { + top = 30; + } + + controlStyle.top = top + 'px'; + controlStyle.left = '-' + left + 'px'; + } + }, { + key: 'color', + get: function get() { + return this._color; + } + + /** + * Set color + * @param {string} color color value + */ + , + set: function set(color) { + this._color = color; + this._changeColorElement(color); + } + }]); + + return Colorpicker; + }(); + + _tuiCodeSnippet2.default.CustomEvents.mixin(Colorpicker); + exports.default = Colorpicker; + +/***/ }), +/* 82 */ +/***/ (function(module, exports, __webpack_require__) { + + /*! + * Toast UI Colorpicker + * @version 2.2.0 + * @author NHNEnt FE Development Team + * @license MIT + */ + (function webpackUniversalModuleDefinition(root, factory) { + if(true) + module.exports = factory(__webpack_require__(3)); + else if(typeof define === 'function' && define.amd) + define(["tui-code-snippet"], factory); + else if(typeof exports === 'object') + exports["colorPicker"] = factory(require("tui-code-snippet")); + else + root["tui"] = root["tui"] || {}, root["tui"]["colorPicker"] = factory((root["tui"] && root["tui"]["util"])); + })(this, function(__WEBPACK_EXTERNAL_MODULE_8__) { + return /******/ (function(modules) { // webpackBootstrap + /******/ // The module cache + /******/ var installedModules = {}; + + /******/ // The require function + /******/ function __webpack_require__(moduleId) { + + /******/ // Check if module is in cache + /******/ if(installedModules[moduleId]) + /******/ return installedModules[moduleId].exports; + + /******/ // Create a new module (and put it into the cache) + /******/ var module = installedModules[moduleId] = { + /******/ exports: {}, + /******/ id: moduleId, + /******/ loaded: false + /******/ }; + + /******/ // Execute the module function + /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); + + /******/ // Flag the module as loaded + /******/ module.loaded = true; + + /******/ // Return the exports of the module + /******/ return module.exports; + /******/ } + + + /******/ // expose the modules object (__webpack_modules__) + /******/ __webpack_require__.m = modules; + + /******/ // expose the module cache + /******/ __webpack_require__.c = installedModules; + + /******/ // __webpack_public_path__ + /******/ __webpack_require__.p = "dist"; + + /******/ // Load entry module and return exports + /******/ return __webpack_require__(0); + /******/ }) + /************************************************************************/ + /******/ ([ + /* 0 */ + /***/ (function(module, exports, __webpack_require__) { + + __webpack_require__(1); + module.exports = __webpack_require__(6); + + + /***/ }), + /* 1 */ + /***/ (function(module, exports) { + + // removed by extract-text-webpack-plugin + + /***/ }), + /* 2 */, + /* 3 */, + /* 4 */, + /* 5 */, + /* 6 */ + /***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + var domutil = __webpack_require__(7); + var domevent = __webpack_require__(9); + var Collection = __webpack_require__(10); + var View = __webpack_require__(11); + var Drag = __webpack_require__(12); + var create = __webpack_require__(13); + var Palette = __webpack_require__(16); + var Slider = __webpack_require__(18); + var colorutil = __webpack_require__(14); + var svgvml = __webpack_require__(19); + + var colorPicker = { + domutil: domutil, + domevent: domevent, + Collection: Collection, + View: View, + Drag: Drag, + + create: create, + Palette: Palette, + Slider: Slider, + colorutil: colorutil, + svgvml: svgvml + }; + + module.exports = colorPicker; + + /***/ }), + /* 7 */ + /***/ (function(module, exports, __webpack_require__) { + + /** + * @fileoverview Utility modules for manipulate DOM elements. + * @author NHN Ent. FE Development Team + */ + + 'use strict'; + + var snippet = __webpack_require__(8); + var domevent = __webpack_require__(9); + var Collection = __webpack_require__(10); + + var util = snippet, + posKey = '_pos', + supportSelectStart = 'onselectstart' in document, + prevSelectStyle = '', + domutil, + userSelectProperty; + + var CSS_AUTO_REGEX = /^auto$|^$|%/; + + function trim(str) { + return str.replace(/^\s\s*/, '').replace(/\s\s*$/, ''); + } + + domutil = { + /** + * Create DOM element and return it. + * @param {string} tagName Tag name to append. + * @param {HTMLElement} [container] HTML element will be parent to created element. + * if not supplied, will use **document.body** + * @param {string} [className] Design class names to appling created element. + * @returns {HTMLElement} HTML element created. + */ + appendHTMLElement: function (tagName, container, className) { + var el; + + className = className || ''; + + el = document.createElement(tagName); + el.className = className; + + if (container) { + container.appendChild(el); + } else { + document.body.appendChild(el); + } + + return el; + }, + + /** + * Remove element from parent node. + * @param {HTMLElement} el - element to remove. + */ + remove: function (el) { + if (el && el.parentNode) { + el.parentNode.removeChild(el); + } + }, + + /** + * Get element by id + * @param {string} id element id attribute + * @returns {HTMLElement} element + */ + get: function (id) { + return document.getElementById(id); + }, + + /** + * Check supplied element is matched selector. + * @param {HTMLElement} el - element to check + * @param {string} selector - selector string to check + * @returns {boolean} match? + */ + _matcher: function (el, selector) { + var cssClassSelector = /^\./, + idSelector = /^#/; + + if (cssClassSelector.test(selector)) { + return domutil.hasClass(el, selector.replace('.', '')); + } else if (idSelector.test(selector)) { + return el.id === selector.replace('#', ''); + } + + return el.nodeName.toLowerCase() === selector.toLowerCase(); + }, + + /** + * Find DOM element by specific selectors. + * below three selector only supported. + * + * 1. css selector + * 2. id selector + * 3. nodeName selector + * @param {string} selector selector + * @param {(HTMLElement|string)} [root] You can assign root element to find. if not supplied, document.body will use. + * @param {boolean|function} [multiple=false] - set true then return all elements that meet condition, if set function then use it filter function. + * @returns {HTMLElement} HTML element finded. + */ + find: function (selector, root, multiple) { + var result = [], + found = false, + isFirst = util.isUndefined(multiple) || multiple === false, + isFilter = util.isFunction(multiple); + + if (util.isString(root)) { + root = domutil.get(root); + } + + root = root || window.document.body; + + function recurse(el, selector) { + var childNodes = el.childNodes, + i = 0, + len = childNodes.length, + cursor; + + for (; i < len; i += 1) { + cursor = childNodes[i]; + + if (cursor.nodeName === '#text') { + continue; + } + + if (domutil._matcher(cursor, selector)) { + if (isFilter && multiple(cursor) || !isFilter) { + result.push(cursor); + } + + if (isFirst) { + found = true; + break; + } + } else if (cursor.childNodes.length > 0) { + recurse(cursor, selector); + if (found) { + break; + } + } + } + } + + recurse(root, selector); + + return isFirst ? result[0] || null : result; + }, + + /** + * Find parent element recursively. + * @param {HTMLElement} el - base element to start find. + * @param {string} selector - selector string for find + * @returns {HTMLElement} - element finded or undefined. + */ + closest: function (el, selector) { + var parent = el.parentNode; + + if (domutil._matcher(el, selector)) { + return el; + } + + while (parent && parent !== window.document.body) { + if (domutil._matcher(parent, selector)) { + return parent; + } + + parent = parent.parentNode; + } + }, + + /** + * Return texts inside element. + * @param {HTMLElement} el target element + * @returns {string} text inside node + */ + text: function (el) { + var ret = '', + i = 0, + nodeType = el.nodeType; + + if (nodeType) { + if (nodeType === 1 || nodeType === 9 || nodeType === 11) { + // nodes that available contain other nodes + if (typeof el.textContent === 'string') { + return el.textContent; + } + + for (el = el.firstChild; el; el = el.nextSibling) { + ret += domutil.text(el); + } + } else if (nodeType === 3 || nodeType === 4) { + // TEXT, CDATA SECTION + return el.nodeValue; + } + } else { + for (; el[i]; i += 1) { + ret += domutil.text(el[i]); + } + } + + return ret; + }, + + /** + * Set data attribute to target element + * @param {HTMLElement} el - element to set data attribute + * @param {string} key - key + * @param {string|number} data - data value + */ + setData: function (el, key, data) { + if ('dataset' in el) { + el.dataset[key] = data; + + return; + } + + el.setAttribute('data-' + key, data); + }, + + /** + * Get data value from data-attribute + * @param {HTMLElement} el - target element + * @param {string} key - key + * @returns {string} value + */ + getData: function (el, key) { + if ('dataset' in el) { + return el.dataset[key]; + } + + return el.getAttribute('data-' + key); + }, + + /** + * Check element has specific design class name. + * @param {HTMLElement} el target element + * @param {string} name css class + * @returns {boolean} return true when element has that css class name + */ + hasClass: function (el, name) { + var className; + + if (!util.isUndefined(el.classList)) { + return el.classList.contains(name); + } + + className = domutil.getClass(el); + + return className.length > 0 && new RegExp('(^|\\s)' + name + '(\\s|$)').test(className); + }, + + /** + * Add design class to HTML element. + * @param {HTMLElement} el target element + * @param {string} name css class name + */ + addClass: function (el, name) { + var className; + + if (!util.isUndefined(el.classList)) { + util.forEachArray(name.split(' '), function (value) { + el.classList.add(value); + }); + } else if (!domutil.hasClass(el, name)) { + className = domutil.getClass(el); + domutil.setClass(el, (className ? className + ' ' : '') + name); + } + }, + + /** + * + * Overwrite design class to HTML element. + * @param {HTMLElement} el target element + * @param {string} name css class name + */ + setClass: function (el, name) { + if (util.isUndefined(el.className.baseVal)) { + el.className = name; + } else { + el.className.baseVal = name; + } + }, + + /** + * Element에 cssClass속성을 제거하는 메서드 + * Remove specific design class from HTML element. + * @param {HTMLElement} el target element + * @param {string} name class name to remove + */ + removeClass: function (el, name) { + var removed = ''; + + if (!util.isUndefined(el.classList)) { + el.classList.remove(name); + } else { + removed = (' ' + domutil.getClass(el) + ' ').replace(' ' + name + ' ', ' '); + domutil.setClass(el, trim(removed)); + } + }, + + /** + * Get HTML element's design classes. + * @param {HTMLElement} el target element + * @returns {string} element css class name + */ + getClass: function (el) { + if (!el || !el.className) { + return ''; + } + + return util.isUndefined(el.className.baseVal) ? el.className : el.className.baseVal; + }, + + /** + * Get specific CSS style value from HTML element. + * @param {HTMLElement} el target element + * @param {string} style css attribute name + * @returns {(string|null)} css style value + */ + getStyle: function (el, style) { + var value = el.style[style] || el.currentStyle && el.currentStyle[style], + css; + + if ((!value || value === 'auto') && document.defaultView) { + css = document.defaultView.getComputedStyle(el, null); + value = css ? css[style] : null; + } + + return value === 'auto' ? null : value; + }, + + /** + * get element's computed style values. + * + * in lower IE8. use polyfill function that return object. it has only one function 'getPropertyValue' + * @param {HTMLElement} el - element want to get style. + * @returns {object} virtual CSSStyleDeclaration object. + */ + getComputedStyle: function (el) { + var defaultView = document.defaultView; + + if (!defaultView || !defaultView.getComputedStyle) { + return { + getPropertyValue: function (prop) { + var re = /(\-([a-z]){1})/g; + if (prop === 'float') { + prop = 'styleFloat'; + } + + if (re.test(prop)) { + prop = prop.replace(re, function () { + return arguments[2].toUpperCase(); + }); + } + + return el.currentStyle[prop] ? el.currentStyle[prop] : null; + } + }; + } + + return document.defaultView.getComputedStyle(el); + }, + + /** + * Set position CSS style. + * @param {HTMLElement} el target element + * @param {number} [x=0] left pixel value. + * @param {number} [y=0] top pixel value. + */ + setPosition: function (el, x, y) { + x = util.isUndefined(x) ? 0 : x; + y = util.isUndefined(y) ? 0 : y; + + el[posKey] = [x, y]; + + el.style.left = x + 'px'; + el.style.top = y + 'px'; + }, + + /** + * Get position from HTML element. + * @param {HTMLElement} el target element + * @param {boolean} [clear=false] clear cache before calculating position. + * @returns {number[]} point + */ + getPosition: function (el, clear) { + var left, top, bound; + + if (clear) { + el[posKey] = null; + } + + if (el[posKey]) { + return el[posKey]; + } + + left = 0; + top = 0; + + if ((CSS_AUTO_REGEX.test(el.style.left) || CSS_AUTO_REGEX.test(el.style.top)) && 'getBoundingClientRect' in el) { + // 엘리먼트의 left또는 top이 'auto'일 때 수단 + bound = el.getBoundingClientRect(); + + left = bound.left; + top = bound.top; + } else { + left = parseFloat(el.style.left || 0); + top = parseFloat(el.style.top || 0); + } + + return [left, top]; + }, + + /** + * Return element's size + * @param {HTMLElement} el target element + * @returns {number[]} width, height + */ + getSize: function (el) { + var bound, + width = domutil.getStyle(el, 'width'), + height = domutil.getStyle(el, 'height'); + + if ((CSS_AUTO_REGEX.test(width) || CSS_AUTO_REGEX.test(height)) && 'getBoundingClientRect' in el) { + bound = el.getBoundingClientRect(); + width = bound.width; + height = bound.height; + } else { + width = parseFloat(width || 0); + height = parseFloat(height || 0); + } + + return [width, height]; + }, + + /** + * Check specific CSS style is available. + * @param {array} props property name to testing + * @returns {(string|boolean)} return true when property is available + * @example + * var props = ['transform', '-webkit-transform']; + * domutil.testProp(props); // 'transform' + */ + testProp: function (props) { + var style = document.documentElement.style, + i = 0, + len = props.length; + + for (; i < len; i += 1) { + if (props[i] in style) { + return props[i]; + } + } + + return false; + }, + + /** + * Get form data + * @param {HTMLFormElement} formElement - form element to extract data + * @returns {object} form data + */ + getFormData: function (formElement) { + var groupedByName = new Collection(function () { + return this.length; + }), + noDisabledFilter = function (el) { + return !el.disabled; + }, + output = {}; + + groupedByName.add.apply(groupedByName, domutil.find('input', formElement, noDisabledFilter).concat(domutil.find('select', formElement, noDisabledFilter)).concat(domutil.find('textarea', formElement, noDisabledFilter))); + + groupedByName = groupedByName.groupBy(function (el) { + return el && el.getAttribute('name') || '_other'; + }); + + util.forEach(groupedByName, function (elements, name) { + if (name === '_other') { + return; + } + + elements.each(function (el) { + var nodeName = el.nodeName.toLowerCase(), + type = el.type, + result = []; + + if (type === 'radio') { + result = [elements.find(function (el) { + return el.checked; + }).toArray().pop()]; + } else if (type === 'checkbox') { + result = elements.find(function (el) { + return el.checked; + }).toArray(); + } else if (nodeName === 'select') { + elements.find(function (el) { + return !!el.childNodes.length; + }).each(function (el) { + result = result.concat(domutil.find('option', el, function (opt) { + return opt.selected; + })); + }); + } else { + result = elements.find(function (el) { + return el.value !== ''; + }).toArray(); + } + + result = util.map(result, function (el) { + return el.value; + }); + + if (!result.length) { + result = ''; + } else if (result.length === 1) { + result = result[0]; + } + + output[name] = result; + }); + }); + + return output; + } + }; + + userSelectProperty = domutil.testProp(['userSelect', 'WebkitUserSelect', 'OUserSelect', 'MozUserSelect', 'msUserSelect']); + + /** + * Disable browser's text selection behaviors. + * @method + */ + domutil.disableTextSelection = function () { + if (supportSelectStart) { + return function () { + domevent.on(window, 'selectstart', domevent.preventDefault); + }; + } + + return function () { + var style = document.documentElement.style; + prevSelectStyle = style[userSelectProperty]; + style[userSelectProperty] = 'none'; + }; + }(); + + /** + * Enable browser's text selection behaviors. + * @method + */ + domutil.enableTextSelection = function () { + if (supportSelectStart) { + return function () { + domevent.off(window, 'selectstart', domevent.preventDefault); + }; + } + + return function () { + document.documentElement.style[userSelectProperty] = prevSelectStyle; + }; + }(); + + /** + * Disable browser's image drag behaviors. + */ + domutil.disableImageDrag = function () { + domevent.on(window, 'dragstart', domevent.preventDefault); + }; + + /** + * Enable browser's image drag behaviors. + */ + domutil.enableImageDrag = function () { + domevent.off(window, 'dragstart', domevent.preventDefault); + }; + + /** + * Replace matched property with template + * @param {string} template - String of template + * @param {Object} propObj - Properties + * @returns {string} Replaced template string + */ + domutil.applyTemplate = function (template, propObj) { + var newTemplate = template.replace(/\{\{(\w*)\}\}/g, function (value, prop) { + return propObj.hasOwnProperty(prop) ? propObj[prop] : ''; + }); + + return newTemplate; + }; + + module.exports = domutil; + + /***/ }), + /* 8 */ + /***/ (function(module, exports) { + + module.exports = __WEBPACK_EXTERNAL_MODULE_8__; + + /***/ }), + /* 9 */ + /***/ (function(module, exports, __webpack_require__) { + + /** + * @fileoverview Utility module for handling DOM events. + * @author NHN Ent. FE Development Team + */ + + 'use strict'; + + var snippet = __webpack_require__(8); + + var util = snippet, + browser = util.browser, + eventKey = '_evt', + DRAG = { + START: ['touchstart', 'mousedown'], + END: { + mousedown: 'mouseup', + touchstart: 'touchend', + pointerdown: 'touchend', + MSPointerDown: 'touchend' + }, + MOVE: { + mousedown: 'mousemove', + touchstart: 'touchmove', + pointerdown: 'touchmove', + MSPointerDown: 'touchmove' + } + }; + + var domevent = { + /** + * Bind dom events. + * @param {HTMLElement} obj HTMLElement to bind events. + * @param {(string|object)} types Space splitted events names or eventName:handler object. + * @param {*} fn handler function or context for handler method. + * @param {*} [context] context object for handler method. + */ + on: function (obj, types, fn, context) { + if (util.isString(types)) { + util.forEach(types.split(' '), function (type) { + domevent._on(obj, type, fn, context); + }); + + return; + } + + util.forEachOwnProperties(types, function (handler, type) { + domevent._on(obj, type, handler, fn); + }); + }, + + /** + * DOM event binding. + * @param {HTMLElement} obj HTMLElement to bind events. + * @param {String} type The name of events. + * @param {*} fn handler function + * @param {*} [context] context object for handler method. + * @private + */ + _on: function (obj, type, fn, context) { + var id, handler, originHandler; + + id = type + util.stamp(fn) + (context ? '_' + util.stamp(context) : ''); + + if (obj[eventKey] && obj[eventKey][id]) { + return; + } + + handler = function (e) { + fn.call(context || obj, e || window.event); + }; + + originHandler = handler; + + if ('addEventListener' in obj) { + if (type === 'mouseenter' || type === 'mouseleave') { + handler = function (e) { + e = e || window.event; + if (!domevent._checkMouse(obj, e)) { + return; + } + originHandler(e); + }; + obj.addEventListener(type === 'mouseenter' ? 'mouseover' : 'mouseout', handler, false); + } else { + if (type === 'mousewheel') { + obj.addEventListener('DOMMouseScroll', handler, false); + } + + obj.addEventListener(type, handler, false); + } + } else if ('attachEvent' in obj) { + obj.attachEvent('on' + type, handler); + } + + obj[eventKey] = obj[eventKey] || {}; + obj[eventKey][id] = handler; + }, + + /** + * Unbind DOM Event handler. + * @param {HTMLElement} obj HTMLElement to unbind. + * @param {(string|object)} types Space splitted events names or eventName:handler object. + * @param {*} fn handler function or context for handler method. + * @param {*} [context] context object for handler method. + */ + off: function (obj, types, fn, context) { + if (util.isString(types)) { + util.forEach(types.split(' '), function (type) { + domevent._off(obj, type, fn, context); + }); + + return; + } + + util.forEachOwnProperties(types, function (handler, type) { + domevent._off(obj, type, handler, fn); + }); + }, + + /** + * Unbind DOM event handler. + * @param {HTMLElement} obj HTMLElement to unbind. + * @param {String} type The name of event to unbind. + * @param {function()} fn Event handler that supplied when binding. + * @param {*} context context object that supplied when binding. + * @private + */ + _off: function (obj, type, fn, context) { + var id = type + util.stamp(fn) + (context ? '_' + util.stamp(context) : ''), + handler = obj[eventKey] && obj[eventKey][id]; + + if (!handler) { + return; + } + + if ('removeEventListener' in obj) { + if (type === 'mouseenter' || type === 'mouseleave') { + obj.removeEventListener(type === 'mouseenter' ? 'mouseover' : 'mouseout', handler, false); + } else { + if (type === 'mousewheel') { + obj.removeEventListener('DOMMouseScroll', handler, false); + } + + obj.removeEventListener(type, handler, false); + } + } else if ('detachEvent' in obj) { + try { + obj.detachEvent('on' + type, handler); + } catch (e) {} //eslint-disable-line + } + + delete obj[eventKey][id]; + + if (util.keys(obj[eventKey]).length) { + return; + } + + // throw exception when deleting host object's property in below IE8 + if (util.browser.msie && util.browser.version < 9) { + obj[eventKey] = null; + + return; + } + + delete obj[eventKey]; + }, + + /** + * Bind DOM event. this event will unbind after invokes. + * @param {HTMLElement} obj HTMLElement to bind events. + * @param {(string|object)} types Space splitted events names or eventName:handler object. + * @param {*} fn handler function or context for handler method. + * @param {*} [context] context object for handler method. + */ + once: function (obj, types, fn, context) { + var that = this; + + if (util.isObject(types)) { + util.forEachOwnProperties(types, function (handler, type) { + domevent.once(obj, type, handler, fn); + }); + + return; + } + + function onceHandler() { + fn.apply(context || obj, arguments); + that._off(obj, types, onceHandler, context); + } + + domevent.on(obj, types, onceHandler, context); + }, + + /** + * Cancel event bubbling. + * @param {Event} e Event object. + */ + stopPropagation: function (e) { + if (e.stopPropagation) { + e.stopPropagation(); + } else { + e.cancelBubble = true; + } + }, + + /** + * Cancel browser default actions. + * @param {Event} e Event object. + */ + preventDefault: function (e) { + if (e.preventDefault) { + e.preventDefault(); + } else { + e.returnValue = false; + } + }, + + /** + * Syntatic sugar of stopPropagation and preventDefault + * @param {Event} e Event object. + */ + stop: function (e) { + domevent.preventDefault(e); + domevent.stopPropagation(e); + }, + + /** + * Stop scroll events. + * @param {HTMLElement} el HTML element to prevent scroll. + */ + disableScrollPropagation: function (el) { + domevent.on(el, 'mousewheel MozMousePixelScroll', domevent.stopPropagation); + }, + + /** + * Stop all events related with click. + * @param {HTMLElement} el HTML element to prevent all event related with click. + */ + disableClickPropagation: function (el) { + domevent.on(el, DRAG.START.join(' ') + ' click dblclick', domevent.stopPropagation); + }, + + /** + * Get mouse position from mouse event. + * + * If supplied relatveElement parameter then return relative position based on element. + * @param {Event} mouseEvent Mouse event object + * @param {HTMLElement} relativeElement HTML element that calculate relative position. + * @returns {number[]} mouse position. + */ + getMousePosition: function (mouseEvent, relativeElement) { + var rect; + + if (!relativeElement) { + return [mouseEvent.clientX, mouseEvent.clientY]; + } + + rect = relativeElement.getBoundingClientRect(); + + return [mouseEvent.clientX - rect.left - relativeElement.clientLeft, mouseEvent.clientY - rect.top - relativeElement.clientTop]; + }, + + /** + * Normalize mouse wheel event that different each browsers. + * @param {MouseEvent} e Mouse wheel event. + * @returns {Number} delta + */ + getWheelDelta: function (e) { + var delta = 0; + + if (e.wheelDelta) { + delta = e.wheelDelta / 120; + } + + if (e.detail) { + delta = -e.detail / 3; + } + + return delta; + }, + + /** + * prevent firing mouseleave event when mouse entered child elements. + * @param {HTMLElement} el HTML element + * @param {MouseEvent} e Mouse event + * @returns {Boolean} leave? + * @private + */ + _checkMouse: function (el, e) { + var related = e.relatedTarget; + + if (!related) { + return true; + } + + try { + while (related && related !== el) { + related = related.parentNode; + } + } catch (err) { + return false; + } + + return related !== el; + }, + + /** + * Trigger specific events to html element. + * @param {HTMLElement} obj HTMLElement + * @param {string} type Event type name + * @param {object} [eventData] Event data + */ + trigger: function (obj, type, eventData) { + var rMouseEvent = /(mouse|click)/; + if (util.isUndefined(eventData) && rMouseEvent.exec(type)) { + eventData = domevent.mouseEvent(type); + } + + if (obj.dispatchEvent) { + obj.dispatchEvent(eventData); + } else if (obj.fireEvent) { + obj.fireEvent('on' + type, eventData); + } + }, + + /** + * Create virtual mouse event. + * + * Tested at + * + * - IE7 ~ IE11 + * - Chrome + * - Firefox + * - Safari + * @param {string} type Event type + * @param {object} [eventObj] Event data + * @returns {MouseEvent} Virtual mouse event. + */ + mouseEvent: function (type, eventObj) { + var evt, e; + + e = util.extend({ + bubbles: true, + cancelable: type !== 'mousemove', + view: window, + wheelDelta: 0, + detail: 0, + screenX: 0, + screenY: 0, + clientX: 0, + clientY: 0, + ctrlKey: false, + altKey: false, + shiftKey: false, + metaKey: false, + button: 0, + relatedTarget: undefined // eslint-disable-line + }, eventObj); + + // prevent throw error when inserting wheelDelta property to mouse event on below IE8 + if (browser.msie && browser.version < 9) { + delete e.wheelDelta; + } + + if (typeof document.createEvent === 'function') { + evt = document.createEvent('MouseEvents'); + evt.initMouseEvent(type, e.bubbles, e.cancelable, e.view, e.detail, e.screenX, e.screenY, e.clientX, e.clientY, e.ctrlKey, e.altKey, e.shiftKey, e.metaKey, e.button, document.body.parentNode); + } else if (document.createEventObject) { + evt = document.createEventObject(); + + util.forEach(e, function (value, propName) { + evt[propName] = value; + }, this); + evt.button = { + 0: 1, + 1: 4, + 2: 2 + }[evt.button] || evt.button; + } + + return evt; + }, + + /** + * Normalize mouse event's button attributes. + * + * Can detect which button is clicked by this method. + * + * Meaning of return numbers + * + * - 0: primary mouse button + * - 1: wheel button or center button + * - 2: secondary mouse button + * @param {MouseEvent} mouseEvent - The mouse event object want to know. + * @returns {number} - The value of meaning which button is clicked? + */ + getMouseButton: function (mouseEvent) { + var button, + primary = '0,1,3,5,7', + secondary = '2,6', + wheel = '4'; + + /* istanbul ignore else */ + if (document.implementation.hasFeature('MouseEvents', '2.0')) { + return mouseEvent.button; + } + + button = mouseEvent.button + ''; + if (~primary.indexOf(button)) { + return 0; + } else if (~secondary.indexOf(button)) { + return 2; + } else if (~wheel.indexOf(button)) { + return 1; + } + } + }; + + module.exports = domevent; + + /***/ }), + /* 10 */ + /***/ (function(module, exports, __webpack_require__) { + + /** + * @fileoverview Common collections. + * @author NHN Ent. FE Development Team + */ + + 'use strict'; + + var snippet = __webpack_require__(8); + + var util = snippet, + forEachProp = util.forEachOwnProperties, + forEachArr = util.forEachArray, + isFunc = util.isFunction, + isObj = util.isObject; + + var aps = Array.prototype.slice; + + /** + * Common collection. + * + * It need function for get model's unique id. + * + * if the function is not supplied then it use default function {@link Collection#getItemID} + * @constructor + * @param {function} [getItemIDFn] function for get model's id. + * @ignore + */ + function Collection(getItemIDFn) { + /** + * @type {object.} + */ + this.items = {}; + + /** + * @type {number} + */ + this.length = 0; + + if (isFunc(getItemIDFn)) { + /** + * @type {function} + */ + this.getItemID = getItemIDFn; + } + } + + /********** + * static props + **********/ + + /** + * Combind supplied function filters and condition. + * @param {...function} filters - function filters + * @returns {function} combined filter + */ + Collection.and = function (filters) { + var cnt; + + filters = aps.call(arguments); + cnt = filters.length; + + return function (item) { + var i = 0; + + for (; i < cnt; i += 1) { + if (!filters[i].call(null, item)) { + return false; + } + } + + return true; + }; + }; + + /** + * Combine multiple function filters with OR clause. + * @param {...function} filters - function filters + * @returns {function} combined filter + */ + Collection.or = function (filters) { + var cnt; + + filters = aps.call(arguments); + cnt = filters.length; + + return function (item) { + var i = 1, + result = filters[0].call(null, item); + + for (; i < cnt; i += 1) { + result = result || filters[i].call(null, item); + } + + return result; + }; + }; + + /** + * Merge several collections. + * + * You can\'t merge collections different _getEventID functions. Take case of use. + * @param {...Collection} collections collection arguments to merge + * @returns {Collection} merged collection. + */ + Collection.merge = function (collections) { + // eslint-disable-line + var cols = aps.call(arguments), + newItems = {}, + merged = new Collection(cols[0].getItemID), + extend = util.extend; + + forEachArr(cols, function (col) { + extend(newItems, col.items); + }); + + merged.items = newItems; + merged.length = util.keys(merged.items).length; + + return merged; + }; + + /********** + * prototype props + **********/ + + /** + * get model's unique id. + * @param {object} item model instance. + * @returns {number} model unique id. + */ + Collection.prototype.getItemID = function (item) { + return item._id + ''; + }; + + /** + * add models. + * @param {...*} item models to add this collection. + */ + Collection.prototype.add = function (item) { + var id, ownItems; + + if (arguments.length > 1) { + forEachArr(aps.call(arguments), function (o) { + this.add(o); + }, this); + + return; + } + + id = this.getItemID(item); + ownItems = this.items; + + if (!ownItems[id]) { + this.length += 1; + } + ownItems[id] = item; + }; + + /** + * remove models. + * @param {...(object|string|number)} id model instance or unique id to delete. + * @returns {array} deleted model list. + */ + Collection.prototype.remove = function (id) { + var removed = [], + ownItems, + itemToRemove; + + if (!this.length) { + return removed; + } + + if (arguments.length > 1) { + removed = util.map(aps.call(arguments), function (id) { + return this.remove(id); + }, this); + + return removed; + } + + ownItems = this.items; + + if (isObj(id)) { + id = this.getItemID(id); + } + + if (!ownItems[id]) { + return removed; + } + + this.length -= 1; + itemToRemove = ownItems[id]; + delete ownItems[id]; + + return itemToRemove; + }; + + /** + * remove all models in collection. + */ + Collection.prototype.clear = function () { + this.items = {}; + this.length = 0; + }; + + /** + * check collection has specific model. + * @param {(object|string|number|function)} id model instance or id or filter function to check + * @returns {boolean} is has model? + */ + Collection.prototype.has = function (id) { + var isFilter, has; + + if (!this.length) { + return false; + } + + isFilter = isFunc(id); + has = false; + + if (isFilter) { + this.each(function (item) { + if (id(item) === true) { + has = true; + + return false; + } + + return true; + }); + } else { + id = isObj(id) ? this.getItemID(id) : id; + has = util.isExisty(this.items[id]); + } + + return has; + }; + + /** + * invoke callback when model exist in collection. + * @param {(string|number)} id model unique id. + * @param {function} fn the callback. + * @param {*} [context] callback context. + */ + Collection.prototype.doWhenHas = function (id, fn, context) { + var item = this.items[id]; + + if (!util.isExisty(item)) { + return; + } + + fn.call(context || this, item); + }; + + /** + * Search model. and return new collection. + * @param {function} filter filter function. + * @returns {Collection} new collection with filtered models. + * @example + * collection.find(function(item) { + * return item.edited === true; + * }); + * + * function filter1(item) { + * return item.edited === false; + * } + * + * function filter2(item) { + * return item.disabled === false; + * } + * + * collection.find(Collection.and(filter1, filter2)); + * + * collection.find(Collection.or(filter1, filter2)); + */ + Collection.prototype.find = function (filter) { + var result = new Collection(); + + if (this.hasOwnProperty('getItemID')) { + result.getItemID = this.getItemID; + } + + this.each(function (item) { + if (filter(item) === true) { + result.add(item); + } + }); + + return result; + }; + + /** + * Group element by specific key values. + * + * if key parameter is function then invoke it and use returned value. + * @param {(string|number|function|array)} key key property or getter function. if string[] supplied, create each collection before grouping. + * @param {function} [groupFunc] - function that return each group's key + * @returns {object.} grouped object + * @example + * + * // pass `string`, `number`, `boolean` type value then group by property value. + * collection.groupBy('gender'); // group by 'gender' property value. + * collection.groupBy(50); // group by '50' property value. + * + * // pass `function` then group by return value. each invocation `function` is called with `(item)`. + * collection.groupBy(function(item) { + * if (item.score > 60) { + * return 'pass'; + * } + * return 'fail'; + * }); + * + * // pass `array` with first arguments then create each collection before grouping. + * collection.groupBy(['go', 'ruby', 'javascript']); + * // result: { 'go': empty Collection, 'ruby': empty Collection, 'javascript': empty Collection } + * + * // can pass `function` with `array` then group each elements. + * collection.groupBy(['go', 'ruby', 'javascript'], function(item) { + * if (item.isFast) { + * return 'go'; + * } + * + * return item.name; + * }); + */ + Collection.prototype.groupBy = function (key, groupFunc) { + var result = {}, + collection, + baseValue, + keyIsFunc = isFunc(key), + getItemIDFn = this.getItemID; + + if (util.isArray(key)) { + util.forEachArray(key, function (k) { + result[k + ''] = new Collection(getItemIDFn); + }); + + if (!groupFunc) { + return result; + } + + key = groupFunc; + keyIsFunc = true; + } + + this.each(function (item) { + if (keyIsFunc) { + baseValue = key(item); + } else { + baseValue = item[key]; + + if (isFunc(baseValue)) { + baseValue = baseValue.apply(item); + } + } + + collection = result[baseValue]; + + if (!collection) { + collection = result[baseValue] = new Collection(getItemIDFn); + } + + collection.add(item); + }); + + return result; + }; + + /** + * Return single item in collection. + * + * Returned item is inserted in this collection firstly. + * @returns {object} item. + */ + Collection.prototype.single = function () { + var result; + + this.each(function (item) { + result = item; + + return false; + }, this); + + return result; + }; + + /** + * sort a basis of supplied compare function. + * @param {function} compareFunction compareFunction + * @returns {array} sorted array. + */ + Collection.prototype.sort = function (compareFunction) { + var arr = []; + + this.each(function (item) { + arr.push(item); + }); + + if (isFunc(compareFunction)) { + arr = arr.sort(compareFunction); + } + + return arr; + }; + + /** + * iterate each model element. + * + * when iteratee return false then break the loop. + * @param {function} iteratee iteratee(item, index, items) + * @param {*} [context] context + */ + Collection.prototype.each = function (iteratee, context) { + forEachProp(this.items, iteratee, context || this); + }; + + /** + * return new array with collection items. + * @returns {array} new array. + */ + Collection.prototype.toArray = function () { + if (!this.length) { + return []; + } + + return util.map(this.items, function (item) { + return item; + }); + }; + + module.exports = Collection; + + /***/ }), + /* 11 */ + /***/ (function(module, exports, __webpack_require__) { + + /** + * @fileoverview The base class of views. + * @author NHN Ent. FE Development Team + */ + + 'use strict'; + + var util = __webpack_require__(8); + var domutil = __webpack_require__(7); + var Collection = __webpack_require__(10); + + /** + * Base class of views. + * + * All views create own container element inside supplied container element. + * @constructor + * @param {options} options The object for describe view's specs. + * @param {HTMLElement} container Default container element for view. you can use this element for this.container syntax. + * @ignore + */ + function View(options, container) { + var id = util.stamp(this); + + options = options || {}; + + if (util.isUndefined(container)) { + container = domutil.appendHTMLElement('div'); + } + + domutil.addClass(container, 'tui-view-' + id); + + /** + * unique id + * @type {number} + */ + this.id = id; + + /** + * base element of view. + * @type {HTMLDIVElement} + */ + this.container = container; + + /** + * child views. + * @type {Collection} + */ + this.childs = new Collection(function (view) { + return util.stamp(view); + }); + + /** + * parent view instance. + * @type {View} + */ + this.parent = null; + } + + /** + * Add child views. + * @param {View} view The view instance to add. + * @param {function} [fn] Function for invoke before add. parent view class is supplied first arguments. + */ + View.prototype.addChild = function (view, fn) { + if (fn) { + fn.call(view, this); + } + // add parent view + view.parent = this; + + this.childs.add(view); + }; + + /** + * Remove added child view. + * @param {(number|View)} id View id or instance itself to remove. + * @param {function} [fn] Function for invoke before remove. parent view class is supplied first arguments. + */ + View.prototype.removeChild = function (id, fn) { + var view = util.isNumber(id) ? this.childs.items[id] : id; + + id = util.stamp(view); + + if (fn) { + fn.call(view, this); + } + + this.childs.remove(id); + }; + + /** + * Render view recursively. + */ + View.prototype.render = function () { + this.childs.each(function (childView) { + childView.render(); + }); + }; + + /** + * Invoke function recursively. + * @param {function} fn - function to invoke child view recursively + * @param {boolean} [skipThis=false] - set true then skip invoke with this(root) view. + */ + View.prototype.recursive = function (fn, skipThis) { + if (!util.isFunction(fn)) { + return; + } + + if (!skipThis) { + fn(this); + } + + this.childs.each(function (childView) { + childView.recursive(fn); + }); + }; + + /** + * Resize view recursively to parent. + */ + View.prototype.resize = function () { + var args = Array.prototype.slice.call(arguments), + parent = this.parent; + + while (parent) { + if (util.isFunction(parent._onResize)) { + parent._onResize.apply(parent, args); + } + + parent = parent.parent; + } + }; + + /** + * Invoking method before destroying. + */ + View.prototype._beforeDestroy = function () {}; + + /** + * Clear properties + */ + View.prototype._destroy = function () { + this._beforeDestroy(); + this.childs.clear(); + this.container.innerHTML = ''; + + this.id = this.parent = this.childs = this.container = null; + }; + + /** + * Destroy child view recursively. + * @param {boolean} isChildView - Whether it is the child view or not + */ + View.prototype.destroy = function (isChildView) { + this.childs.each(function (childView) { + childView.destroy(true); + childView._destroy(); + }); + + if (isChildView) { + return; + } + + this._destroy(); + }; + + /** + * Calculate view's container element bound. + * @returns {object} The bound of container element. + */ + View.prototype.getViewBound = function () { + var container = this.container, + position = domutil.getPosition(container), + size = domutil.getSize(container); + + return { + x: position[0], + y: position[1], + width: size[0], + height: size[1] + }; + }; + + module.exports = View; + + /***/ }), + /* 12 */ + /***/ (function(module, exports, __webpack_require__) { + + /* WEBPACK VAR INJECTION */(function(global) {/** + * @fileoverview General drag handler + * @author NHN Ent. FE Development Team + */ + + 'use strict'; + + var util = __webpack_require__(8); + var domutil = __webpack_require__(7); + var domevent = __webpack_require__(9); + + /** + * @constructor + * @mixes CustomEvents + * @param {object} options - options for drag handler + * @param {number} [options.distance=10] - distance in pixels after mouse must move before dragging should start + * @param {HTMLElement} container - container element to bind drag events + * @ignore + */ + function Drag(options, container) { + domevent.on(container, 'mousedown', this._onMouseDown, this); + + this.options = util.extend({ + distance: 10 + }, options); + + /** + * @type {HTMLElement} + */ + this.container = container; + + /** + * @type {boolean} + */ + this._isMoved = false; + + /** + * dragging distance in pixel between mousedown and firing dragStart events + * @type {number} + */ + this._distance = 0; + + /** + * @type {boolean} + */ + this._dragStartFired = false; + + /** + * @type {object} + */ + this._dragStartEventData = null; + } + + /** + * Destroy method. + */ + Drag.prototype.destroy = function () { + domevent.off(this.container, 'mousedown', this._onMouseDown, this); + + this.options = this.container = this._isMoved = this._distance = this._dragStartFired = this._dragStartEventData = null; + }; + + /** + * Toggle events for mouse dragging. + * @param {boolean} toBind - bind events related with dragging when supplied "true" + */ + Drag.prototype._toggleDragEvent = function (toBind) { + var container = this.container, + domMethod, + method; + + if (toBind) { + domMethod = 'on'; + method = 'disable'; + } else { + domMethod = 'off'; + method = 'enable'; + } + + domutil[method + 'TextSelection'](container); + domutil[method + 'ImageDrag'](container); + domevent[domMethod](global.document, { + mousemove: this._onMouseMove, + mouseup: this._onMouseUp + }, this); + }; + + /** + * Normalize mouse event object. + * @param {MouseEvent} mouseEvent - mouse event object. + * @returns {object} normalized mouse event data. + */ + Drag.prototype._getEventData = function (mouseEvent) { + return { + target: mouseEvent.target || mouseEvent.srcElement, + originEvent: mouseEvent + }; + }; + + /** + * MouseDown DOM event handler. + * @param {MouseEvent} mouseDownEvent MouseDown event object. + */ + Drag.prototype._onMouseDown = function (mouseDownEvent) { + // only primary button can start drag. + if (domevent.getMouseButton(mouseDownEvent) !== 0) { + return; + } + + this._distance = 0; + this._dragStartFired = false; + this._dragStartEventData = this._getEventData(mouseDownEvent); + + this._toggleDragEvent(true); + }; + + /** + * MouseMove DOM event handler. + * @emits Drag#drag + * @emits Drag#dragStart + * @param {MouseEvent} mouseMoveEvent MouseMove event object. + */ + Drag.prototype._onMouseMove = function (mouseMoveEvent) { + var distance = this.options.distance; + // prevent automatic scrolling. + domevent.preventDefault(mouseMoveEvent); + + this._isMoved = true; + + if (this._distance < distance) { + this._distance += 1; + + return; + } + + if (!this._dragStartFired) { + this._dragStartFired = true; + + /** + * Drag starts events. cancelable. + * @event Drag#dragStart + * @type {object} + * @property {HTMLElement} target - target element in this event. + * @property {MouseEvent} originEvent - original mouse event object. + */ + if (!this.invoke('dragStart', this._dragStartEventData)) { + this._toggleDragEvent(false); + + return; + } + } + + /** + * Events while dragging. + * @event Drag#drag + * @type {object} + * @property {HTMLElement} target - target element in this event. + * @property {MouseEvent} originEvent - original mouse event object. + */ + this.fire('drag', this._getEventData(mouseMoveEvent)); + }; + + /** + * MouseUp DOM event handler. + * @param {MouseEvent} mouseUpEvent MouseUp event object. + * @emits Drag#dragEnd + * @emits Drag#click + */ + Drag.prototype._onMouseUp = function (mouseUpEvent) { + this._toggleDragEvent(false); + + // emit "click" event when not emitted drag event between mousedown and mouseup. + if (this._isMoved) { + this._isMoved = false; + + /** + * Drag end events. + * @event Drag#dragEnd + * @type {MouseEvent} + * @property {HTMLElement} target - target element in this event. + * @property {MouseEvent} originEvent - original mouse event object. + */ + this.fire('dragEnd', this._getEventData(mouseUpEvent)); + + return; + } + + /** + * Click events. + * @event Drag#click + * @type {MouseEvent} + * @property {HTMLElement} target - target element in this event. + * @property {MouseEvent} originEvent - original mouse event object. + */ + this.fire('click', this._getEventData(mouseUpEvent)); + }; + + util.CustomEvents.mixin(Drag); + + module.exports = Drag; + /* WEBPACK VAR INJECTION */}.call(exports, (function() { return this; }()))) + + /***/ }), + /* 13 */ + /***/ (function(module, exports, __webpack_require__) { + + /** + * @fileoverview ColorPicker factory module + * @author NHN Ent. FE Development Team + */ + + 'use strict'; + + var util = __webpack_require__(8); + var colorutil = __webpack_require__(14); + var Layout = __webpack_require__(15); + var Palette = __webpack_require__(16); + var Slider = __webpack_require__(18); + + var hostnameSent = false; + + /** + * send hostname + * @ignore + */ + function sendHostname() { + var hostname = location.hostname; + + if (hostnameSent) { + return; + } + hostnameSent = true; + + util.imagePing('https://www.google-analytics.com/collect', { + v: 1, + t: 'event', + tid: 'UA-115377265-9', + cid: hostname, + dp: hostname, + dh: 'color-picker' + }); + } + + /** + * @constructor + * @mixes CustomEvents + * @param {object} options - options for colorpicker component + * @param {HTMLDivElement} options.container - container element + * @param {string} [options.color='#ffffff'] - default selected color + * @param {string[]} [options.preset] - color preset for palette (use base16 palette if not supplied) + * @param {string} [options.cssPrefix='tui-colorpicker-'] - css prefix text for each child elements + * @param {string} [options.detailTxt='Detail'] - text for detail button. + * @param {boolean} [options.usageStatistics=true] - Let us know the hostname. If you don't want to send the hostname, please set to false. + * @example + * var colorPicker = tui.colorPicker; // or require('tui-color-picker') + * + * colorPicker.create({ + * container: document.getElementById('color-picker') + * }); + */ + function ColorPicker(options) { + var layout; + + if (!(this instanceof ColorPicker)) { + return new ColorPicker(options); + } + /** + * Option object + * @type {object} + * @private + */ + options = this.options = util.extend({ + container: null, + color: '#f8f8f8', + preset: ['#181818', '#282828', '#383838', '#585858', '#b8b8b8', '#d8d8d8', '#e8e8e8', '#f8f8f8', '#ab4642', '#dc9656', '#f7ca88', '#a1b56c', '#86c1b9', '#7cafc2', '#ba8baf', '#a16946'], + cssPrefix: 'tui-colorpicker-', + detailTxt: 'Detail', + usageStatistics: true + }, options); + + if (!options.container) { + throw new Error('ColorPicker(): need container option.'); + } + + /********** + * Create layout view + **********/ + + /** + * @type {Layout} + * @private + */ + layout = this.layout = new Layout(options, options.container); + + /********** + * Create palette view + **********/ + this.palette = new Palette(options, layout.container); + this.palette.on({ + '_selectColor': this._onSelectColorInPalette, + '_toggleSlider': this._onToggleSlider + }, this); + + /********** + * Create slider view + **********/ + this.slider = new Slider(options, layout.container); + this.slider.on('_selectColor', this._onSelectColorInSlider, this); + + /********** + * Add child views + **********/ + layout.addChild(this.palette); + layout.addChild(this.slider); + + this.render(options.color); + + if (options.usageStatistics) { + sendHostname(); + } + } + + /** + * Handler method for Palette#_selectColor event + * @private + * @fires ColorPicker#selectColor + * @param {object} selectColorEventData - event data + */ + ColorPicker.prototype._onSelectColorInPalette = function (selectColorEventData) { + var color = selectColorEventData.color, + opt = this.options; + + if (!colorutil.isValidRGB(color) && color !== '') { + this.render(); + + return; + } + + /** + * @event ColorPicker#selectColor + * @type {object} + * @property {string} color - selected color (hex string) + * @property {string} origin - flags for represent the source of event fires. + */ + this.fire('selectColor', { + color: color, + origin: 'palette' + }); + + if (opt.color === color) { + return; + } + + opt.color = color; + this.render(color); + }; + + /** + * Handler method for Palette#_toggleSlider event + * @private + */ + ColorPicker.prototype._onToggleSlider = function () { + this.slider.toggle(!this.slider.isVisible()); + }; + + /** + * Handler method for Slider#_selectColor event + * @private + * @fires ColorPicker#selectColor + * @param {object} selectColorEventData - event data + */ + ColorPicker.prototype._onSelectColorInSlider = function (selectColorEventData) { + var color = selectColorEventData.color, + opt = this.options; + + /** + * @event ColorPicker#selectColor + * @type {object} + * @property {string} color - selected color (hex string) + * @property {string} origin - flags for represent the source of event fires. + * @ignore + */ + this.fire('selectColor', { + color: color, + origin: 'slider' + }); + + if (opt.color === color) { + return; + } + + opt.color = color; + this.palette.render(color); + }; + + /********** + * PUBLIC API + **********/ + + /** + * Set color to colorpicker instance.
+ * The string parameter must be hex color value + * @param {string} hexStr - hex formatted color string + * @example + * colorPicker.setColor('#ffff00'); + */ + ColorPicker.prototype.setColor = function (hexStr) { + if (!colorutil.isValidRGB(hexStr)) { + throw new Error('ColorPicker#setColor(): need valid hex string color value'); + } + + this.options.color = hexStr; + this.render(hexStr); + }; + + /** + * Get hex color string of current selected color in colorpicker instance. + * @returns {string} hex string formatted color + * @example + * colorPicker.setColor('#ffff00'); + * colorPicker.getColor(); // '#ffff00'; + */ + ColorPicker.prototype.getColor = function () { + return this.options.color; + }; + + /** + * Toggle colorpicker element. set true then reveal colorpicker view. + * @param {boolean} [isShow=false] - A flag to show + * @example + * colorPicker.toggle(false); // hide + * colorPicker.toggle(); // hide + * colorPicker.toggle(true); // show + */ + ColorPicker.prototype.toggle = function (isShow) { + this.layout.container.style.display = !!isShow ? 'block' : 'none'; + }; + + /** + * Render colorpicker + * @param {string} [color] - selected color + * @ignore + */ + ColorPicker.prototype.render = function (color) { + this.layout.render(color || this.options.color); + }; + + /** + * Destroy colorpicker instance. + * @example + * colorPicker.destroy(); // DOM-element is removed + */ + ColorPicker.prototype.destroy = function () { + this.layout.destroy(); + this.options.container.innerHTML = ''; + + this.layout = this.slider = this.palette = this.options = null; + }; + + util.CustomEvents.mixin(ColorPicker); + + module.exports = ColorPicker; + + /***/ }), + /* 14 */ + /***/ (function(module, exports) { + + /** + * @fileoverview Utility methods to manipulate colors + * @author NHN Ent. FE Development Team + */ + + 'use strict'; + + var hexRX = /(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i; + + var colorutil = { + /** + * pad left zero characters. + * @param {number} number number value to pad zero. + * @param {number} length pad length to want. + * @returns {string} padded string. + */ + leadingZero: function (number, length) { + var zero = '', + i = 0; + + if ((number + '').length > length) { + return number + ''; + } + + for (; i < length - 1; i += 1) { + zero += '0'; + } + + return (zero + number).slice(length * -1); + }, + + /** + * Check validate of hex string value is RGB + * @param {string} str - rgb hex string + * @returns {boolean} return true when supplied str is valid RGB hex string + */ + isValidRGB: function (str) { + return hexRX.test(str); + }, + + // @license RGB <-> HSV conversion utilities based off of http://www.cs.rit.edu/~ncs/color/t_convert.html + + /** + * Convert color hex string to rgb number array + * @param {string} hexStr - hex string + * @returns {number[]} rgb numbers + */ + hexToRGB: function (hexStr) { + var r, g, b; + + if (!colorutil.isValidRGB(hexStr)) { + return false; + } + + hexStr = hexStr.substring(1); + + r = parseInt(hexStr.substr(0, 2), 16); + g = parseInt(hexStr.substr(2, 2), 16); + b = parseInt(hexStr.substr(4, 2), 16); + + return [r, g, b]; + }, + + /** + * Convert rgb number to hex string + * @param {number} r - red + * @param {number} g - green + * @param {number} b - blue + * @returns {string|boolean} return false when supplied rgb number is not valid. otherwise, converted hex string + */ + rgbToHEX: function (r, g, b) { + var hexStr = '#' + colorutil.leadingZero(r.toString(16), 2) + colorutil.leadingZero(g.toString(16), 2) + colorutil.leadingZero(b.toString(16), 2); + + if (colorutil.isValidRGB(hexStr)) { + return hexStr; + } + + return false; + }, + + /** + * Convert rgb number to HSV value + * @param {number} r - red + * @param {number} g - green + * @param {number} b - blue + * @returns {number[]} hsv value + */ + rgbToHSV: function (r, g, b) { + var max, min, h, s, v, d; + + r /= 255; + g /= 255; + b /= 255; + max = Math.max(r, g, b); + min = Math.min(r, g, b); + v = max; + d = max - min; + s = max === 0 ? 0 : d / max; + + if (max === min) { + h = 0; + } else { + switch (max) { + case r: + h = (g - b) / d + (g < b ? 6 : 0);break; + case g: + h = (b - r) / d + 2;break; + case b: + h = (r - g) / d + 4;break; + // no default + } + h /= 6; + } + + return [Math.round(h * 360), Math.round(s * 100), Math.round(v * 100)]; + }, + + /** + * Convert HSV number to RGB + * @param {number} h - hue + * @param {number} s - saturation + * @param {number} v - value + * @returns {number[]} rgb value + */ + hsvToRGB: function (h, s, v) { + var r, g, b; + var i; + var f, p, q, t; + + h = Math.max(0, Math.min(360, h)); + s = Math.max(0, Math.min(100, s)); + v = Math.max(0, Math.min(100, v)); + + s /= 100; + v /= 100; + + if (s === 0) { + // Achromatic (grey) + r = g = b = v; + + return [Math.round(r * 255), Math.round(g * 255), Math.round(b * 255)]; + } + + h /= 60; // sector 0 to 5 + i = Math.floor(h); + f = h - i; // factorial part of h + p = v * (1 - s); + q = v * (1 - s * f); + t = v * (1 - s * (1 - f)); + + switch (i) { + case 0: + r = v;g = t;b = p;break; + case 1: + r = q;g = v;b = p;break; + case 2: + r = p;g = v;b = t;break; + case 3: + r = p;g = q;b = v;break; + case 4: + r = t;g = p;b = v;break; + default: + r = v;g = p;b = q;break; + } + + return [Math.round(r * 255), Math.round(g * 255), Math.round(b * 255)]; + } + }; + + module.exports = colorutil; + + /***/ }), + /* 15 */ + /***/ (function(module, exports, __webpack_require__) { + + /** + * @fileoverview ColorPicker layout module + * @author NHN Ent. FE Development Team + */ + + 'use strict'; + + var util = __webpack_require__(8); + var domutil = __webpack_require__(7); + var View = __webpack_require__(11); + + /** + * @constructor + * @extends {View} + * @param {object} options - option object + * @param {string} options.cssPrefix - css prefix for each child elements + * @param {HTMLDivElement} container - container + * @ignore + */ + function Layout(options, container) { + /** + * option object + * @type {object} + */ + this.options = util.extend({ + cssPrefix: 'tui-colorpicker-' + }, options); + + container = domutil.appendHTMLElement('div', container, this.options.cssPrefix + 'container'); + + View.call(this, options, container); + + this.render(); + } + + util.inherit(Layout, View); + + /** + * @override + * @param {string} [color] - selected color + */ + Layout.prototype.render = function (color) { + this.recursive(function (view) { + view.render(color); + }, true); + }; + + module.exports = Layout; + + /***/ }), + /* 16 */ + /***/ (function(module, exports, __webpack_require__) { + + /** + * @fileoverview Color palette view + * @author NHN Ent. FE Development Team + */ + + 'use strict'; + + var util = __webpack_require__(8); + var domutil = __webpack_require__(7); + var colorutil = __webpack_require__(14); + var domevent = __webpack_require__(9); + var View = __webpack_require__(11); + var tmpl = __webpack_require__(17); + + /** + * @constructor + * @extends {View} + * @mixes CustomEvents + * @param {object} options - options for color palette view + * @param {string[]} options.preset - color list + * @param {HTMLDivElement} container - container element + * @ignore + */ + function Palette(options, container) { + /** + * option object + * @type {object} + */ + this.options = util.extend({ + cssPrefix: 'tui-colorpicker-', + preset: ['#181818', '#282828', '#383838', '#585858', '#B8B8B8', '#D8D8D8', '#E8E8E8', '#F8F8F8', '#AB4642', '#DC9656', '#F7CA88', '#A1B56C', '#86C1B9', '#7CAFC2', '#BA8BAF', '#A16946'], + detailTxt: 'Detail' + }, options); + + container = domutil.appendHTMLElement('div', container, this.options.cssPrefix + 'palette-container'); + + View.call(this, options, container); + } + + util.inherit(Palette, View); + + /** + * Mouse click event handler + * @fires Palette#_selectColor + * @fires Palette#_toggleSlider + * @param {MouseEvent} clickEvent - mouse event object + */ + Palette.prototype._onClick = function (clickEvent) { + var options = this.options, + target = clickEvent.srcElement || clickEvent.target, + eventData = {}; + + if (domutil.hasClass(target, options.cssPrefix + 'palette-button')) { + eventData.color = target.value; + + /** + * @event Palette#_selectColor + * @type {object} + * @property {string} color - selected color value + */ + this.fire('_selectColor', eventData); + + return; + } + + if (domutil.hasClass(target, options.cssPrefix + 'palette-toggle-slider')) { + /** + * @event Palette#_toggleSlider + */ + this.fire('_toggleSlider'); + } + }; + + /** + * Textbox change event handler + * @fires Palette#_selectColor + * @param {Event} changeEvent - change event object + */ + Palette.prototype._onChange = function (changeEvent) { + var options = this.options, + target = changeEvent.srcElement || changeEvent.target, + eventData = {}; + + if (domutil.hasClass(target, options.cssPrefix + 'palette-hex')) { + eventData.color = target.value; + + /** + * @event Palette#_selectColor + * @type {object} + * @property {string} color - selected color value + */ + this.fire('_selectColor', eventData); + } + }; + + /** + * Invoke before destory + * @override + */ + Palette.prototype._beforeDestroy = function () { + this._toggleEvent(false); + }; + + /** + * Toggle view DOM events + * @param {boolean} [onOff=false] - true to bind event. + */ + Palette.prototype._toggleEvent = function (onOff) { + var options = this.options, + container = this.container, + method = domevent[!!onOff ? 'on' : 'off'], + hexTextBox; + + method(container, 'click', this._onClick, this); + + hexTextBox = domutil.find('.' + options.cssPrefix + 'palette-hex', container); + + if (hexTextBox) { + method(hexTextBox, 'change', this._onChange, this); + } + }; + + /** + * Render palette + * @override + */ + Palette.prototype.render = function (color) { + var options = this.options, + html = ''; + + this._toggleEvent(false); + + html = tmpl.layout.replace('{{colorList}}', util.map(options.preset, function (itemColor) { + var itemHtml = ''; + var style = ''; + + if (colorutil.isValidRGB(itemColor)) { + style = domutil.applyTemplate(tmpl.itemStyle, { color: itemColor }); + } + + itemHtml = domutil.applyTemplate(tmpl.item, { + itemStyle: style, + itemClass: !itemColor ? ' ' + options.cssPrefix + 'color-transparent' : '', + color: itemColor, + cssPrefix: options.cssPrefix, + selected: itemColor === color ? ' ' + options.cssPrefix + 'selected' : '' + }); + + return itemHtml; + }).join('')); + + html = domutil.applyTemplate(html, { + cssPrefix: options.cssPrefix, + detailTxt: options.detailTxt, + color: color + }); + + this.container.innerHTML = html; + + this._toggleEvent(true); + }; + + util.CustomEvents.mixin(Palette); + + module.exports = Palette; + + /***/ }), + /* 17 */ + /***/ (function(module, exports) { + + /** + * @fileoverview Palette view template + * @author NHN Ent. FE Development Team + */ + + 'use strict'; + + var layout = ['
    {{colorList}}
', '
', '', '', '{{color}}', '
'].join('\n'); + + var item = '
    • '; + var itemStyle = 'background-color:{{color}};color:{{color}}'; + + module.exports = { + layout: layout, + item: item, + itemStyle: itemStyle + }; + + /***/ }), + /* 18 */ + /***/ (function(module, exports, __webpack_require__) { + + /** + * @fileoverview Slider view + * @author NHN Ent. FE Development Team + */ + + 'use strict'; + + var util = __webpack_require__(8); + var domutil = __webpack_require__(7); + var domevent = __webpack_require__(9); + var svgvml = __webpack_require__(19); + var colorutil = __webpack_require__(14); + var View = __webpack_require__(11); + var Drag = __webpack_require__(12); + var tmpl = __webpack_require__(20); + + // Limitation position of point element inside of colorslider and hue bar + // Minimum value can to be negative because that using color point of handle element is center point. not left, top point. + var COLORSLIDER_POS_LIMIT_RANGE = [-7, 112]; + var HUEBAR_POS_LIMIT_RANGE = [-3, 115]; + var HUE_WHEEL_MAX = 359.99; + + /** + * @constructor + * @extends {View} + * @mixes CustomEvents + * @param {object} options - options for view + * @param {string} options.cssPrefix - design css prefix + * @param {HTMLElement} container - container element + * @ignore + */ + function Slider(options, container) { + container = domutil.appendHTMLElement('div', container, options.cssPrefix + 'slider-container'); + container.style.display = 'none'; + + View.call(this, options, container); + + /** + * @type {object} + */ + this.options = util.extend({ + color: '#f8f8f8', + cssPrefix: 'tui-colorpicker-' + }, options); + + /** + * Cache immutable data in click, drag events. + * + * (i.e. is event related with colorslider? or huebar?) + * @type {object} + * @property {boolean} isColorSlider + * @property {number[]} containerSize + */ + this._dragDataCache = {}; + + /** + * Color slider handle element + * @type {SVG|VML} + */ + this.sliderHandleElement = null; + + /** + * hue bar handle element + * @type {SVG|VML} + */ + this.huebarHandleElement = null; + + /** + * Element that render base color in colorslider part + * @type {SVG|VML} + */ + this.baseColorElement = null; + + /** + * @type {Drag} + */ + this.drag = new Drag({ + distance: 0 + }, container); + + // bind drag events + this.drag.on({ + 'dragStart': this._onDragStart, + 'drag': this._onDrag, + 'dragEnd': this._onDragEnd, + 'click': this._onClick + }, this); + } + + util.inherit(Slider, View); + + /** + * @override + */ + Slider.prototype._beforeDestroy = function () { + this.drag.off(); + + this.drag = this.options = this._dragDataCache = this.sliderHandleElement = this.huebarHandleElement = this.baseColorElement = null; + }; + + /** + * Toggle slider view + * @param {boolean} onOff - set true then reveal slider view + */ + Slider.prototype.toggle = function (onOff) { + this.container.style.display = !!onOff ? 'block' : 'none'; + }; + + /** + * Get slider display status + * @returns {boolean} return true when slider is visible + */ + Slider.prototype.isVisible = function () { + return this.container.style.display === 'block'; + }; + + /** + * Render slider view + * @override + * @param {string} colorStr - hex string color from parent view (Layout) + */ + Slider.prototype.render = function (colorStr) { + var that = this, + container = that.container, + options = that.options, + html = tmpl.layout, + rgb, + hsv; + + if (!colorutil.isValidRGB(colorStr)) { + return; + } + + html = html.replace(/{{slider}}/, tmpl.slider); + html = html.replace(/{{huebar}}/, tmpl.huebar); + html = html.replace(/{{cssPrefix}}/g, options.cssPrefix); + + that.container.innerHTML = html; + + that.sliderHandleElement = domutil.find('.' + options.cssPrefix + 'slider-handle', container); + that.huebarHandleElement = domutil.find('.' + options.cssPrefix + 'huebar-handle', container); + that.baseColorElement = domutil.find('.' + options.cssPrefix + 'slider-basecolor', container); + + rgb = colorutil.hexToRGB(colorStr); + hsv = colorutil.rgbToHSV.apply(null, rgb); + + this.moveHue(hsv[0], true); + this.moveSaturationAndValue(hsv[1], hsv[2], true); + }; + + /** + * Move colorslider by newLeft(X), newTop(Y) value + * @private + * @param {number} newLeft - left pixel value to move handle + * @param {number} newTop - top pixel value to move handle + * @param {boolean} [silent=false] - set true then not fire custom event + */ + Slider.prototype._moveColorSliderHandle = function (newLeft, newTop, silent) { + var handle = this.sliderHandleElement, + handleColor; + + // Check position limitation. + newTop = Math.max(COLORSLIDER_POS_LIMIT_RANGE[0], newTop); + newTop = Math.min(COLORSLIDER_POS_LIMIT_RANGE[1], newTop); + newLeft = Math.max(COLORSLIDER_POS_LIMIT_RANGE[0], newLeft); + newLeft = Math.min(COLORSLIDER_POS_LIMIT_RANGE[1], newLeft); + + svgvml.setTranslateXY(handle, newLeft, newTop); + + handleColor = newTop > 50 ? 'white' : 'black'; + svgvml.setStrokeColor(handle, handleColor); + + if (!silent) { + this.fire('_selectColor', { + color: colorutil.rgbToHEX.apply(null, this.getRGB()) + }); + } + }; + + /** + * Move colorslider by supplied saturation and values. + * + * The movement of color slider handle follow HSV cylinder model. {@link https://en.wikipedia.org/wiki/HSL_and_HSV} + * @param {number} saturation - the percent of saturation (0% ~ 100%) + * @param {number} value - the percent of saturation (0% ~ 100%) + * @param {boolean} [silent=false] - set true then not fire custom event + */ + Slider.prototype.moveSaturationAndValue = function (saturation, value, silent) { + var absMin, maxValue, newLeft, newTop; + + saturation = saturation || 0; + value = value || 0; + + absMin = Math.abs(COLORSLIDER_POS_LIMIT_RANGE[0]); + maxValue = COLORSLIDER_POS_LIMIT_RANGE[1]; + + // subtract absMin value because current color position is not left, top of handle element. + // The saturation. from left 0 to right 100 + newLeft = saturation * maxValue / 100 - absMin; + // The Value. from top 100 to bottom 0. that why newTop subtract by maxValue. + newTop = maxValue - value * maxValue / 100 - absMin; + + this._moveColorSliderHandle(newLeft, newTop, silent); + }; + + /** + * Move color slider handle to supplied position + * + * The number of X, Y must be related value from color slider container + * @private + * @param {number} x - the pixel value to move handle + * @param {number} y - the pixel value to move handle + */ + Slider.prototype._moveColorSliderByPosition = function (x, y) { + var offset = COLORSLIDER_POS_LIMIT_RANGE[0]; + this._moveColorSliderHandle(x + offset, y + offset); + }; + + /** + * Get saturation and value value. + * @returns {number[]} saturation and value + */ + Slider.prototype.getSaturationAndValue = function () { + var absMin = Math.abs(COLORSLIDER_POS_LIMIT_RANGE[0]), + maxValue = absMin + COLORSLIDER_POS_LIMIT_RANGE[1], + position = svgvml.getTranslateXY(this.sliderHandleElement), + saturation, + value; + + saturation = (position[1] + absMin) / maxValue * 100; + // The value of HSV color model is inverted. top 100 ~ bottom 0. so subtract by 100 + value = 100 - (position[0] + absMin) / maxValue * 100; + + return [saturation, value]; + }; + + /** + * Move hue handle supplied pixel value + * @private + * @param {number} newTop - pixel to move hue handle + * @param {boolean} [silent=false] - set true then not fire custom event + */ + Slider.prototype._moveHueHandle = function (newTop, silent) { + var hueHandleElement = this.huebarHandleElement, + baseColorElement = this.baseColorElement, + newGradientColor, + hexStr; + + newTop = Math.max(HUEBAR_POS_LIMIT_RANGE[0], newTop); + newTop = Math.min(HUEBAR_POS_LIMIT_RANGE[1], newTop); + + svgvml.setTranslateY(hueHandleElement, newTop); + + newGradientColor = colorutil.hsvToRGB(this.getHue(), 100, 100); + hexStr = colorutil.rgbToHEX.apply(null, newGradientColor); + + svgvml.setGradientColorStop(baseColorElement, hexStr); + + if (!silent) { + this.fire('_selectColor', { + color: colorutil.rgbToHEX.apply(null, this.getRGB()) + }); + } + }; + + /** + * Move hue bar handle by supplied degree + * @param {number} degree - (0 ~ 359.9 degree) + * @param {boolean} [silent=false] - set true then not fire custom event + */ + Slider.prototype.moveHue = function (degree, silent) { + var newTop = 0, + absMin, + maxValue; + + absMin = Math.abs(HUEBAR_POS_LIMIT_RANGE[0]); + maxValue = absMin + HUEBAR_POS_LIMIT_RANGE[1]; + + degree = degree || 0; + newTop = maxValue * degree / HUE_WHEEL_MAX - absMin; + + this._moveHueHandle(newTop, silent); + }; + + /** + * Move hue bar handle by supplied percent + * @private + * @param {number} y - pixel value to move hue handle + */ + Slider.prototype._moveHueByPosition = function (y) { + var offset = HUEBAR_POS_LIMIT_RANGE[0]; + + this._moveHueHandle(y + offset); + }; + + /** + * Get huebar handle position by color degree + * @returns {number} degree (0 ~ 359.9 degree) + */ + Slider.prototype.getHue = function () { + var handle = this.huebarHandleElement, + position = svgvml.getTranslateXY(handle), + absMin, + maxValue; + + absMin = Math.abs(HUEBAR_POS_LIMIT_RANGE[0]); + maxValue = absMin + HUEBAR_POS_LIMIT_RANGE[1]; + + // maxValue : 359.99 = pos.y : x + return (position[0] + absMin) * HUE_WHEEL_MAX / maxValue; + }; + + /** + * Get HSV value from slider + * @returns {number[]} hsv values + */ + Slider.prototype.getHSV = function () { + var sv = this.getSaturationAndValue(), + h = this.getHue(); + + return [h].concat(sv); + }; + + /** + * Get RGB value from slider + * @returns {number[]} RGB value + */ + Slider.prototype.getRGB = function () { + return colorutil.hsvToRGB.apply(null, this.getHSV()); + }; + + /********** + * Drag event handler + **********/ + + /** + * Cache immutable data when dragging or click view + * @param {object} event - Click, DragStart event. + * @returns {object} cached data. + */ + Slider.prototype._prepareColorSliderForMouseEvent = function (event) { + var options = this.options, + sliderPart = domutil.closest(event.target, '.' + options.cssPrefix + 'slider-part'), + cache; + + cache = this._dragDataCache = { + isColorSlider: domutil.hasClass(sliderPart, options.cssPrefix + 'slider-left'), + parentElement: sliderPart + }; + + return cache; + }; + + /** + * Click event handler + * @param {object} clickEvent - Click event from Drag module + */ + Slider.prototype._onClick = function (clickEvent) { + var cache = this._prepareColorSliderForMouseEvent(clickEvent), + mousePos = domevent.getMousePosition(clickEvent.originEvent, cache.parentElement); + + if (cache.isColorSlider) { + this._moveColorSliderByPosition(mousePos[0], mousePos[1]); + } else { + this._moveHueByPosition(mousePos[1]); + } + + this._dragDataCache = null; + }; + + /** + * DragStart event handler + * @param {object} dragStartEvent - dragStart event data from Drag#dragStart + */ + Slider.prototype._onDragStart = function (dragStartEvent) { + this._prepareColorSliderForMouseEvent(dragStartEvent); + }; + + /** + * Drag event handler + * @param {Drag#drag} dragEvent - drag event data + */ + Slider.prototype._onDrag = function (dragEvent) { + var cache = this._dragDataCache, + mousePos = domevent.getMousePosition(dragEvent.originEvent, cache.parentElement); + + if (cache.isColorSlider) { + this._moveColorSliderByPosition(mousePos[0], mousePos[1]); + } else { + this._moveHueByPosition(mousePos[1]); + } + }; + + /** + * Drag#dragEnd event handler + */ + Slider.prototype._onDragEnd = function () { + this._dragDataCache = null; + }; + + util.CustomEvents.mixin(Slider); + + module.exports = Slider; + + /***/ }), + /* 19 */ + /***/ (function(module, exports, __webpack_require__) { + + /** + * @fileoverview module for manipulate SVG or VML object + * @author NHN Ent. FE Development Team + */ + + 'use strict'; + + var util = __webpack_require__(8); + var PARSE_TRANSLATE_NUM_REGEX = /[\.\-0-9]+/g; + var SVG_HUE_HANDLE_RIGHT_POS = -6; + + /* istanbul ignore next */ + var svgvml = { + /** + * Return true when browser is below IE8. + * @returns {boolean} is old browser? + */ + isOldBrowser: function () { + var _isOldBrowser = svgvml._isOldBrowser; + + if (!util.isExisty(_isOldBrowser)) { + svgvml._isOldBrowser = _isOldBrowser = util.browser.msie && util.browser.version < 9; + } + + return _isOldBrowser; + }, + + /** + * Get translate transform value + * @param {SVG|VML} obj - svg or vml object that want to know translate x, y + * @returns {number[]} translated coordinates [x, y] + */ + getTranslateXY: function (obj) { + var temp; + + if (svgvml.isOldBrowser()) { + temp = obj.style; + + return [parseFloat(temp.top), parseFloat(temp.left)]; + } + + temp = obj.getAttribute('transform'); + + if (!temp) { + return [0, 0]; + } + + temp = temp.match(PARSE_TRANSLATE_NUM_REGEX); + + // need caution for difference of VML, SVG coordinates system. + // translate command need X coords in first parameter. but VML is use CSS coordinate system(top, left) + return [parseFloat(temp[1]), parseFloat(temp[0])]; + }, + + /** + * Set translate transform value + * @param {SVG|VML} obj - SVG or VML object to setting translate transform. + * @param {number} x - translate X value + * @param {number} y - translate Y value + */ + setTranslateXY: function (obj, x, y) { + if (svgvml.isOldBrowser()) { + obj.style.left = x + 'px'; + obj.style.top = y + 'px'; + } else { + obj.setAttribute('transform', 'translate(' + x + ',' + y + ')'); + } + }, + + /** + * Set translate only Y value + * @param {SVG|VML} obj - SVG or VML object to setting translate transform. + * @param {number} y - translate Y value + */ + setTranslateY: function (obj, y) { + if (svgvml.isOldBrowser()) { + obj.style.top = y + 'px'; + } else { + obj.setAttribute('transform', 'translate(' + SVG_HUE_HANDLE_RIGHT_POS + ',' + y + ')'); + } + }, + + /** + * Set stroke color to SVG or VML object + * @param {SVG|VML} obj - SVG or VML object to setting stroke color + * @param {string} colorStr - color string + */ + setStrokeColor: function (obj, colorStr) { + if (svgvml.isOldBrowser()) { + obj.strokecolor = colorStr; + } else { + obj.setAttribute('stroke', colorStr); + } + }, + + /** + * Set gradient stop color to SVG, VML object. + * @param {SVG|VML} obj - SVG, VML object to applying gradient stop color + * @param {string} colorStr - color string + */ + setGradientColorStop: function (obj, colorStr) { + if (svgvml.isOldBrowser()) { + obj.color = colorStr; + } else { + obj.setAttribute('stop-color', colorStr); + } + } + + }; + + module.exports = svgvml; + + /***/ }), + /* 20 */ + /***/ (function(module, exports, __webpack_require__) { + + /* WEBPACK VAR INJECTION */(function(global) {/** + * @fileoverview Slider template + * @author NHN Ent. FE Development Team + */ + + 'use strict'; + + var util = __webpack_require__(8); + + var layout = ['
    {{slider}}
    ', '
    {{huebar}}
    '].join('\n'); + + var SVGSlider = ['', '', '', '', '', '', '', '', '', '', '', '', '', '', ''].join('\n'); + + var VMLSlider = ['
    ', '', '', '', '', '', '', '', '
    '].join('\n'); + + var SVGHuebar = ['', '', '', '', '', '', '', '', '', '', '', '', '', '', ''].join('\n'); + + var VMLHuebar = ['
    ', '', '', '', '', '
    '].join('\n'); + + var isOldBrowser = util.browser.msie && util.browser.version < 9; + + if (isOldBrowser) { + global.document.namespaces.add('v', 'urn:schemas-microsoft-com:vml'); + } + + module.exports = { + layout: layout, + slider: isOldBrowser ? VMLSlider : SVGSlider, + huebar: isOldBrowser ? VMLHuebar : SVGHuebar + }; + /* WEBPACK VAR INJECTION */}.call(exports, (function() { return this; }()))) + + /***/ }) + /******/ ]) + }); + ; + +/***/ }), +/* 83 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _tuiCodeSnippet = __webpack_require__(3); + + var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + + var _util = __webpack_require__(72); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + /** + * Range control class + * @class + * @ignore + */ + var Range = function () { + function Range(rangeElement) { + var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; + + _classCallCheck(this, Range); + + this._value = options.value || 0; + this.rangeElement = rangeElement; + this._drawRangeElement(); + + this.rangeWidth = (0, _util.toInteger)(window.getComputedStyle(rangeElement, null).width) - 12; + this._min = options.min || 0; + this._max = options.max || 100; + this._absMax = this._min * -1 + this._max; + this.realTimeEvent = options.realTimeEvent || false; + + this._addClickEvent(); + this._addDragEvent(); + this.value = options.value; + this.trigger('change'); + } + + /** + * Set range max value and re position cursor + * @param {number} maxValue - max value + */ + + + _createClass(Range, [{ + key: 'trigger', + + + /** + * event tirigger + * @param {string} type - type + */ + value: function trigger(type) { + this.fire(type, this._value); + } + + /** + * Make range element + * @private + */ + + }, { + key: '_drawRangeElement', + value: function _drawRangeElement() { + this.rangeElement.classList.add('tui-image-editor-range'); + + this.bar = document.createElement('div'); + this.bar.className = 'tui-image-editor-virtual-range-bar'; + + this.subbar = document.createElement('div'); + this.subbar.className = 'tui-image-editor-virtual-range-subbar'; + + this.pointer = document.createElement('div'); + this.pointer.className = 'tui-image-editor-virtual-range-pointer'; + + this.bar.appendChild(this.subbar); + this.bar.appendChild(this.pointer); + this.rangeElement.appendChild(this.bar); + } + + /** + * Add Range click event + * @private + */ + + }, { + key: '_addClickEvent', + value: function _addClickEvent() { + var _this = this; + + this.rangeElement.addEventListener('click', function (event) { + event.stopPropagation(); + if (event.target.className !== 'tui-image-editor-range') { + return; + } + var touchPx = event.offsetX; + var ratio = touchPx / _this.rangeWidth; + var value = _this._absMax * ratio + _this._min; + _this.pointer.style.left = ratio * _this.rangeWidth + 'px'; + _this.subbar.style.right = (1 - ratio) * _this.rangeWidth + 'px'; + _this._value = value; + + _this.fire('change', value); + }); + } + + /** + * Add Range drag event + * @private + */ + + }, { + key: '_addDragEvent', + value: function _addDragEvent() { + var _this2 = this; + + this.pointer.addEventListener('mousedown', function (event) { + _this2.firstPosition = event.screenX; + _this2.firstLeft = (0, _util.toInteger)(_this2.pointer.style.left) || 0; + _this2.dragEventHandler = { + changeAngle: _this2._changeAngle.bind(_this2), + stopChangingAngle: _this2._stopChangingAngle.bind(_this2) + }; + + document.addEventListener('mousemove', _this2.dragEventHandler.changeAngle); + document.addEventListener('mouseup', _this2.dragEventHandler.stopChangingAngle); + }); + } + + /** + * change angle event + * @param {object} event - change event + * @private + */ + + }, { + key: '_changeAngle', + value: function _changeAngle(event) { + var changePosition = event.screenX; + var diffPosition = changePosition - this.firstPosition; + var touchPx = this.firstLeft + diffPosition; + touchPx = touchPx > this.rangeWidth ? this.rangeWidth : touchPx; + touchPx = touchPx < 0 ? 0 : touchPx; + + this.pointer.style.left = touchPx + 'px'; + this.subbar.style.right = this.rangeWidth - touchPx + 'px'; + var ratio = touchPx / this.rangeWidth; + var value = this._absMax * ratio + this._min; + + this._value = value; + + if (this.realTimeEvent) { + this.fire('change', value); + } + } + + /** + * stop change angle event + * @private + */ + + }, { + key: '_stopChangingAngle', + value: function _stopChangingAngle() { + this.fire('change', this._value); + document.removeEventListener('mousemove', this.dragEventHandler.changeAngle); + document.removeEventListener('mouseup', this.dragEventHandler.stopChangingAngle); + } + }, { + key: 'max', + set: function set(maxValue) { + this._max = maxValue; + this._absMax = this._min * -1 + this._max; + this.value = this._value; + }, + get: function get() { + return this._max; + } + + /** + * Get range value + * @returns {Number} range value + */ + + }, { + key: 'value', + get: function get() { + return this._value; + } + + /** + * Set range value + * @param {Number} value range value + * @param {Boolean} fire whether fire custom event or not + */ + , + set: function set(value) { + var absValue = value - this._min; + var leftPosition = absValue * this.rangeWidth / this._absMax; + + if (this.rangeWidth < leftPosition) { + leftPosition = this.rangeWidth; + } + + this.pointer.style.left = leftPosition + 'px'; + this.subbar.style.right = this.rangeWidth - leftPosition + 'px'; + this._value = value; + } + }]); + + return Range; + }(); + + _tuiCodeSnippet2.default.CustomEvents.mixin(Range); + exports.default = Range; + +/***/ }), +/* 84 */ +/***/ (function(module, exports) { + + 'use strict'; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + /** + * Submenu Base Class + * @class + * @ignore + */ + var Submenu = function () { + function Submenu(subMenuElement, _ref) { + var name = _ref.name, + iconStyle = _ref.iconStyle, + menuBarPosition = _ref.menuBarPosition, + templateHtml = _ref.templateHtml; + + _classCallCheck(this, Submenu); + + this.selector = function (str) { + return subMenuElement.querySelector(str); + }; + this.menuBarPosition = menuBarPosition; + this.toggleDirection = menuBarPosition === 'top' ? 'down' : 'up'; + this._makeSubMenuElement(subMenuElement, { + name: name, + iconStyle: iconStyle, + templateHtml: templateHtml + }); + } + + /** + * Get butten type + * @param {HTMLElement} button - event target element + * @param {array} buttonNames - Array of button names + * @returns {string} - button type + */ + + + _createClass(Submenu, [{ + key: 'getButtonType', + value: function getButtonType(button, buttonNames) { + return button.className.match(RegExp('(' + buttonNames.join('|') + ')'))[0]; + } + + /** + * Get butten type + * @param {HTMLElement} target - event target element + * @param {string} removeClass - remove class name + * @param {string} addClass - add class name + */ + + }, { + key: 'changeClass', + value: function changeClass(target, removeClass, addClass) { + target.classList.remove(removeClass); + target.classList.add(addClass); + } + + /** + * Interface method whose implementation is optional. + * Returns the menu to its default state. + */ + + }, { + key: 'changeStandbyMode', + value: function changeStandbyMode() {} + + /** + * Interface method whose implementation is optional. + * Executed when the menu starts. + */ + + }, { + key: 'changeStartMode', + value: function changeStartMode() {} + + /** + * Make submenu dom element + * @param {HTMLElement} subMenuElement - subment dom element + * @param {Object} iconStyle - icon style + * @private + */ + + }, { + key: '_makeSubMenuElement', + value: function _makeSubMenuElement(subMenuElement, _ref2) { + var name = _ref2.name, + iconStyle = _ref2.iconStyle, + templateHtml = _ref2.templateHtml; + + var iconSubMenu = document.createElement('div'); + iconSubMenu.className = 'tui-image-editor-menu-' + name; + iconSubMenu.innerHTML = templateHtml({ iconStyle: iconStyle }); + + subMenuElement.appendChild(iconSubMenu); + } + }]); + + return Submenu; + }(); + + exports.default = Submenu; + +/***/ }), +/* 85 */ +/***/ (function(module, exports) { + + "use strict"; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + exports.default = function (_ref) { + var _ref$iconStyle = _ref.iconStyle, + normal = _ref$iconStyle.normal, + active = _ref$iconStyle.active; + return "\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n"; + }; + +/***/ }), +/* 86 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _submenuBase = __webpack_require__(84); + + var _submenuBase2 = _interopRequireDefault(_submenuBase); + + var _crop = __webpack_require__(87); + + var _crop2 = _interopRequireDefault(_crop); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } + + /** + * Crop ui class + * @class + * @ignore + */ + var Crop = function (_Submenu) { + _inherits(Crop, _Submenu); + + function Crop(subMenuElement, _ref) { + var iconStyle = _ref.iconStyle, + menuBarPosition = _ref.menuBarPosition; + + _classCallCheck(this, Crop); + + var _this = _possibleConstructorReturn(this, (Crop.__proto__ || Object.getPrototypeOf(Crop)).call(this, subMenuElement, { + name: 'crop', + iconStyle: iconStyle, + menuBarPosition: menuBarPosition, + templateHtml: _crop2.default + })); + + _this.status = 'active'; + _this._els = { + apply: _this.selector('#tie-crop-button .apply'), + cancel: _this.selector('#tie-crop-button .cancel') + }; + return _this; + } + + /** + * Add event for crop + * @param {Object} actions - actions for crop + * @param {Function} actions.crop - crop action + * @param {Function} actions.cancel - cancel action + */ + + + _createClass(Crop, [{ + key: 'addEvent', + value: function addEvent(actions) { + var _this2 = this; + + this.actions = actions; + this._els.apply.addEventListener('click', function () { + _this2.actions.crop(); + _this2._els.apply.classList.remove('active'); + }); + + this._els.cancel.addEventListener('click', function () { + _this2.actions.cancel(); + _this2._els.apply.classList.remove('active'); + }); + } + + /** + * Executed when the menu starts. + */ + + }, { + key: 'changeStartMode', + value: function changeStartMode() { + this.actions.modeChange('crop'); + } + + /** + * Returns the menu to its default state. + */ + + }, { + key: 'changeStandbyMode', + value: function changeStandbyMode() { + this.actions.stopDrawingMode(); + } + + /** + * Change apply button status + * @param {Boolean} enableStatus - apply button status + */ + + }, { + key: 'changeApplyButtonStatus', + value: function changeApplyButtonStatus(enableStatus) { + if (enableStatus) { + this._els.apply.classList.add('active'); + } else { + this._els.apply.classList.remove('active'); + } + } + }]); + + return Crop; + }(_submenuBase2.default); + + exports.default = Crop; + +/***/ }), +/* 87 */ +/***/ (function(module, exports) { + + "use strict"; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + exports.default = function (_ref) { + var _ref$iconStyle = _ref.iconStyle, + normal = _ref$iconStyle.normal, + active = _ref$iconStyle.active; + return "\n
      \n
    • \n
      \n \n \n \n \n \n
      \n
      \n \n \n \n \n \n
      \n
      • \n
    \n"; + }; + +/***/ }), +/* 88 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _tuiCodeSnippet = __webpack_require__(3); + + var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + + var _submenuBase = __webpack_require__(84); + + var _submenuBase2 = _interopRequireDefault(_submenuBase); + + var _flip = __webpack_require__(89); + + var _flip2 = _interopRequireDefault(_flip); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } + + /** + * Flip ui class + * @class + * @ignore + */ + var Flip = function (_Submenu) { + _inherits(Flip, _Submenu); + + function Flip(subMenuElement, _ref) { + var iconStyle = _ref.iconStyle, + menuBarPosition = _ref.menuBarPosition; + + _classCallCheck(this, Flip); + + var _this = _possibleConstructorReturn(this, (Flip.__proto__ || Object.getPrototypeOf(Flip)).call(this, subMenuElement, { + name: 'flip', + iconStyle: iconStyle, + menuBarPosition: menuBarPosition, + templateHtml: _flip2.default + })); + + _this.flipStatus = false; + + _this._els = { + flipButton: _this.selector('#tie-flip-button') + }; + return _this; + } + + /** + * Add event for flip + * @param {Object} actions - actions for flip + * @param {Function} actions.flip - flip action + */ + + + _createClass(Flip, [{ + key: 'addEvent', + value: function addEvent(actions) { + this._actions = actions; + this._els.flipButton.addEventListener('click', this._changeFlip.bind(this)); + } + + /** + * change Flip status + * @param {object} event - change event + * @private + */ + + }, { + key: '_changeFlip', + value: function _changeFlip(event) { + var _this2 = this; + + var button = event.target.closest('.tui-image-editor-button'); + if (button) { + var flipType = this.getButtonType(button, ['flipX', 'flipY', 'resetFlip']); + if (!this.flipStatus && flipType === 'resetFlip') { + return; + } + + this._actions.flip(flipType).then(function (flipStatus) { + var flipClassList = _this2._els.flipButton.classList; + _this2.flipStatus = false; + + flipClassList.remove('resetFlip'); + _tuiCodeSnippet2.default.forEach(['flipX', 'flipY'], function (type) { + flipClassList.remove(type); + if (flipStatus[type]) { + flipClassList.add(type); + flipClassList.add('resetFlip'); + _this2.flipStatus = true; + } + }); + }); + } + } + }]); + + return Flip; + }(_submenuBase2.default); + + exports.default = Flip; + +/***/ }), +/* 89 */ +/***/ (function(module, exports) { + + "use strict"; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + exports.default = function (_ref) { + var _ref$iconStyle = _ref.iconStyle, + normal = _ref$iconStyle.normal, + active = _ref$iconStyle.active; + return "\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    \n"; + }; + +/***/ }), +/* 90 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _range = __webpack_require__(83); + + var _range2 = _interopRequireDefault(_range); + + var _submenuBase = __webpack_require__(84); + + var _submenuBase2 = _interopRequireDefault(_submenuBase); + + var _rotate = __webpack_require__(91); + + var _rotate2 = _interopRequireDefault(_rotate); + + var _util = __webpack_require__(72); + + var _consts = __webpack_require__(73); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } + + var CLOCKWISE = 30; + var COUNTERCLOCKWISE = -30; + + /** + * Rotate ui class + * @class + * @ignore + */ + + var Rotate = function (_Submenu) { + _inherits(Rotate, _Submenu); + + function Rotate(subMenuElement, _ref) { + var iconStyle = _ref.iconStyle, + menuBarPosition = _ref.menuBarPosition; + + _classCallCheck(this, Rotate); + + var _this = _possibleConstructorReturn(this, (Rotate.__proto__ || Object.getPrototypeOf(Rotate)).call(this, subMenuElement, { + name: 'rotate', + iconStyle: iconStyle, + menuBarPosition: menuBarPosition, + templateHtml: _rotate2.default + })); + + _this._els = { + rotateButton: _this.selector('#tie-retate-button'), + rotateRange: new _range2.default(_this.selector('#tie-rotate-range'), _consts.defaultRotateRangeValus), + rotateRangeValue: _this.selector('#tie-ratate-range-value') + }; + return _this; + } + + /** + * Add event for rotate + * @param {Object} actions - actions for crop + * @param {Function} actions.rotate - rotate action + * @param {Function} actions.setAngle - set angle action + */ + + + _createClass(Rotate, [{ + key: 'addEvent', + value: function addEvent(actions) { + // {rotate, setAngle} + this.actions = actions; + this._els.rotateButton.addEventListener('click', this._changeRotateForButton.bind(this)); + this._els.rotateRange.on('change', this._changeRotateForRange.bind(this)); + this._els.rotateRangeValue.setAttribute('readonly', true); + } + + /** + * Change rotate for range + * @param {number} value - angle value + * @private + */ + + }, { + key: '_changeRotateForRange', + value: function _changeRotateForRange(value) { + var angle = (0, _util.toInteger)(value); + this._els.rotateRangeValue.value = angle; + this.actions.setAngle(angle); + } + + /** + * Change rotate for button + * @param {object} event - add button event object + * @private + */ + + }, { + key: '_changeRotateForButton', + value: function _changeRotateForButton(event) { + var button = event.target.closest('.tui-image-editor-button'); + if (button) { + var rotateType = this.getButtonType(button, ['counterclockwise', 'clockwise']); + var rotateAngle = { + clockwise: CLOCKWISE, + counterclockwise: COUNTERCLOCKWISE + }[rotateType]; + this.actions.rotate(rotateAngle); + } + } + }]); + + return Rotate; + }(_submenuBase2.default); + + exports.default = Rotate; + +/***/ }), +/* 91 */ +/***/ (function(module, exports) { + + "use strict"; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + exports.default = function (_ref) { + var _ref$iconStyle = _ref.iconStyle, + normal = _ref$iconStyle.normal, + active = _ref$iconStyle.active; + return "\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n"; + }; + +/***/ }), +/* 92 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _range = __webpack_require__(83); + + var _range2 = _interopRequireDefault(_range); + + var _colorpicker = __webpack_require__(81); + + var _colorpicker2 = _interopRequireDefault(_colorpicker); + + var _submenuBase = __webpack_require__(84); + + var _submenuBase2 = _interopRequireDefault(_submenuBase); + + var _text = __webpack_require__(93); + + var _text2 = _interopRequireDefault(_text); + + var _util = __webpack_require__(72); + + var _consts = __webpack_require__(73); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } + + /** + * Crop ui class + * @class + * @ignore + */ + var Text = function (_Submenu) { + _inherits(Text, _Submenu); + + function Text(subMenuElement, _ref) { + var iconStyle = _ref.iconStyle, + menuBarPosition = _ref.menuBarPosition; + + _classCallCheck(this, Text); + + var _this = _possibleConstructorReturn(this, (Text.__proto__ || Object.getPrototypeOf(Text)).call(this, subMenuElement, { + name: 'text', + iconStyle: iconStyle, + menuBarPosition: menuBarPosition, + templateHtml: _text2.default + })); + + _this.effect = { + bold: false, + italic: false, + underline: false + }; + _this.align = 'left'; + _this._els = { + textEffectButton: _this.selector('#tie-text-effect-button'), + textAlignButton: _this.selector('#tie-text-align-button'), + textColorpicker: new _colorpicker2.default(_this.selector('#tie-text-color'), '#ffbb3b', _this.toggleDirection), + textRange: new _range2.default(_this.selector('#tie-text-range'), _consts.defaultTextRangeValus), + textRangeValue: _this.selector('#tie-text-range-value') + }; + return _this; + } + + /** + * Add event for text + * @param {Object} actions - actions for text + * @param {Function} actions.changeTextStyle - change text style + */ + + + _createClass(Text, [{ + key: 'addEvent', + value: function addEvent(actions) { + this.actions = actions; + this._els.textEffectButton.addEventListener('click', this._setTextEffectHandler.bind(this)); + this._els.textAlignButton.addEventListener('click', this._setTextAlignHandler.bind(this)); + this._els.textRange.on('change', this._changeTextRnageHandler.bind(this)); + this._els.textRangeValue.value = this._els.textRange.value; + this._els.textRangeValue.setAttribute('readonly', true); + this._els.textColorpicker.on('change', this._changeColorHandler.bind(this)); + } + + /** + * Returns the menu to its default state. + */ + + }, { + key: 'changeStandbyMode', + value: function changeStandbyMode() { + this.actions.stopDrawingMode(); + } + + /** + * Executed when the menu starts. + */ + + }, { + key: 'changeStartMode', + value: function changeStartMode() { + this.actions.modeChange('text'); + } + + /** + * Get text color + * @returns {string} - text color + */ + + }, { + key: '_setTextEffectHandler', + + + /** + * text effect set handler + * @param {object} event - add button event object + * @private + */ + value: function _setTextEffectHandler(event) { + var button = event.target.closest('.tui-image-editor-button'); + + var _button$className$mat = button.className.match(/(bold|italic|underline)/), + styleType = _button$className$mat[0]; + + var styleObj = { + 'bold': { fontWeight: 'bold' }, + 'italic': { fontStyle: 'italic' }, + 'underline': { textDecoration: 'underline' } + }[styleType]; + + this.effect[styleType] = !this.effect[styleType]; + button.classList.toggle('active'); + this.actions.changeTextStyle(styleObj); + } + + /** + * text effect set handler + * @param {object} event - add button event object + * @private + */ + + }, { + key: '_setTextAlignHandler', + value: function _setTextAlignHandler(event) { + var button = event.target.closest('.tui-image-editor-button'); + if (button) { + var styleType = this.getButtonType(button, ['left', 'center', 'right']); + + event.currentTarget.classList.remove(this.align); + if (this.align !== styleType) { + event.currentTarget.classList.add(styleType); + } + this.actions.changeTextStyle({ textAlign: styleType }); + + this.align = styleType; + } + } + + /** + * text align set handler + * @param {number} value - range value + * @private + */ + + }, { + key: '_changeTextRnageHandler', + value: function _changeTextRnageHandler(value) { + value = (0, _util.toInteger)(value); + if ((0, _util.toInteger)(this._els.textRangeValue.value) !== value) { + this.actions.changeTextStyle({ + fontSize: value + }); + this._els.textRangeValue.value = value; + } + } + + /** + * change color handler + * @param {string} color - change color string + * @private + */ + + }, { + key: '_changeColorHandler', + value: function _changeColorHandler(color) { + color = color || 'transparent'; + this.actions.changeTextStyle({ + 'fill': color + }); + } + }, { + key: 'textColor', + get: function get() { + return this._els.textColorpicker.color; + } + + /** + * Get text size + * @returns {string} - text size + */ + + }, { + key: 'fontSize', + get: function get() { + return this._els.textRange.value; + } + + /** + * Set text size + * @param {Number} value - text size + */ + , + set: function set(value) { + this._els.textRange.value = value; + this._els.textRangeValue.value = value; + } + }]); + + return Text; + }(_submenuBase2.default); + + exports.default = Text; + +/***/ }), +/* 93 */ +/***/ (function(module, exports) { + + "use strict"; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + exports.default = function (_ref) { + var _ref$iconStyle = _ref.iconStyle, + normal = _ref$iconStyle.normal, + active = _ref$iconStyle.active; + return "\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n"; + }; + +/***/ }), +/* 94 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _submenuBase = __webpack_require__(84); + + var _submenuBase2 = _interopRequireDefault(_submenuBase); + + var _util = __webpack_require__(72); + + var _util2 = _interopRequireDefault(_util); + + var _mask = __webpack_require__(95); + + var _mask2 = _interopRequireDefault(_mask); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } + + /** + * Mask ui class + * @class + * @ignore + */ + var Mask = function (_Submenu) { + _inherits(Mask, _Submenu); + + function Mask(subMenuElement, _ref) { + var iconStyle = _ref.iconStyle, + menuBarPosition = _ref.menuBarPosition; + + _classCallCheck(this, Mask); + + var _this = _possibleConstructorReturn(this, (Mask.__proto__ || Object.getPrototypeOf(Mask)).call(this, subMenuElement, { + name: 'mask', + iconStyle: iconStyle, + menuBarPosition: menuBarPosition, + templateHtml: _mask2.default + })); + + _this._els = { + applyButton: _this.selector('#tie-mask-apply'), + maskImageButton: _this.selector('#tie-mask-image-file') + }; + return _this; + } + + /** + * Add event for mask + * @param {Object} actions - actions for crop + * @param {Function} actions.loadImageFromURL - load image action + * @param {Function} actions.applyFilter - apply filter action + */ + + + _createClass(Mask, [{ + key: 'addEvent', + value: function addEvent(actions) { + this.actions = actions; + this._els.maskImageButton.addEventListener('change', this._loadMaskFile.bind(this)); + this._els.applyButton.addEventListener('click', this._applyMask.bind(this)); + } + + /** + * Apply mask + * @private + */ + + }, { + key: '_applyMask', + value: function _applyMask() { + this.actions.applyFilter(); + this._els.applyButton.classList.remove('active'); + } + + /** + * Load mask file + * @param {object} event - File change event object + * @private + */ + + }, { + key: '_loadMaskFile', + value: function _loadMaskFile(event) { + var imgUrl = void 0; + + if (!_util2.default.isSupportFileApi()) { + alert('This browser does not support file-api'); + } + + var _event$target$files = event.target.files, + file = _event$target$files[0]; + + + if (file) { + imgUrl = URL.createObjectURL(file); + this.actions.loadImageFromURL(imgUrl, file); + this._els.applyButton.classList.add('active'); + } + } + }]); + + return Mask; + }(_submenuBase2.default); + + exports.default = Mask; + +/***/ }), +/* 95 */ +/***/ (function(module, exports) { + + "use strict"; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + exports.default = function (_ref) { + var _ref$iconStyle = _ref.iconStyle, + normal = _ref$iconStyle.normal, + active = _ref$iconStyle.active; + return "\n
      \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n \n \n \n \n \n
      \n
      • \n
    \n"; + }; + +/***/ }), +/* 96 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _tuiCodeSnippet = __webpack_require__(3); + + var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + + var _colorpicker = __webpack_require__(81); + + var _colorpicker2 = _interopRequireDefault(_colorpicker); + + var _submenuBase = __webpack_require__(84); + + var _submenuBase2 = _interopRequireDefault(_submenuBase); + + var _icon = __webpack_require__(97); + + var _icon2 = _interopRequireDefault(_icon); + + var _util = __webpack_require__(72); + + var _consts = __webpack_require__(73); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } + + /** + * Icon ui class + * @class + * @ignore + */ + var Icon = function (_Submenu) { + _inherits(Icon, _Submenu); + + function Icon(subMenuElement, _ref) { + var iconStyle = _ref.iconStyle, + menuBarPosition = _ref.menuBarPosition; + + _classCallCheck(this, Icon); + + var _this = _possibleConstructorReturn(this, (Icon.__proto__ || Object.getPrototypeOf(Icon)).call(this, subMenuElement, { + name: 'icon', + iconStyle: iconStyle, + menuBarPosition: menuBarPosition, + templateHtml: _icon2.default + })); + + _this.iconType = null; + _this._iconMap = {}; + + _this._els = { + registIconButton: _this.selector('#tie-icon-image-file'), + addIconButton: _this.selector('#tie-icon-add-button'), + iconColorpicker: new _colorpicker2.default(_this.selector('#tie-icon-color'), '#ffbb3b', _this.toggleDirection) + }; + return _this; + } + + /** + * Add event for icon + * @param {Object} actions - actions for icon + * @param {Function} actions.registCustomIcon - register icon + * @param {Function} actions.addIcon - add icon + * @param {Function} actions.changeColor - change icon color + */ + + + _createClass(Icon, [{ + key: 'addEvent', + value: function addEvent(actions) { + this.actions = actions; + + this._els.iconColorpicker.on('change', this._changeColorHandler.bind(this)); + this._els.registIconButton.addEventListener('change', this._registeIconHandler.bind(this)); + this._els.addIconButton.addEventListener('click', this._addIconHandler.bind(this)); + } + + /** + * Clear icon type + */ + + }, { + key: 'clearIconType', + value: function clearIconType() { + this._els.addIconButton.classList.remove(this.iconType); + this.iconType = null; + } + + /** + * Register default icon + */ + + }, { + key: 'registDefaultIcon', + value: function registDefaultIcon() { + var _this2 = this; + + _tuiCodeSnippet2.default.forEach(_consts.defaultIconPath, function (path, type) { + _this2.actions.registDefalutIcons(type, path); + }); + } + + /** + * Set icon picker color + * @param {string} iconColor - rgb color string + */ + + }, { + key: 'setIconPickerColor', + value: function setIconPickerColor(iconColor) { + this._els.iconColorpicker.color = iconColor; + } + + /** + * Returns the menu to its default state. + */ + + }, { + key: 'changeStandbyMode', + value: function changeStandbyMode() { + this.clearIconType(); + this.actions.cancelAddIcon(); + } + + /** + * Change icon color + * @param {string} color - color for change + * @private + */ + + }, { + key: '_changeColorHandler', + value: function _changeColorHandler(color) { + color = color || 'transparent'; + this.actions.changeColor(color); + } + + /** + * Change icon color + * @param {object} event - add button event object + * @private + */ + + }, { + key: '_addIconHandler', + value: function _addIconHandler(event) { + var button = event.target.closest('.tui-image-editor-button'); + + if (button) { + var iconType = button.getAttribute('data-icontype'); + var iconColor = this._els.iconColorpicker.color; + this.actions.discardSelection(); + this.actions.changeSelectableAll(false); + this._els.addIconButton.classList.remove(this.iconType); + this._els.addIconButton.classList.add(iconType); + + if (this.iconType === iconType) { + this.changeStandbyMode(); + } else { + this.actions.addIcon(iconType, iconColor); + this.iconType = iconType; + } + } + } + + /** + * register icon + * @param {object} event - file change event object + * @private + */ + + }, { + key: '_registeIconHandler', + value: function _registeIconHandler(event) { + var imgUrl = void 0; + + if (!_util.isSupportFileApi) { + alert('This browser does not support file-api'); + } + + var _event$target$files = event.target.files, + file = _event$target$files[0]; + + + if (file) { + imgUrl = URL.createObjectURL(file); + this.actions.registCustomIcon(imgUrl, file); + } + } + }]); + + return Icon; + }(_submenuBase2.default); + + exports.default = Icon; + +/***/ }), +/* 97 */ +/***/ (function(module, exports) { + + "use strict"; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + exports.default = function (_ref) { + var _ref$iconStyle = _ref.iconStyle, + normal = _ref$iconStyle.normal, + active = _ref$iconStyle.active; + return "\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    \n"; + }; + +/***/ }), +/* 98 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _util = __webpack_require__(72); + + var _util2 = _interopRequireDefault(_util); + + var _colorpicker = __webpack_require__(81); + + var _colorpicker2 = _interopRequireDefault(_colorpicker); + + var _range = __webpack_require__(83); + + var _range2 = _interopRequireDefault(_range); + + var _submenuBase = __webpack_require__(84); + + var _submenuBase2 = _interopRequireDefault(_submenuBase); + + var _draw = __webpack_require__(99); + + var _draw2 = _interopRequireDefault(_draw); + + var _consts = __webpack_require__(73); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } + + var DRAW_OPACITY = 0.7; + + /** + * Draw ui class + * @class + * @ignore + */ + + var Draw = function (_Submenu) { + _inherits(Draw, _Submenu); + + function Draw(subMenuElement, _ref) { + var iconStyle = _ref.iconStyle, + menuBarPosition = _ref.menuBarPosition; + + _classCallCheck(this, Draw); + + var _this = _possibleConstructorReturn(this, (Draw.__proto__ || Object.getPrototypeOf(Draw)).call(this, subMenuElement, { + name: 'draw', + iconStyle: iconStyle, + menuBarPosition: menuBarPosition, + templateHtml: _draw2.default + })); + + _this._els = { + lineSelectButton: _this.selector('#tie-draw-line-select-button'), + drawColorpicker: new _colorpicker2.default(_this.selector('#tie-draw-color'), '#00a9ff', _this.toggleDirection), + drawRange: new _range2.default(_this.selector('#tie-draw-range'), _consts.defaultDrawRangeValus), + drawRangeValue: _this.selector('#tie-draw-range-value') + }; + + _this.type = null; + _this.color = _this._els.drawColorpicker.color; + _this.width = _this._els.drawRange.value; + return _this; + } + + /** + * Add event for draw + * @param {Object} actions - actions for crop + * @param {Function} actions.setDrawMode - set draw mode + */ + + + _createClass(Draw, [{ + key: 'addEvent', + value: function addEvent(actions) { + this.actions = actions; + + this._els.lineSelectButton.addEventListener('click', this._changeDrawType.bind(this)); + this._els.drawColorpicker.on('change', this._changeDrawColor.bind(this)); + this._els.drawRange.on('change', this._changeDrawRange.bind(this)); + this._els.drawRangeValue.value = this._els.drawRange.value; + this._els.drawRangeValue.setAttribute('readonly', true); + } + + /** + * set draw mode - action runner + */ + + }, { + key: 'setDrawMode', + value: function setDrawMode() { + this.actions.setDrawMode(this.type, { + width: this.width, + color: _util2.default.getRgb(this.color, DRAW_OPACITY) + }); + } + + /** + * Returns the menu to its default state. + */ + + }, { + key: 'changeStandbyMode', + value: function changeStandbyMode() { + this.type = null; + this.actions.stopDrawingMode(); + this.actions.changeSelectableAll(true); + this._els.lineSelectButton.classList.remove('free'); + this._els.lineSelectButton.classList.remove('line'); + } + + /** + * Executed when the menu starts. + */ + + }, { + key: 'changeStartMode', + value: function changeStartMode() { + this.type = 'free'; + this._els.lineSelectButton.classList.add('free'); + this.setDrawMode(); + } + + /** + * Change draw type event + * @param {object} event - line select event + * @private + */ + + }, { + key: '_changeDrawType', + value: function _changeDrawType(event) { + var button = event.target.closest('.tui-image-editor-button'); + if (button) { + var lineType = this.getButtonType(button, ['free', 'line']); + this.actions.discardSelection(); + + if (this.type === lineType) { + this.changeStandbyMode(); + + return; + } + + this.changeStandbyMode(); + this.type = lineType; + this._els.lineSelectButton.classList.add(lineType); + this.setDrawMode(); + } + } + + /** + * Change drawing color + * @param {string} color - select drawing color + * @private + */ + + }, { + key: '_changeDrawColor', + value: function _changeDrawColor(color) { + this.color = color || 'transparent'; + if (!this.type) { + this.changeStartMode(); + } else { + this.setDrawMode(); + } + } + + /** + * Change drawing Range + * @param {number} value - select drawing range + * @private + */ + + }, { + key: '_changeDrawRange', + value: function _changeDrawRange(value) { + value = _util2.default.toInteger(value); + this._els.drawRangeValue.value = value; + this.width = value; + if (!this.type) { + this.changeStartMode(); + } else { + this.setDrawMode(); + } + } + }]); + + return Draw; + }(_submenuBase2.default); + + exports.default = Draw; + +/***/ }), +/* 99 */ +/***/ (function(module, exports) { + + "use strict"; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + exports.default = function (_ref) { + var _ref$iconStyle = _ref.iconStyle, + normal = _ref$iconStyle.normal, + active = _ref$iconStyle.active; + return "\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n"; + }; + +/***/ }), +/* 100 */ +/***/ (function(module, exports, __webpack_require__) { + + 'use strict'; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _tuiCodeSnippet = __webpack_require__(3); + + var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + + var _colorpicker = __webpack_require__(81); + + var _colorpicker2 = _interopRequireDefault(_colorpicker); + + var _range = __webpack_require__(83); + + var _range2 = _interopRequireDefault(_range); + + var _submenuBase = __webpack_require__(84); + + var _submenuBase2 = _interopRequireDefault(_submenuBase); + + var _filter = __webpack_require__(101); + + var _filter2 = _interopRequireDefault(_filter); + + var _util = __webpack_require__(72); + + var _consts = __webpack_require__(73); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } + + var PICKER_CONTROL_HEIGHT = '130px'; + var BLEND_OPTIONS = ['add', 'diff', 'subtract', 'multiply', 'screen', 'lighten', 'darken']; + var FILTER_OPTIONS = ['grayscale', 'invert', 'sepia', 'sepia2', 'blur', 'sharpen', 'emboss', 'remove-white', 'gradient-transparency', 'brightness', 'noise', 'pixelate', 'color-filter', 'tint', 'multiply', 'blend']; + + /** + * Filter ui class + * @class + * @ignore + */ + + var Filter = function (_Submenu) { + _inherits(Filter, _Submenu); + + function Filter(subMenuElement, _ref) { + var iconStyle = _ref.iconStyle, + menuBarPosition = _ref.menuBarPosition; + + _classCallCheck(this, Filter); + + var _this = _possibleConstructorReturn(this, (Filter.__proto__ || Object.getPrototypeOf(Filter)).call(this, subMenuElement, { + name: 'filter', + iconStyle: iconStyle, + menuBarPosition: menuBarPosition, + templateHtml: _filter2.default + })); + + _this.checkedMap = {}; + _this._makeControlElement(); + return _this; + } + + /** + * Add event for filter + * @param {Object} actions - actions for crop + * @param {Function} actions.applyFilter - apply filter option + */ + + + _createClass(Filter, [{ + key: 'addEvent', + value: function addEvent(_ref2) { + var _this2 = this; + + var applyFilter = _ref2.applyFilter; + + var changeRangeValue = function changeRangeValue(filterName) { + var apply = _this2.checkedMap[filterName].checked; + var type = filterName; + + applyFilter(apply, type, _this2._getFilterOption(type)); + }; + + _tuiCodeSnippet2.default.forEach(FILTER_OPTIONS, function (filterName) { + var filterCheckElement = _this2.selector('#tie-' + filterName); + var filterNameCamelCase = (0, _util.toCamelCase)(filterName); + _this2.checkedMap[filterNameCamelCase] = filterCheckElement; + + filterCheckElement.addEventListener('change', function () { + return changeRangeValue(filterNameCamelCase); + }); + }); + + this._els.removewhiteThresholdRange.on('change', function () { + return changeRangeValue('removeWhite'); + }); + this._els.removewhiteDistanceRange.on('change', function () { + return changeRangeValue('removeWhite'); + }); + this._els.gradientTransparencyRange.on('change', function () { + return changeRangeValue('gradientTransparency'); + }); + this._els.colorfilterThresholeRange.on('change', function () { + return changeRangeValue('colorFilter'); + }); + this._els.pixelateRange.on('change', function () { + return changeRangeValue('pixelate'); + }); + this._els.noiseRange.on('change', function () { + return changeRangeValue('noise'); + }); + this._els.brightnessRange.on('change', function () { + return changeRangeValue('brightness'); + }); + this._els.blendType.addEventListener('change', function () { + return changeRangeValue('blend'); + }); + this._els.filterBlendColor.on('change', function () { + return changeRangeValue('blend'); + }); + this._els.filterMultiplyColor.on('change', function () { + return changeRangeValue('multiply'); + }); + this._els.tintOpacity.on('change', function () { + return changeRangeValue('tint'); + }); + this._els.filterTintColor.on('change', function () { + return changeRangeValue('tint'); + }); + this._els.blendType.addEventListener('click', function (event) { + return event.stopPropagation(); + }); + } + + /** + * Get filter option + * @param {String} type - filter type + * @returns {Object} filter option object + * @private + */ + + }, { + key: '_getFilterOption', + value: function _getFilterOption(type) { + // eslint-disable-line + var option = {}; + switch (type) { + case 'removeWhite': + option.threshold = (0, _util.toInteger)(this._els.removewhiteThresholdRange.value); + option.distance = (0, _util.toInteger)(this._els.removewhiteDistanceRange.value); + break; + case 'gradientTransparency': + option.threshold = (0, _util.toInteger)(this._els.gradientTransparencyRange.value); + break; + case 'colorFilter': + option.color = '#FFFFFF'; + option.threshold = this._els.colorfilterThresholeRange.value; + break; + case 'pixelate': + option.blocksize = (0, _util.toInteger)(this._els.pixelateRange.value); + break; + case 'noise': + option.noise = (0, _util.toInteger)(this._els.noiseRange.value); + break; + case 'brightness': + option.brightness = (0, _util.toInteger)(this._els.brightnessRange.value); + break; + case 'blend': + option.color = this._els.filterBlendColor.color; + option.mode = this._els.blendType.value; + break; + case 'multiply': + option.color = this._els.filterMultiplyColor.color; + break; + case 'tint': + option.color = this._els.filterTintColor.color; + option.opacity = this._els.tintOpacity.value; + break; + default: + break; + } + + return option; + } + + /** + * Make submenu range and colorpicker control + * @private + */ + + }, { + key: '_makeControlElement', + value: function _makeControlElement() { + var selector = this.selector; + + this._els = { + removewhiteThresholdRange: new _range2.default(selector('#tie-removewhite-threshold-range'), _consts.defaultFilterRangeValus.removewhiteThresholdRange), + removewhiteDistanceRange: new _range2.default(selector('#tie-removewhite-distance-range'), _consts.defaultFilterRangeValus.removewhiteDistanceRange), + gradientTransparencyRange: new _range2.default(selector('#tie-gradient-transparency-range'), _consts.defaultFilterRangeValus.gradientTransparencyRange), + brightnessRange: new _range2.default(selector('#tie-brightness-range'), _consts.defaultFilterRangeValus.brightnessRange), + noiseRange: new _range2.default(selector('#tie-noise-range'), _consts.defaultFilterRangeValus.noiseRange), + pixelateRange: new _range2.default(selector('#tie-pixelate-range'), _consts.defaultFilterRangeValus.pixelateRange), + colorfilterThresholeRange: new _range2.default(selector('#tie-colorfilter-threshole-range'), _consts.defaultFilterRangeValus.colorfilterThresholeRange), + filterTintColor: new _colorpicker2.default(selector('#tie-filter-tint-color'), '#03bd9e', this.toggleDirection), + filterMultiplyColor: new _colorpicker2.default(selector('#tie-filter-multiply-color'), '#515ce6', this.toggleDirection), + filterBlendColor: new _colorpicker2.default(selector('#tie-filter-blend-color'), '#ffbb3b', this.toggleDirection) + }; + this._els.tintOpacity = this._pickerWithRange(this._els.filterTintColor.pickerControl); + this._els.blendType = this._pickerWithSelectbox(this._els.filterBlendColor.pickerControl); + } + + /** + * Make submenu control for picker & range mixin + * @param {HTMLElement} pickerControl - pickerControl dom element + * @returns {Range} + * @private + */ + + }, { + key: '_pickerWithRange', + value: function _pickerWithRange(pickerControl) { + var rangeWrap = document.createElement('div'); + var rangelabel = document.createElement('label'); + var range = document.createElement('div'); + + range.id = 'tie-filter-tint-opacity'; + rangelabel.innerHTML = 'Opacity'; + rangeWrap.appendChild(rangelabel); + rangeWrap.appendChild(range); + pickerControl.appendChild(rangeWrap); + pickerControl.style.height = PICKER_CONTROL_HEIGHT; + + return new _range2.default(range, _consts.defaultFilterRangeValus.tintOpacityRange); + } + + /** + * Make submenu control for picker & selectbox + * @param {HTMLElement} pickerControl - pickerControl dom element + * @returns {HTMLElement} + * @private + */ + + }, { + key: '_pickerWithSelectbox', + value: function _pickerWithSelectbox(pickerControl) { + var selectlistWrap = document.createElement('div'); + var selectlist = document.createElement('select'); - var flush = function(){ - var parent, fn; - if(isNode && (parent = process.domain))parent.exit(); - while(head){ - fn = head.fn; - head = head.next; - try { - fn(); - } catch(e){ - if(head)notify(); - else last = undefined; - throw e; - } - } last = undefined; - if(parent)parent.enter(); - }; + selectlistWrap.className = 'tui-image-editor-selectlist-wrap'; + selectlistWrap.appendChild(selectlist); - // Node.js - if(isNode){ - notify = function(){ - process.nextTick(flush); - }; - // browsers with MutationObserver - } else if(Observer){ - var toggle = true - , node = document.createTextNode(''); - new Observer(flush).observe(node, {characterData: true}); // eslint-disable-line no-new - notify = function(){ - node.data = toggle = !toggle; - }; - // environments with maybe non-completely correct, but existent Promise - } else if(Promise && Promise.resolve){ - var promise = Promise.resolve(); - notify = function(){ - promise.then(flush); - }; - // for other environments - macrotask based on: - // - setImmediate - // - MessageChannel - // - window.postMessag - // - onreadystatechange - // - setTimeout - } else { - notify = function(){ - // strange IE + webpack dev server bug - use .call(global) - macrotask.call(global, flush); - }; - } + this._makeSelectOptionList(selectlist); - return function(fn){ - var task = {fn: fn, next: undefined}; - if(last)last.next = task; - if(!head){ - head = task; - notify(); - } last = task; - }; - }; + pickerControl.appendChild(selectlistWrap); + pickerControl.style.height = PICKER_CONTROL_HEIGHT; -/***/ }), -/* 65 */ -/***/ (function(module, exports, __webpack_require__) { + return selectlist; + } - var hide = __webpack_require__(17); - module.exports = function(target, src, safe){ - for(var key in src){ - if(safe && target[key])target[key] = src[key]; - else hide(target, key, src[key]); - } return target; - }; + /** + * Make blend select option + * @param {HTMLElement} selectlist - blend option select list element + * @private + */ -/***/ }), -/* 66 */ -/***/ (function(module, exports, __webpack_require__) { + }, { + key: '_makeSelectOptionList', + value: function _makeSelectOptionList(selectlist) { + _tuiCodeSnippet2.default.forEach(BLEND_OPTIONS, function (option) { + var selectOption = document.createElement('option'); + selectOption.setAttribute('value', option); + selectOption.innerHTML = option.replace(/^[a-z]/, function ($0) { + return $0.toUpperCase(); + }); + selectlist.appendChild(selectOption); + }); + } + }]); - 'use strict'; - var global = __webpack_require__(13) - , core = __webpack_require__(14) - , dP = __webpack_require__(18) - , DESCRIPTORS = __webpack_require__(22) - , SPECIES = __webpack_require__(47)('species'); + return Filter; + }(_submenuBase2.default); - module.exports = function(KEY){ - var C = typeof core[KEY] == 'function' ? core[KEY] : global[KEY]; - if(DESCRIPTORS && C && !C[SPECIES])dP.f(C, SPECIES, { - configurable: true, - get: function(){ return this; } - }); - }; + exports.default = Filter; /***/ }), -/* 67 */ -/***/ (function(module, exports, __webpack_require__) { +/* 101 */ +/***/ (function(module, exports) { - var ITERATOR = __webpack_require__(47)('iterator') - , SAFE_CLOSING = false; + "use strict"; - try { - var riter = [7][ITERATOR](); - riter['return'] = function(){ SAFE_CLOSING = true; }; - Array.from(riter, function(){ throw 2; }); - } catch(e){ /* empty */ } + Object.defineProperty(exports, "__esModule", { + value: true + }); - module.exports = function(exec, skipClosing){ - if(!skipClosing && !SAFE_CLOSING)return false; - var safe = false; - try { - var arr = [7] - , iter = arr[ITERATOR](); - iter.next = function(){ return {done: safe = true}; }; - arr[ITERATOR] = function(){ return iter; }; - exec(arr); - } catch(e){ /* empty */ } - return safe; + exports.default = function () { + return "\n
      \n
    • \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n\n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      • \n
    \n"; }; /***/ }), -/* 68 */ +/* 102 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _command = __webpack_require__(69); + Object.defineProperty(exports, "__esModule", { + value: true + }); - var _command2 = _interopRequireDefault(_command); + var _tuiCodeSnippet = __webpack_require__(3); - function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + var _util = __webpack_require__(72); - var commands = {}; + var _util2 = _interopRequireDefault(_util); - /** - * Create a command - * @param {string} name - Command name - * @param {...*} args - Arguments for creating command - * @returns {Command} - * @ignore - */ - /** - * @author NHN Ent. FE Development Team - * @fileoverview Command factory - */ - function create(name) { - var actions = commands[name]; - if (actions) { - for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { - args[_key - 1] = arguments[_key]; - } + var _imagetracer = __webpack_require__(103); - return new _command2.default(actions, args); - } + var _imagetracer2 = _interopRequireDefault(_imagetracer); - return null; - } + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } - /** - * Register a command with name as a key - * @param {Object} command - {name:{string}, execute: {function}, undo: {function}} - * @param {string} command.name - command name - * @param {function} command.execute - executable function - * @param {function} command.undo - undo function - * @ignore - */ - function register(command) { - commands[command.name] = command; - } + exports.default = { - module.exports = { - create: create, - register: register - }; + /** + * Get ui actions + * @returns {Object} actions for ui + * @private + */ + getActions: function getActions() { + return { + main: this._mainAction(), + shape: this._shapeAction(), + crop: this._cropAction(), + flip: this._flipAction(), + rotate: this._rotateAction(), + text: this._textAction(), + mask: this._maskAction(), + draw: this._drawAction(), + icon: this._iconAction(), + filter: this._filterAction() + }; + }, -/***/ }), -/* 69 */ -/***/ (function(module, exports, __webpack_require__) { - 'use strict'; + /** + * Main Action + * @returns {Object} actions for ui main + * @private + */ + _mainAction: function _mainAction() { + var _this = this; - var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); /** - * @author NHN Ent. FE Development Team - * @fileoverview Command interface - */ + var exitCropOnAction = function exitCropOnAction() { + if (_this.ui.submenu === 'crop') { + _this.stopDrawingMode(); + _this.ui.changeMenu('crop'); + } + }; + + return (0, _tuiCodeSnippet.extend)({ + initLoadImage: function initLoadImage(imagePath, imageName) { + return _this.loadImageFromURL(imagePath, imageName).then(function (sizeValue) { + exitCropOnAction(); + _this.ui.initializeImgUrl = imagePath; + _this.ui.resizeEditor({ imageSize: sizeValue }); + _this.clearUndoStack(); + }); + }, + undo: function undo() { + if (!_this.isEmptyUndoStack()) { + exitCropOnAction(); + _this.undo(); + } + }, + redo: function redo() { + if (!_this.isEmptyRedoStack()) { + exitCropOnAction(); + _this.redo(); + } + }, + reset: function reset() { + exitCropOnAction(); + _this.loadImageFromURL(_this.ui.initializeImgUrl, 'resetImage').then(function (sizeValue) { + exitCropOnAction(); + _this.ui.resizeEditor({ imageSize: sizeValue }); + _this.clearUndoStack(); + }); + }, + delete: function _delete() { + _this.ui.changeDeleteButtonEnabled(false); + exitCropOnAction(); + _this.removeActiveObject(); + _this.activeObjectId = null; + }, + deleteAll: function deleteAll() { + exitCropOnAction(); + _this.clearObjects(); + _this.ui.changeDeleteButtonEnabled(false); + _this.ui.changeDeleteAllButtonEnabled(false); + }, + load: function load(file) { + if (!_util2.default.isSupportFileApi()) { + alert('This browser does not support file-api'); + } + _this.ui.initializeImgUrl = URL.createObjectURL(file); + _this.loadImageFromFile(file).then(function () { + exitCropOnAction(); + _this.clearUndoStack(); + _this.ui.resizeEditor(); + })['catch'](function (message) { + return Promise.reject(message); + }); + }, + download: function download() { + var dataURL = _this.toDataURL(); + var imageName = _this.getImageName(); + var blob = void 0, + type = void 0, + w = void 0; + + if (_util2.default.isSupportFileApi() && window.saveAs) { + blob = _util2.default.base64ToBlob(dataURL); + type = blob.type.split('/')[1]; + if (imageName.split('.').pop() !== type) { + imageName += '.' + type; + } + saveAs(blob, imageName); // eslint-disable-line + } else { + w = window.open(); + w.document.body.innerHTML = ''; + } + } + }, this._commonAction()); + }, - var _errorMessage = __webpack_require__(70); - var _errorMessage2 = _interopRequireDefault(_errorMessage); + /** + * Icon Action + * @returns {Object} actions for ui icon + * @private + */ + _iconAction: function _iconAction() { + var _this2 = this; - function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + var cacheIconType = void 0; + var cacheIconColor = void 0; + var startX = void 0; + var startY = void 0; + var iconWidth = void 0; + var iconHeight = void 0; + var objId = void 0; - function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + this.on({ + 'iconCreateResize': function iconCreateResize(_ref) { + var moveOriginPointer = _ref.moveOriginPointer; - var createMessage = _errorMessage2.default.create; - var errorTypes = _errorMessage2.default.types; + var scaleX = (moveOriginPointer.x - startX) / iconWidth; + var scaleY = (moveOriginPointer.y - startY) / iconHeight; - /** - * Command class - * @class - * @param {{name:function, execute: function, undo: function, - * executeCallback: function, undoCallback: function}} actions - Command actions - * @param {Array} args - passing arguments on execute, undo - * @ignore - */ + _this2.setObjectPropertiesQuietly(objId, { + scaleX: Math.abs(scaleX * 2), + scaleY: Math.abs(scaleY * 2) + }); + }, + 'iconCreateEnd': function iconCreateEnd() { + _this2.ui.icon.clearIconType(); + _this2.changeSelectableAll(true); + } + }); + + var mouseDown = function mouseDown(e, originPointer) { + startX = originPointer.x; + startY = originPointer.y; + + _this2.addIcon(cacheIconType, { + left: originPointer.x, + top: originPointer.y, + fill: cacheIconColor + }).then(function (obj) { + objId = obj.id; + iconWidth = obj.width; + iconHeight = obj.height; + }); + }; + + return (0, _tuiCodeSnippet.extend)({ + changeColor: function changeColor(color) { + if (_this2.activeObjectId) { + _this2.changeIconColor(_this2.activeObjectId, color); + } + }, + addIcon: function addIcon(iconType, iconColor) { + cacheIconType = iconType; + cacheIconColor = iconColor; + // this.readyAddIcon(); + _this2.changeCursor('crosshair'); + _this2.off('mousedown'); + _this2.once('mousedown', mouseDown.bind(_this2)); + }, + cancelAddIcon: function cancelAddIcon() { + _this2.off('mousedown'); + _this2.ui.icon.clearIconType(); + _this2.changeSelectableAll(true); + _this2.changeCursor('default'); + }, + registDefalutIcons: function registDefalutIcons(type, path) { + var iconObj = {}; + iconObj[type] = path; + _this2.registerIcons(iconObj); + }, + registCustomIcon: function registCustomIcon(imgUrl, file) { + var imagetracer = new _imagetracer2.default(); + imagetracer.imageToSVG(imgUrl, function (svgstr) { + var _svgstr$match = svgstr.match(/path[^>]*d="([^"]*)"/), + svgPath = _svgstr$match[1]; + + var iconObj = {}; + iconObj[file.name] = svgPath; + _this2.registerIcons(iconObj); + _this2.addIcon(file.name, { + left: 100, + top: 100 + }); + }, _imagetracer2.default.tracerDefaultOption()); + } + }, this._commonAction()); + }, - var Command = function () { - function Command(actions, args) { - _classCallCheck(this, Command); /** - * command name - * @type {string} + * Draw Action + * @returns {Object} actions for ui draw + * @private */ - this.name = actions.name; + _drawAction: function _drawAction() { + var _this3 = this; + + return (0, _tuiCodeSnippet.extend)({ + setDrawMode: function setDrawMode(type, settings) { + _this3.stopDrawingMode(); + if (type === 'free') { + _this3.startDrawingMode('FREE_DRAWING', settings); + } else { + _this3.startDrawingMode('LINE_DRAWING', settings); + } + }, + setColor: function setColor(color) { + _this3.setBrush({ + color: color + }); + } + }, this._commonAction()); + }, + /** - * arguments - * @type {Array} + * Mask Action + * @returns {Object} actions for ui mask + * @private */ - this.args = args; + _maskAction: function _maskAction() { + var _this4 = this; + + return (0, _tuiCodeSnippet.extend)({ + loadImageFromURL: function loadImageFromURL(imgUrl, file) { + return _this4.loadImageFromURL(_this4.toDataURL(), 'FilterImage').then(function () { + _this4.addImageObject(imgUrl).then(function () { + URL.revokeObjectURL(file); + }); + }); + }, + applyFilter: function applyFilter() { + _this4.applyFilter('mask', { + maskObjId: _this4.activeObjectId + }); + } + }, this._commonAction()); + }, + /** - * Execute function - * @type {function} + * Text Action + * @returns {Object} actions for ui text + * @private */ - this.execute = actions.execute; + _textAction: function _textAction() { + var _this5 = this; + + return (0, _tuiCodeSnippet.extend)({ + changeTextStyle: function changeTextStyle(styleObj) { + if (_this5.activeObjectId) { + _this5.changeTextStyle(_this5.activeObjectId, styleObj); + } + } + }, this._commonAction()); + }, + /** - * Undo function - * @type {function} + * Rotate Action + * @returns {Object} actions for ui rotate + * @private */ - this.undo = actions.undo; + _rotateAction: function _rotateAction() { + var _this6 = this; + + return (0, _tuiCodeSnippet.extend)({ + rotate: function rotate(angle) { + _this6.rotate(angle); + _this6.ui.resizeEditor(); + }, + setAngle: function setAngle(angle) { + _this6.setAngle(angle); + _this6.ui.resizeEditor(); + } + }, this._commonAction()); + }, + /** - * executeCallback - * @type {function} + * Shape Action + * @returns {Object} actions for ui shape + * @private */ - this.executeCallback = actions.executeCallback || null; + _shapeAction: function _shapeAction() { + var _this7 = this; + + return (0, _tuiCodeSnippet.extend)({ + changeShape: function changeShape(changeShapeObject) { + if (_this7.activeObjectId) { + _this7.changeShape(_this7.activeObjectId, changeShapeObject); + } + }, + setDrawingShape: function setDrawingShape(shapeType) { + _this7.setDrawingShape(shapeType); + } + }, this._commonAction()); + }, + /** - * undoCallback - * @type {function} + * Crop Action + * @returns {Object} actions for ui crop + * @private */ - this.undoCallback = actions.undoCallback || null; + _cropAction: function _cropAction() { + var _this8 = this; + + return (0, _tuiCodeSnippet.extend)({ + crop: function crop() { + var cropRect = _this8.getCropzoneRect(); + if (cropRect) { + _this8.crop(cropRect).then(function () { + _this8.stopDrawingMode(); + _this8.ui.resizeEditor(); + _this8.ui.changeMenu('crop'); + })['catch'](function (message) { + return Promise.reject(message); + }); + } + }, + cancel: function cancel() { + _this8.stopDrawingMode(); + _this8.ui.changeMenu('crop'); + } + }, this._commonAction()); + }, + /** - * data for undo - * @type {Object} + * Flip Action + * @returns {Object} actions for ui flip + * @private */ - this.undoData = {}; - } - - /** - * Execute action - * @param {Object.} compMap - Components injection - * @abstract - */ + _flipAction: function _flipAction() { + var _this9 = this; + return (0, _tuiCodeSnippet.extend)({ + flip: function flip(flipType) { + return _this9[flipType](); + } + }, this._commonAction()); + }, - _createClass(Command, [{ - key: 'execute', - value: function execute() { - throw new Error(createMessage(errorTypes.UN_IMPLEMENTATION, 'execute')); - } /** - * Undo action - * @param {Object.} compMap - Components injection - * @abstract + * Filter Action + * @returns {Object} actions for ui filter + * @private */ + _filterAction: function _filterAction() { + var _this10 = this; + + return (0, _tuiCodeSnippet.extend)({ + applyFilter: function applyFilter(applying, type, options) { + if (applying) { + _this10.applyFilter(type, options); + } else if (_this10.hasFilter(type)) { + _this10.removeFilter(type); + } + } + }, this._commonAction()); + }, - }, { - key: 'undo', - value: function undo() { - throw new Error(createMessage(errorTypes.UN_IMPLEMENTATION, 'undo')); - } /** - * Attach execute callabck - * @param {function} callback - Callback after execution - * @returns {Command} this + * Image Editor Event Observer */ + setReAction: function setReAction() { + var _this11 = this; - }, { - key: 'setExecuteCallback', - value: function setExecuteCallback(callback) { - this.executeCallback = callback; + this.on({ + undoStackChanged: function undoStackChanged(length) { + if (length) { + _this11.ui.changeUndoButtonStatus(true); + _this11.ui.changeResetButtonStatus(true); + } else { + _this11.ui.changeUndoButtonStatus(false); + _this11.ui.changeResetButtonStatus(false); + } + _this11.ui.resizeEditor(); + }, + redoStackChanged: function redoStackChanged(length) { + if (length) { + _this11.ui.changeRedoButtonStatus(true); + } else { + _this11.ui.changeRedoButtonStatus(false); + } + _this11.ui.resizeEditor(); + }, + /* eslint-disable complexity */ + objectActivated: function objectActivated(obj) { + _this11.activeObjectId = obj.id; + + _this11.ui.changeDeleteButtonEnabled(true); + _this11.ui.changeDeleteAllButtonEnabled(true); + + if (obj.type === 'cropzone') { + _this11.ui.crop.changeApplyButtonStatus(true); + } else if (['rect', 'circle', 'triangle'].indexOf(obj.type) > -1) { + _this11.stopDrawingMode(); + if (_this11.ui.submenu !== 'shape') { + _this11.ui.changeMenu('shape', false, false); + } + _this11.ui.shape.setShapeStatus({ + strokeColor: obj.stroke, + strokeWidth: obj.strokeWidth, + fillColor: obj.fill + }); + + _this11.ui.shape.setMaxStrokeValue(Math.min(obj.width, obj.height)); + } else if (obj.type === 'path' || obj.type === 'line') { + if (_this11.ui.submenu !== 'draw') { + _this11.ui.changeMenu('draw', false, false); + _this11.ui.draw.changeStandbyMode(); + } + } else if (['i-text', 'text'].indexOf(obj.type) > -1) { + if (_this11.ui.submenu !== 'text') { + _this11.ui.changeMenu('text', false, false); + } + } else if (obj.type === 'icon') { + _this11.stopDrawingMode(); + if (_this11.ui.submenu !== 'icon') { + _this11.ui.changeMenu('icon', false, false); + } + _this11.ui.icon.setIconPickerColor(obj.fill); + } + }, + /* eslint-enable complexity */ + addText: function addText(pos) { + _this11.addText('Double Click', { + position: pos.originPosition, + styles: { + fill: _this11.ui.text.textColor, + fontSize: _util2.default.toInteger(_this11.ui.text.fontSize) + } + }).then(function () { + _this11.changeCursor('default'); + }); + }, + addObjectAfter: function addObjectAfter(obj) { + if (['rect', 'circle', 'triangle'].indexOf(obj.type) > -1) { + _this11.ui.shape.setMaxStrokeValue(Math.min(obj.width, obj.height)); + _this11.ui.shape.changeStandbyMode(); + } + }, + objectScaled: function objectScaled(obj) { + if (['i-text', 'text'].indexOf(obj.type) > -1) { + _this11.ui.text.fontSize = _util2.default.toInteger(obj.fontSize); + } else if (['rect', 'circle', 'triangle'].indexOf(obj.type) >= 0) { + var width = obj.width, + height = obj.height; + + var strokeValue = _this11.ui.shape.getStrokeValue(); + + if (width < strokeValue) { + _this11.ui.shape.setStrokeValue(width); + } + if (height < strokeValue) { + _this11.ui.shape.setStrokeValue(height); + } + } + }, + selectionCleared: function selectionCleared() { + _this11.activeObjectId = null; + if (_this11.ui.submenu === 'text') { + _this11.changeCursor('text'); + } else if (_this11.ui.submenu !== 'draw' && _this11.ui.submenu !== 'crop') { + _this11.stopDrawingMode(); + } + } + }); + }, - return this; - } /** - * Attach undo callback - * @param {function} callback - Callback after undo - * @returns {Command} this + * Common Action + * @returns {Object} common actions for ui + * @private */ + _commonAction: function _commonAction() { + var _this12 = this; - }, { - key: 'setUndoCallback', - value: function setUndoCallback(callback) { - this.undoCallback = callback; - - return this; - } - }]); + return { + modeChange: function modeChange(menu) { + switch (menu) { + case 'text': + _this12._changeActivateMode('TEXT'); + break; + case 'crop': + _this12.startDrawingMode('CROPPER'); + break; + case 'shape': + _this12._changeActivateMode('SHAPE'); + _this12.setDrawingShape(_this12.ui.shape.type, _this12.ui.shape.options); + break; + default: + break; + } + }, + deactivateAll: this.deactivateAll.bind(this), + changeSelectableAll: this.changeSelectableAll.bind(this), + discardSelection: this.discardSelection.bind(this), + stopDrawingMode: this.stopDrawingMode.bind(this) + }; + }, - return Command; - }(); - module.exports = Command; + /** + * Mixin + * @param {ImageEditor} ImageEditor instance + */ + mixin: function mixin(ImageEditor) { + (0, _tuiCodeSnippet.extend)(ImageEditor.prototype, this); + } + }; /***/ }), -/* 70 */ -/***/ (function(module, exports, __webpack_require__) { +/* 103 */ +/***/ (function(module, exports) { 'use strict'; - var _tuiCodeSnippet = __webpack_require__(2); + Object.defineProperty(exports, "__esModule", { + value: true + }); - var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _util = __webpack_require__(71); + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } - function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + /* + imagetracer.js version 1.2.4 + Simple raster image tracer and vectorizer written in JavaScript. + andras@jankovics.net + */ + + /* + The Unlicense / PUBLIC DOMAIN + This is free and unencumbered software released into the public domain. + Anyone is free to copy, modify, publish, use, compile, sell, or + distribute this software, either in source code form or as a compiled + binary, for any purpose, commercial or non-commercial, and by any + means. + In jurisdictions that recognize copyright laws, the author or authors + of this software dedicate any and all copyright interest in the + software to the public domain. We make this dedication for the benefit + of the public at large and to the detriment of our heirs and + successors. We intend this dedication to be an overt act of + relinquishment in perpetuity of all present and future rights to this + software under copyright law. + THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, + EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF + MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. + IN NO EVENT SHALL THE AUTHORS BE LIABLE FOR ANY CLAIM, DAMAGES OR + OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, + ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR + OTHER DEALINGS IN THE SOFTWARE. + For more information, please refer to http://unlicense.org/ + */ + var ImageTracer = function () { + _createClass(ImageTracer, null, [{ + key: 'tracerDefaultOption', + value: function tracerDefaultOption() { + return { + pathomit: 100, + ltres: 0.1, + qtres: 1, + + scale: 1, + strokewidth: 5, + viewbox: false, + linefilter: true, + desc: false, + rightangleenhance: false, + pal: [{ + r: 0, + g: 0, + b: 0, + a: 255 + }, { + r: 255, + g: 255, + b: 255, + a: 255 + }] + }; + } + /* eslint-disable */ - /** - * @author NHN Ent. FE Development Team - * @fileoverview Error-message factory - */ - var types = (0, _util.keyMirror)('UN_IMPLEMENTATION', 'NO_COMPONENT_NAME'); - var messages = { - UN_IMPLEMENTATION: 'Should implement a method: ', - NO_COMPONENT_NAME: 'Should set a component name' - }; - var map = { - UN_IMPLEMENTATION: function UN_IMPLEMENTATION(methodName) { - return messages.UN_IMPLEMENTATION + methodName; - }, - NO_COMPONENT_NAME: function NO_COMPONENT_NAME() { - return messages.NO_COMPONENT_NAME; - } - }; + }]); - module.exports = { - types: _tuiCodeSnippet2.default.extend({}, types), + function ImageTracer() { + _classCallCheck(this, ImageTracer); + + this.versionnumber = '1.2.4'; + this.optionpresets = { + default: { + corsenabled: false, + ltres: 1, + qtres: 1, + pathomit: 8, + rightangleenhance: true, + colorsampling: 2, + numberofcolors: 16, + mincolorratio: 0, + colorquantcycles: 3, + layering: 0, + strokewidth: 1, + linefilter: false, + scale: 1, + roundcoords: 1, + viewbox: false, + desc: false, + lcpr: 0, + qcpr: 0, + blurradius: 0, + blurdelta: 20 + }, + 'posterized1': { + colorsampling: 0, + numberofcolors: 2 + }, + 'posterized2': { + numberofcolors: 4, + blurradius: 5 + }, + 'curvy': { + ltres: 0.01, + linefilter: true, + rightangleenhance: false }, + 'sharp': { qtres: 0.01, + linefilter: false }, + 'detailed': { pathomit: 0, + roundcoords: 2, + ltres: 0.5, + qtres: 0.5, + numberofcolors: 64 }, + 'smoothed': { blurradius: 5, + blurdelta: 64 }, + 'grayscale': { colorsampling: 0, + colorquantcycles: 1, + numberofcolors: 7 }, + 'fixedpalette': { colorsampling: 0, + colorquantcycles: 1, + numberofcolors: 27 }, + 'randomsampling1': { colorsampling: 1, + numberofcolors: 8 }, + 'randomsampling2': { colorsampling: 1, + numberofcolors: 64 }, + 'artistic1': { colorsampling: 0, + colorquantcycles: 1, + pathomit: 0, + blurradius: 5, + blurdelta: 64, + ltres: 0.01, + linefilter: true, + numberofcolors: 16, + strokewidth: 2 }, + 'artistic2': { qtres: 0.01, + colorsampling: 0, + colorquantcycles: 1, + numberofcolors: 4, + strokewidth: 0 }, + 'artistic3': { qtres: 10, + ltres: 10, + numberofcolors: 8 }, + 'artistic4': { qtres: 10, + ltres: 10, + numberofcolors: 64, + blurradius: 5, + blurdelta: 256, + strokewidth: 2 }, + 'posterized3': { ltres: 1, + qtres: 1, + pathomit: 20, + rightangleenhance: true, + colorsampling: 0, + numberofcolors: 3, + mincolorratio: 0, + colorquantcycles: 3, + blurradius: 3, + blurdelta: 20, + strokewidth: 0, + linefilter: false, + roundcoords: 1, + pal: [{ r: 0, + g: 0, + b: 100, + a: 255 }, { r: 255, + g: 255, + b: 255, + a: 255 }] } + }; - create: function create(type) { - type = type.toLowerCase(); - var func = map[type]; + this.pathscan_combined_lookup = [[[-1, -1, -1, -1], [-1, -1, -1, -1], [-1, -1, -1, -1], [-1, -1, -1, -1]], [[0, 1, 0, -1], [-1, -1, -1, -1], [-1, -1, -1, -1], [0, 2, -1, 0]], [[-1, -1, -1, -1], [-1, -1, -1, -1], [0, 1, 0, -1], [0, 0, 1, 0]], [[0, 0, 1, 0], [-1, -1, -1, -1], [0, 2, -1, 0], [-1, -1, -1, -1]], [[-1, -1, -1, -1], [0, 0, 1, 0], [0, 3, 0, 1], [-1, -1, -1, -1]], [[13, 3, 0, 1], [13, 2, -1, 0], [7, 1, 0, -1], [7, 0, 1, 0]], [[-1, -1, -1, -1], [0, 1, 0, -1], [-1, -1, -1, -1], [0, 3, 0, 1]], [[0, 3, 0, 1], [0, 2, -1, 0], [-1, -1, -1, -1], [-1, -1, -1, -1]], [[0, 3, 0, 1], [0, 2, -1, 0], [-1, -1, -1, -1], [-1, -1, -1, -1]], [[-1, -1, -1, -1], [0, 1, 0, -1], [-1, -1, -1, -1], [0, 3, 0, 1]], [[11, 1, 0, -1], [14, 0, 1, 0], [14, 3, 0, 1], [11, 2, -1, 0]], [[-1, -1, -1, -1], [0, 0, 1, 0], [0, 3, 0, 1], [-1, -1, -1, -1]], [[0, 0, 1, 0], [-1, -1, -1, -1], [0, 2, -1, 0], [-1, -1, -1, -1]], [[-1, -1, -1, -1], [-1, -1, -1, -1], [0, 1, 0, -1], [0, 0, 1, 0]], [[0, 1, 0, -1], [-1, -1, -1, -1], [-1, -1, -1, -1], [0, 2, -1, 0]], [[-1, -1, -1, -1], [-1, -1, -1, -1], [-1, -1, -1, -1], [-1, -1, -1, -1]]]; - for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { - args[_key - 1] = arguments[_key]; - } + this.gks = [[0.27901, 0.44198, 0.27901], [0.135336, 0.228569, 0.272192, 0.228569, 0.135336], [0.086776, 0.136394, 0.178908, 0.195843, 0.178908, 0.136394, 0.086776], [0.063327, 0.093095, 0.122589, 0.144599, 0.152781, 0.144599, 0.122589, 0.093095, 0.063327], [0.049692, 0.069304, 0.089767, 0.107988, 0.120651, 0.125194, 0.120651, 0.107988, 0.089767, 0.069304, 0.049692]]; - return func.apply(undefined, args); + this.specpalette = [{ r: 0, g: 0, b: 0, a: 255 }, { r: 128, g: 128, b: 128, a: 255 }, { r: 0, g: 0, b: 128, a: 255 }, { r: 64, g: 64, b: 128, a: 255 }, { r: 192, g: 192, b: 192, a: 255 }, { r: 255, g: 255, b: 255, a: 255 }, { r: 128, g: 128, b: 192, a: 255 }, { r: 0, g: 0, b: 192, a: 255 }, { r: 128, g: 0, b: 0, a: 255 }, { r: 128, g: 64, b: 64, a: 255 }, { r: 128, g: 0, b: 128, a: 255 }, { r: 168, g: 168, b: 168, a: 255 }, { r: 192, g: 128, b: 128, a: 255 }, { r: 192, g: 0, b: 0, a: 255 }, { r: 255, g: 255, b: 255, a: 255 }, { r: 0, g: 128, b: 0, a: 255 }]; } - }; -/***/ }), -/* 71 */ -/***/ (function(module, exports, __webpack_require__) { + _createClass(ImageTracer, [{ + key: 'imageToSVG', + value: function imageToSVG(url, callback, options) { + var _this = this; - 'use strict'; + options = this.checkoptions(options); + this.loadImage(url, function (canvas) { + callback(_this.imagedataToSVG(_this.getImgdata(canvas), options)); + }, options); + } + }, { + key: 'imagedataToSVG', + value: function imagedataToSVG(imgd, options) { + options = this.checkoptions(options); + var td = this.imagedataToTracedata(imgd, options); - var _tuiCodeSnippet = __webpack_require__(2); + return this.getsvgstring(td, options); + } + }, { + key: 'imageToTracedata', + value: function imageToTracedata(url, callback, options) { + var _this2 = this; - var min = Math.min, - max = Math.max; /** - * @author NHN Ent. FE Development Team - * @fileoverview Util - */ + options = this.checkoptions(options); + this.loadImage(url, function (canvas) { + callback(_this2.imagedataToTracedata(_this2.getImgdata(canvas), options)); + }, options); + } + }, { + key: 'imagedataToTracedata', + value: function imagedataToTracedata(imgd, options) { + options = this.checkoptions(options); + var ii = this.colorquantization(imgd, options); + var tracedata = void 0; + if (options.layering === 0) { + tracedata = { + layers: [], + palette: ii.palette, + width: ii.array[0].length - 2, + height: ii.array.length - 2 + }; - var hostnameSent = false; + for (var colornum = 0; colornum < ii.palette.length; colornum += 1) { + var tracedlayer = this.batchtracepaths(this.internodes(this.pathscan(this.layeringstep(ii, colornum), options.pathomit), options), options.ltres, options.qtres); + tracedata.layers.push(tracedlayer); + } + } else { + var ls = this.layering(ii); + if (options.layercontainerid) { + this.drawLayers(ls, this.specpalette, options.scale, options.layercontainerid); + } + var bps = this.batchpathscan(ls, options.pathomit); + var bis = this.batchinternodes(bps, options); + tracedata = { + layers: this.batchtracelayers(bis, options.ltres, options.qtres), + palette: ii.palette, + width: imgd.width, + height: imgd.height + }; + } - module.exports = { - /** - * Clamp value - * @param {number} value - Value - * @param {number} minValue - Minimum value - * @param {number} maxValue - Maximum value - * @returns {number} clamped value - */ - clamp: function clamp(value, minValue, maxValue) { - var temp = void 0; - if (minValue > maxValue) { - temp = minValue; - minValue = maxValue; - maxValue = temp; + return tracedata; } + }, { + key: 'checkoptions', + value: function checkoptions(options) { + options = options || {}; + if (typeof options === 'string') { + options = options.toLowerCase(); + if (this.optionpresets[options]) { + options = this.optionpresets[options]; + } else { + options = {}; + } + } + var ok = Object.keys(this.optionpresets['default']); + for (var k = 0; k < ok.length; k += 1) { + if (!options.hasOwnProperty(ok[k])) { + options[ok[k]] = this.optionpresets['default'][ok[k]]; + } + } - return max(minValue, min(value, maxValue)); - }, + return options; + } + }, { + key: 'colorquantization', + value: function colorquantization(imgd, options) { + var arr = []; + var idx = 0; + var cd = void 0; + var cdl = void 0; + var ci = void 0; + var paletteacc = []; + var pixelnum = imgd.width * imgd.height; + var i = void 0; + var j = void 0; + var k = void 0; + var cnt = void 0; + var palette = void 0; + + for (j = 0; j < imgd.height + 2; j += 1) { + arr[j] = []; + for (i = 0; i < imgd.width + 2; i += 1) { + arr[j][i] = -1; + } + } + if (options.pal) { + palette = options.pal; + } else if (options.colorsampling === 0) { + palette = this.generatepalette(options.numberofcolors); + } else if (options.colorsampling === 1) { + palette = this.samplepalette(options.numberofcolors, imgd); + } else { + palette = this.samplepalette2(options.numberofcolors, imgd); + } + if (options.blurradius > 0) { + imgd = this.blur(imgd, options.blurradius, options.blurdelta); + } + for (cnt = 0; cnt < options.colorquantcycles; cnt += 1) { + if (cnt > 0) { + for (k = 0; k < palette.length; k += 1) { + if (paletteacc[k].n > 0) { + palette[k] = { r: Math.floor(paletteacc[k].r / paletteacc[k].n), + g: Math.floor(paletteacc[k].g / paletteacc[k].n), + b: Math.floor(paletteacc[k].b / paletteacc[k].n), + a: Math.floor(paletteacc[k].a / paletteacc[k].n) }; + } + + if (paletteacc[k].n / pixelnum < options.mincolorratio && cnt < options.colorquantcycles - 1) { + palette[k] = { r: Math.floor(Math.random() * 255), + g: Math.floor(Math.random() * 255), + b: Math.floor(Math.random() * 255), + a: Math.floor(Math.random() * 255) }; + } + } + } + for (i = 0; i < palette.length; i += 1) { + paletteacc[i] = { r: 0, + g: 0, + b: 0, + a: 0, + n: 0 }; + } - /** - * Make key-value object from arguments - * @returns {object.} - */ - keyMirror: function keyMirror() { - var obj = {}; + for (j = 0; j < imgd.height; j += 1) { + for (i = 0; i < imgd.width; i += 1) { + idx = (j * imgd.width + i) * 4; - for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { - args[_key] = arguments[_key]; + ci = 0; + cdl = 1024; + for (k = 0; k < palette.length; k += 1) { + cd = Math.abs(palette[k].r - imgd.data[idx]) + Math.abs(palette[k].g - imgd.data[idx + 1]) + Math.abs(palette[k].b - imgd.data[idx + 2]) + Math.abs(palette[k].a - imgd.data[idx + 3]); + + if (cd < cdl) { + cdl = cd; + ci = k; + } + } + + paletteacc[ci].r += imgd.data[idx]; + paletteacc[ci].g += imgd.data[idx + 1]; + paletteacc[ci].b += imgd.data[idx + 2]; + paletteacc[ci].a += imgd.data[idx + 3]; + paletteacc[ci].n += 1; + + arr[j + 1][i + 1] = ci; + } + } + } + + return { array: arr, + palette: palette }; } + }, { + key: 'samplepalette', + value: function samplepalette(numberofcolors, imgd) { + var idx = void 0; + var palette = []; + for (var i = 0; i < numberofcolors; i += 1) { + idx = Math.floor(Math.random() * imgd.data.length / 4) * 4; + palette.push({ r: imgd.data[idx], + g: imgd.data[idx + 1], + b: imgd.data[idx + 2], + a: imgd.data[idx + 3] }); + } - (0, _tuiCodeSnippet.forEach)(args, function (key) { - obj[key] = key; - }); + return palette; + } + }, { + key: 'samplepalette2', + value: function samplepalette2(numberofcolors, imgd) { + var idx = void 0; + var palette = []; + var ni = Math.ceil(Math.sqrt(numberofcolors)); + var nj = Math.ceil(numberofcolors / ni); + var vx = imgd.width / (ni + 1); + var vy = imgd.height / (nj + 1); + for (var j = 0; j < nj; j += 1) { + for (var i = 0; i < ni; i += 1) { + if (palette.length === numberofcolors) { + break; + } else { + idx = Math.floor((j + 1) * vy * imgd.width + (i + 1) * vx) * 4; + palette.push({ r: imgd.data[idx], + g: imgd.data[idx + 1], + b: imgd.data[idx + 2], + a: imgd.data[idx + 3] }); + } + } + } - return obj; - }, + return palette; + } + }, { + key: 'generatepalette', + value: function generatepalette(numberofcolors) { + var palette = []; + var rcnt = void 0; + var gcnt = void 0; + var bcnt = void 0; + if (numberofcolors < 8) { + var graystep = Math.floor(255 / (numberofcolors - 1)); + for (var i = 0; i < numberofcolors; i += 1) { + palette.push({ r: i * graystep, + g: i * graystep, + b: i * graystep, + a: 255 }); + } + } else { + var colorqnum = Math.floor(Math.pow(numberofcolors, 1 / 3)); + var colorstep = Math.floor(255 / (colorqnum - 1)); + var rndnum = numberofcolors - colorqnum * colorqnum * colorqnum; + for (rcnt = 0; rcnt < colorqnum; rcnt += 1) { + for (gcnt = 0; gcnt < colorqnum; gcnt += 1) { + for (bcnt = 0; bcnt < colorqnum; bcnt += 1) { + palette.push({ r: rcnt * colorstep, + g: gcnt * colorstep, + b: bcnt * colorstep, + a: 255 }); + } + } + } + for (rcnt = 0; rcnt < rndnum; rcnt += 1) { + palette.push({ r: Math.floor(Math.random() * 255), + g: Math.floor(Math.random() * 255), + b: Math.floor(Math.random() * 255), + a: Math.floor(Math.random() * 255) }); + } + } + + return palette; + } + }, { + key: 'layering', + value: function layering(ii) { + var layers = []; + var val = 0; + var ah = ii.array.length; + var aw = ii.array[0].length; + var n1 = void 0; + var n2 = void 0; + var n3 = void 0; + var n4 = void 0; + var n5 = void 0; + var n6 = void 0; + var n7 = void 0; + var n8 = void 0; + var i = void 0; + var j = void 0; + var k = void 0; + for (k = 0; k < ii.palette.length; k += 1) { + layers[k] = []; + for (j = 0; j < ah; j += 1) { + layers[k][j] = []; + for (i = 0; i < aw; i += 1) { + layers[k][j][i] = 0; + } + } + } + for (j = 1; j < ah - 1; j += 1) { + for (i = 1; i < aw - 1; i += 1) { + val = ii.array[j][i]; + + n1 = ii.array[j - 1][i - 1] === val ? 1 : 0; + n2 = ii.array[j - 1][i] === val ? 1 : 0; + n3 = ii.array[j - 1][i + 1] === val ? 1 : 0; + n4 = ii.array[j][i - 1] === val ? 1 : 0; + n5 = ii.array[j][i + 1] === val ? 1 : 0; + n6 = ii.array[j + 1][i - 1] === val ? 1 : 0; + n7 = ii.array[j + 1][i] === val ? 1 : 0; + n8 = ii.array[j + 1][i + 1] === val ? 1 : 0; + + layers[val][j + 1][i + 1] = 1 + n5 * 2 + n8 * 4 + n7 * 8; + if (!n4) { + layers[val][j + 1][i] = 0 + 2 + n7 * 4 + n6 * 8; + } + if (!n2) { + layers[val][j][i + 1] = 0 + n3 * 2 + n5 * 4 + 8; + } + if (!n1) { + layers[val][j][i] = 0 + n2 * 2 + 4 + n4 * 8; + } + } + } + return layers; + } + }, { + key: 'layeringstep', + value: function layeringstep(ii, cnum) { + var layer = []; + var ah = ii.array.length; + var aw = ii.array[0].length; + var i = void 0; + var j = void 0; + for (j = 0; j < ah; j += 1) { + layer[j] = []; + for (i = 0; i < aw; i += 1) { + layer[j][i] = 0; + } + } + for (j = 1; j < ah; j += 1) { + for (i = 1; i < aw; i += 1) { + layer[j][i] = (ii.array[j - 1][i - 1] === cnum ? 1 : 0) + (ii.array[j - 1][i] === cnum ? 2 : 0) + (ii.array[j][i - 1] === cnum ? 8 : 0) + (ii.array[j][i] === cnum ? 4 : 0); + } + } - /** - * Make CSSText - * @param {Object} styleObj - Style info object - * @returns {string} Connected string of style - */ - makeStyleText: function makeStyleText(styleObj) { - var styleStr = ''; + return layer; + } + }, { + key: 'pathscan', + value: function pathscan(arr, pathomit) { + var paths = []; + var pacnt = 0; + var pcnt = 0; + var px = 0; + var py = 0; + var w = arr[0].length; + var h = arr.length; + var dir = 0; + var pathfinished = true; + var holepath = false; + var lookuprow = void 0; + for (var j = 0; j < h; j += 1) { + for (var i = 0; i < w; i += 1) { + if (arr[j][i] === 4 || arr[j][i] === 11) { + px = i; + py = j; + paths[pacnt] = {}; + paths[pacnt].points = []; + paths[pacnt].boundingbox = [px, py, px, py]; + paths[pacnt].holechildren = []; + pathfinished = false; + pcnt = 0; + holepath = arr[j][i] === 11; + dir = 1; + + while (!pathfinished) { + paths[pacnt].points[pcnt] = {}; + paths[pacnt].points[pcnt].x = px - 1; + paths[pacnt].points[pcnt].y = py - 1; + paths[pacnt].points[pcnt].t = arr[py][px]; + + if (px - 1 < paths[pacnt].boundingbox[0]) { + paths[pacnt].boundingbox[0] = px - 1; + } + if (px - 1 > paths[pacnt].boundingbox[2]) { + paths[pacnt].boundingbox[2] = px - 1; + } + if (py - 1 < paths[pacnt].boundingbox[1]) { + paths[pacnt].boundingbox[1] = py - 1; + } + if (py - 1 > paths[pacnt].boundingbox[3]) { + paths[pacnt].boundingbox[3] = py - 1; + } + + lookuprow = this.pathscan_combined_lookup[arr[py][px]][dir]; + arr[py][px] = lookuprow[0];dir = lookuprow[1];px += lookuprow[2];py += lookuprow[3]; + + if (px - 1 === paths[pacnt].points[0].x && py - 1 === paths[pacnt].points[0].y) { + pathfinished = true; + + if (paths[pacnt].points.length < pathomit) { + paths.pop(); + } else { + paths[pacnt].isholepath = !!holepath; + + if (holepath) { + var parentidx = 0, + parentbbox = [-1, -1, w + 1, h + 1]; + for (var parentcnt = 0; parentcnt < pacnt; parentcnt++) { + if (!paths[parentcnt].isholepath && this.boundingboxincludes(paths[parentcnt].boundingbox, paths[pacnt].boundingbox) && this.boundingboxincludes(parentbbox, paths[parentcnt].boundingbox)) { + parentidx = parentcnt; + parentbbox = paths[parentcnt].boundingbox; + } + } + paths[parentidx].holechildren.push(pacnt); + } + pacnt += 1; + } + } + pcnt += 1; + } + } + } + } - (0, _tuiCodeSnippet.forEach)(styleObj, function (value, prop) { - styleStr += prop + ': ' + value + ';'; - }); + return paths; + } + }, { + key: 'boundingboxincludes', + value: function boundingboxincludes(parentbbox, childbbox) { + return parentbbox[0] < childbbox[0] && parentbbox[1] < childbbox[1] && parentbbox[2] > childbbox[2] && parentbbox[3] > childbbox[3]; + } + }, { + key: 'batchpathscan', + value: function batchpathscan(layers, pathomit) { + var bpaths = []; + for (var k in layers) { + if (!layers.hasOwnProperty(k)) { + continue; + } + bpaths[k] = this.pathscan(layers[k], pathomit); + } - return styleStr; - }, + return bpaths; + } + }, { + key: 'internodes', + value: function internodes(paths, options) { + var ins = []; + var palen = 0; + var nextidx = 0; + var nextidx2 = 0; + var previdx = 0; + var previdx2 = 0; + var pacnt = void 0; + var pcnt = void 0; + for (pacnt = 0; pacnt < paths.length; pacnt += 1) { + ins[pacnt] = {}; + ins[pacnt].points = []; + ins[pacnt].boundingbox = paths[pacnt].boundingbox; + ins[pacnt].holechildren = paths[pacnt].holechildren; + ins[pacnt].isholepath = paths[pacnt].isholepath; + palen = paths[pacnt].points.length; + + for (pcnt = 0; pcnt < palen; pcnt += 1) { + nextidx = (pcnt + 1) % palen;nextidx2 = (pcnt + 2) % palen;previdx = (pcnt - 1 + palen) % palen;previdx2 = (pcnt - 2 + palen) % palen; + + if (options.rightangleenhance && this.testrightangle(paths[pacnt], previdx2, previdx, pcnt, nextidx, nextidx2)) { + if (ins[pacnt].points.length > 0) { + ins[pacnt].points[ins[pacnt].points.length - 1].linesegment = this.getdirection(ins[pacnt].points[ins[pacnt].points.length - 1].x, ins[pacnt].points[ins[pacnt].points.length - 1].y, paths[pacnt].points[pcnt].x, paths[pacnt].points[pcnt].y); + } + + ins[pacnt].points.push({ + x: paths[pacnt].points[pcnt].x, + y: paths[pacnt].points[pcnt].y, + linesegment: this.getdirection(paths[pacnt].points[pcnt].x, paths[pacnt].points[pcnt].y, (paths[pacnt].points[pcnt].x + paths[pacnt].points[nextidx].x) / 2, (paths[pacnt].points[pcnt].y + paths[pacnt].points[nextidx].y) / 2) + }); + } + ins[pacnt].points.push({ + x: (paths[pacnt].points[pcnt].x + paths[pacnt].points[nextidx].x) / 2, + y: (paths[pacnt].points[pcnt].y + paths[pacnt].points[nextidx].y) / 2, + linesegment: this.getdirection((paths[pacnt].points[pcnt].x + paths[pacnt].points[nextidx].x) / 2, (paths[pacnt].points[pcnt].y + paths[pacnt].points[nextidx].y) / 2, (paths[pacnt].points[nextidx].x + paths[pacnt].points[nextidx2].x) / 2, (paths[pacnt].points[nextidx].y + paths[pacnt].points[nextidx2].y) / 2) + }); + } + } - /** - * Get object's properties - * @param {Object} obj - object - * @param {Array} keys - keys - * @returns {Object} properties object - */ - getProperties: function getProperties(obj, keys) { - var props = {}; - var length = keys.length; + return ins; + } + }, { + key: 'testrightangle', + value: function testrightangle(path, idx1, idx2, idx3, idx4, idx5) { + return path.points[idx3].x === path.points[idx1].x && path.points[idx3].x === path.points[idx2].x && path.points[idx3].y === path.points[idx4].y && path.points[idx3].y === path.points[idx5].y || path.points[idx3].y === path.points[idx1].y && path.points[idx3].y === path.points[idx2].y && path.points[idx3].x === path.points[idx4].x && path.points[idx3].x === path.points[idx5].x; + } + }, { + key: 'getdirection', + value: function getdirection(x1, y1, x2, y2) { + var val = 8; + if (x1 < x2) { + if (y1 < y2) { + val = 1; + } else if (y1 > y2) { + val = 7; + } else { + val = 0; + } + } else if (x1 > x2) { + if (y1 < y2) { + val = 3; + } else if (y1 > y2) { + val = 5; + } else { + val = 4; + } + } else if (y1 < y2) { + val = 2; + } else if (y1 > y2) { + val = 6; + } else { + val = 8; + } - var i = 0; - var key = void 0; + return val; + } + }, { + key: 'batchinternodes', + value: function batchinternodes(bpaths, options) { + var binternodes = []; + for (var k in bpaths) { + if (!bpaths.hasOwnProperty(k)) { + continue; + } + binternodes[k] = this.internodes(bpaths[k], options); + } - for (i = 0; i < length; i += 1) { - key = keys[i]; - props[key] = obj[key]; + return binternodes; } + }, { + key: 'tracepath', + value: function tracepath(path, ltres, qtres) { + var pcnt = 0; + var segtype1 = void 0; + var segtype2 = void 0; + var seqend = void 0; + var smp = {}; + smp.segments = []; + smp.boundingbox = path.boundingbox; + smp.holechildren = path.holechildren; + smp.isholepath = path.isholepath; + + while (pcnt < path.points.length) { + segtype1 = path.points[pcnt].linesegment; + segtype2 = -1; + seqend = pcnt + 1; + while ((path.points[seqend].linesegment === segtype1 || path.points[seqend].linesegment === segtype2 || segtype2 === -1) && seqend < path.points.length - 1) { + if (path.points[seqend].linesegment !== segtype1 && segtype2 === -1) { + segtype2 = path.points[seqend].linesegment; + } + seqend += 1; + } + if (seqend === path.points.length - 1) { + seqend = 0; + } - return props; - }, + smp.segments = smp.segments.concat(this.fitseq(path, ltres, qtres, pcnt, seqend)); + if (seqend > 0) { + pcnt = seqend; + } else { + pcnt = path.points.length; + } + } - /** - * send hostname - */ - sendHostName: function sendHostName() { - var _location = location, - hostname = _location.hostname; + return smp; + } + }, { + key: 'fitseq', + value: function fitseq(path, ltres, qtres, seqstart, seqend) { + if (seqend > path.points.length || seqend < 0) { + return []; + } + var errorpoint = seqstart, + errorval = 0, + curvepass = true, + px = void 0, + py = void 0, + dist2 = void 0; + var tl = seqend - seqstart;if (tl < 0) { + tl += path.points.length; + } + var vx = (path.points[seqend].x - path.points[seqstart].x) / tl, + vy = (path.points[seqend].y - path.points[seqstart].y) / tl; + var pcnt = (seqstart + 1) % path.points.length, + pl = void 0; + while (pcnt != seqend) { + pl = pcnt - seqstart;if (pl < 0) { + pl += path.points.length; + } + px = path.points[seqstart].x + vx * pl;py = path.points[seqstart].y + vy * pl; + dist2 = (path.points[pcnt].x - px) * (path.points[pcnt].x - px) + (path.points[pcnt].y - py) * (path.points[pcnt].y - py); + if (dist2 > ltres) { + curvepass = false; + } + if (dist2 > errorval) { + errorpoint = pcnt;errorval = dist2; + } + pcnt = (pcnt + 1) % path.points.length; + } + if (curvepass) { + return [{ type: 'L', + x1: path.points[seqstart].x, + y1: path.points[seqstart].y, + x2: path.points[seqend].x, + y2: path.points[seqend].y }]; + } + var fitpoint = errorpoint;curvepass = true;errorval = 0; + var t = (fitpoint - seqstart) / tl, + t1 = (1 - t) * (1 - t), + t2 = 2 * (1 - t) * t, + t3 = t * t; + var cpx = (t1 * path.points[seqstart].x + t3 * path.points[seqend].x - path.points[fitpoint].x) / -t2, + cpy = (t1 * path.points[seqstart].y + t3 * path.points[seqend].y - path.points[fitpoint].y) / -t2; + pcnt = seqstart + 1; + while (pcnt != seqend) { + t = (pcnt - seqstart) / tl;t1 = (1 - t) * (1 - t);t2 = 2 * (1 - t) * t;t3 = t * t; + px = t1 * path.points[seqstart].x + t2 * cpx + t3 * path.points[seqend].x; + py = t1 * path.points[seqstart].y + t2 * cpy + t3 * path.points[seqend].y; + dist2 = (path.points[pcnt].x - px) * (path.points[pcnt].x - px) + (path.points[pcnt].y - py) * (path.points[pcnt].y - py); + if (dist2 > qtres) { + curvepass = false; + } + if (dist2 > errorval) { + errorpoint = pcnt;errorval = dist2; + } + pcnt = (pcnt + 1) % path.points.length; + } + if (curvepass) { + return [{ type: 'Q', + x1: path.points[seqstart].x, + y1: path.points[seqstart].y, + x2: cpx, + y2: cpy, + x3: path.points[seqend].x, + y3: path.points[seqend].y }]; + } + var splitpoint = fitpoint; - if (hostnameSent) { - return; + return this.fitseq(path, ltres, qtres, seqstart, splitpoint).concat(this.fitseq(path, ltres, qtres, splitpoint, seqend)); } - hostnameSent = true; + }, { + key: 'batchtracepaths', + value: function batchtracepaths(internodepaths, ltres, qtres) { + var btracedpaths = []; + for (var k in internodepaths) { + if (!internodepaths.hasOwnProperty(k)) { + continue; + } + btracedpaths.push(this.tracepath(internodepaths[k], ltres, qtres)); + } - (0, _tuiCodeSnippet.imagePing)('https://www.google-analytics.com/collect', { - v: 1, - t: 'event', - tid: 'UA-115377265-9', - cid: hostname, - dp: hostname, - dh: 'image-editor' - }); - } - }; + return btracedpaths; + } + }, { + key: 'batchtracelayers', + value: function batchtracelayers(binternodes, ltres, qtres) { + var btbis = []; + for (var k in binternodes) { + if (!binternodes.hasOwnProperty(k)) { + continue; + } + btbis[k] = this.batchtracepaths(binternodes[k], ltres, qtres); + } -/***/ }), -/* 72 */ -/***/ (function(module, exports, __webpack_require__) { + return btbis; + } + }, { + key: 'roundtodec', + value: function roundtodec(val, places) { + return Number(val.toFixed(places)); + } + }, { + key: 'svgpathstring', + value: function svgpathstring(tracedata, lnum, pathnum, options) { + var layer = tracedata.layers[lnum], + smp = layer[pathnum], + str = '', + pcnt = void 0; + if (options.linefilter && smp.segments.length < 3) { + return str; + } + str = ''; + if (options.lcpr || options.qcpr) { + for (pcnt = 0; pcnt < smp.segments.length; pcnt++) { + if (smp.segments[pcnt].hasOwnProperty('x3') && options.qcpr) { + str += ''; + str += ''; + str += ''; + str += ''; + } + if (!smp.segments[pcnt].hasOwnProperty('x3') && options.lcpr) { + str += ''; + } + } - var _util = __webpack_require__(71); + for (var hcnt = 0; hcnt < smp.holechildren.length; hcnt++) { + var hsmp = layer[smp.holechildren[hcnt]]; + for (pcnt = 0; pcnt < hsmp.segments.length; pcnt++) { + if (hsmp.segments[pcnt].hasOwnProperty('x3') && options.qcpr) { + str += ''; + str += ''; + str += ''; + str += ''; + } + if (!hsmp.segments[pcnt].hasOwnProperty('x3') && options.lcpr) { + str += ''; + } + } + } + } - var _util2 = _interopRequireDefault(_util); + return str; + } + }, { + key: 'getsvgstring', + value: function getsvgstring(tracedata, options) { + options = this.checkoptions(options); + var w = tracedata.width * options.scale; + var h = tracedata.height * options.scale; + + var svgstr = ''; + for (var lcnt = 0; lcnt < tracedata.layers.length; lcnt += 1) { + for (var pcnt = 0; pcnt < tracedata.layers[lcnt].length; pcnt += 1) { + if (!tracedata.layers[lcnt][pcnt].isholepath) { + svgstr += this.svgpathstring(tracedata, lcnt, pcnt, options); + } + } + } + svgstr += ''; - function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + return svgstr; + } + }, { + key: 'compareNumbers', + value: function compareNumbers(a, b) { + return a - b; + } + }, { + key: 'torgbastr', + value: function torgbastr(c) { + return 'rgba(' + c.r + ',' + c.g + ',' + c.b + ',' + c.a + ')'; + } + }, { + key: 'tosvgcolorstr', + value: function tosvgcolorstr(c, options) { + return 'fill="rgb(' + c.r + ',' + c.g + ',' + c.b + ')" stroke="rgb(' + c.r + ',' + c.g + ',' + c.b + ')" stroke-width="' + options.strokewidth + '" opacity="' + c.a / 255.0 + '" '; + } + }, { + key: 'appendSVGString', + value: function appendSVGString(svgstr, parentid) { + var div = void 0; + if (parentid) { + div = document.getElementById(parentid); + if (!div) { + div = document.createElement('div'); + div.id = parentid; + document.body.appendChild(div); + } + } else { + div = document.createElement('div'); + document.body.appendChild(div); + } + div.innerHTML += svgstr; + } + }, { + key: 'blur', + value: function blur(imgd, radius, delta) { + var i = void 0, + j = void 0, + k = void 0, + d = void 0, + idx = void 0, + racc = void 0, + gacc = void 0, + bacc = void 0, + aacc = void 0, + wacc = void 0; + var imgd2 = { width: imgd.width, + height: imgd.height, + data: [] }; + radius = Math.floor(radius);if (radius < 1) { + return imgd; + }if (radius > 5) { + radius = 5; + }delta = Math.abs(delta);if (delta > 1024) { + delta = 1024; + } + var thisgk = this.gks[radius - 1]; + for (j = 0; j < imgd.height; j++) { + for (i = 0; i < imgd.width; i++) { + racc = 0;gacc = 0;bacc = 0;aacc = 0;wacc = 0; + + for (k = -radius; k < radius + 1; k++) { + if (i + k > 0 && i + k < imgd.width) { + idx = (j * imgd.width + i + k) * 4; + racc += imgd.data[idx] * thisgk[k + radius]; + gacc += imgd.data[idx + 1] * thisgk[k + radius]; + bacc += imgd.data[idx + 2] * thisgk[k + radius]; + aacc += imgd.data[idx + 3] * thisgk[k + radius]; + wacc += thisgk[k + radius]; + } + } - module.exports = { - /** - * Component names - * @type {Object.} - */ - componentNames: _util2.default.keyMirror('IMAGE_LOADER', 'CROPPER', 'FLIP', 'ROTATION', 'FREE_DRAWING', 'LINE', 'TEXT', 'ICON', 'FILTER', 'SHAPE'), + idx = (j * imgd.width + i) * 4; + imgd2.data[idx] = Math.floor(racc / wacc); + imgd2.data[idx + 1] = Math.floor(gacc / wacc); + imgd2.data[idx + 2] = Math.floor(bacc / wacc); + imgd2.data[idx + 3] = Math.floor(aacc / wacc); + } + } + var himgd = new Uint8ClampedArray(imgd2.data); + for (j = 0; j < imgd.height; j++) { + for (i = 0; i < imgd.width; i++) { + racc = 0;gacc = 0;bacc = 0;aacc = 0;wacc = 0; + + for (k = -radius; k < radius + 1; k++) { + if (j + k > 0 && j + k < imgd.height) { + idx = ((j + k) * imgd.width + i) * 4; + racc += himgd[idx] * thisgk[k + radius]; + gacc += himgd[idx + 1] * thisgk[k + radius]; + bacc += himgd[idx + 2] * thisgk[k + radius]; + aacc += himgd[idx + 3] * thisgk[k + radius]; + wacc += thisgk[k + radius]; + } + } - /** - * Command names - * @type {Object.} - */ - commandNames: { - 'CLEAR_OBJECTS': 'clearObjects', - 'LOAD_IMAGE': 'loadImage', - 'FLIP_IMAGE': 'flip', - 'ROTATE_IMAGE': 'rotate', - 'ADD_OBJECT': 'addObject', - 'REMOVE_OBJECT': 'removeObject', - 'APPLY_FILTER': 'applyFilter', - 'REMOVE_FILTER': 'removeFilter', - 'ADD_ICON': 'addIcon', - 'CHANGE_ICON_COLOR': 'changeIconColor', - 'ADD_SHAPE': 'addShape', - 'CHANGE_SHAPE': 'changeShape', - 'ADD_TEXT': 'addText', - 'CHANGE_TEXT': 'changeText', - 'CHANGE_TEXT_STYLE': 'changeTextStyle', - 'ADD_IMAGE_OBJECT': 'addImageObject', - 'RESIZE_CANVAS_DIMENSION': 'resizeCanvasDimension', - 'SET_OBJECT_PROPERTIES': 'setObjectProperties', - 'SET_OBJECT_POSITION': 'setObjectPosition' - }, + idx = (j * imgd.width + i) * 4; + imgd2.data[idx] = Math.floor(racc / wacc); + imgd2.data[idx + 1] = Math.floor(gacc / wacc); + imgd2.data[idx + 2] = Math.floor(bacc / wacc); + imgd2.data[idx + 3] = Math.floor(aacc / wacc); + } + } + for (j = 0; j < imgd.height; j++) { + for (i = 0; i < imgd.width; i++) { + idx = (j * imgd.width + i) * 4; - /** - * Event names - * @type {Object.} - */ - eventNames: { - OBJECT_ACTIVATED: 'objectActivated', - OBJECT_MOVED: 'objectMoved', - OBJECT_SCALED: 'objectScaled', - TEXT_EDITING: 'textEditing', - TEXT_CHANGED: 'textChanged', - ADD_TEXT: 'addText', - ADD_OBJECT: 'addObject', - MOUSE_DOWN: 'mousedown', - // UNDO/REDO Events - REDO_STACK_CHANGED: 'redoStackChanged', - UNDO_STACK_CHANGED: 'undoStackChanged' - }, + d = Math.abs(imgd2.data[idx] - imgd.data[idx]) + Math.abs(imgd2.data[idx + 1] - imgd.data[idx + 1]) + Math.abs(imgd2.data[idx + 2] - imgd.data[idx + 2]) + Math.abs(imgd2.data[idx + 3] - imgd.data[idx + 3]); - /** - * Editor states - * @type {Object.} - */ - drawingModes: _util2.default.keyMirror('NORMAL', 'CROPPER', 'FREE_DRAWING', 'LINE_DRAWING', 'TEXT', 'SHAPE'), + if (d > delta) { + imgd2.data[idx] = imgd.data[idx]; + imgd2.data[idx + 1] = imgd.data[idx + 1]; + imgd2.data[idx + 2] = imgd.data[idx + 2]; + imgd2.data[idx + 3] = imgd.data[idx + 3]; + } + } + } - /** - * Shortcut key values - * @type {Object.} - */ - keyCodes: { - Z: 90, - Y: 89, - SHIFT: 16, - BACKSPACE: 8, - DEL: 46 - }, + return imgd2; + } + }, { + key: 'loadImage', + value: function loadImage(url, callback, options) { + var img = new Image(); + if (options && options.corsenabled) { + img.crossOrigin = 'Anonymous'; + } + img.src = url; + img.onload = function () { + var canvas = document.createElement('canvas'); + canvas.width = img.width; + canvas.height = img.height; + var context = canvas.getContext('2d'); + context.drawImage(img, 0, 0); + callback(canvas); + }; + } + }, { + key: 'getImgdata', + value: function getImgdata(canvas) { + var context = canvas.getContext('2d'); - /** - * Fabric object options - * @type {Object.} - */ - fObjectOptions: { - SELECTION_STYLE: { - borderColor: 'red', - cornerColor: 'green', - cornerSize: 10, - originX: 'center', - originY: 'center', - transparentCorners: false + return context.getImageData(0, 0, canvas.width, canvas.height); + } + }, { + key: 'drawLayers', + value: function drawLayers(layers, palette, scale, parentid) { + scale = scale || 1; + var w = void 0, + h = void 0, + i = void 0, + j = void 0, + k = void 0; + var div = void 0; + if (parentid) { + div = document.getElementById(parentid); + if (!div) { + div = document.createElement('div'); + div.id = parentid; + document.body.appendChild(div); + } + } else { + div = document.createElement('div'); + document.body.appendChild(div); + } + for (k in layers) { + if (!layers.hasOwnProperty(k)) { + continue; + } + + w = layers[k][0].length; + h = layers[k].length; + + var canvas = document.createElement('canvas'); + canvas.width = w * scale; + canvas.height = h * scale; + var context = canvas.getContext('2d'); + + for (j = 0; j < h; j += 1) { + for (i = 0; i < w; i += 1) { + context.fillStyle = this.torgbastr(palette[layers[k][j][i] % palette.length]); + context.fillRect(i * scale, j * scale, scale, scale); + } + } + + div.appendChild(canvas); + } } - }, + }]); - /** - * Promise reject messages - * @type {Object.} - */ - rejectMessages: { - flip: 'The flipX and flipY setting values are not changed.', - rotation: 'The current angle is same the old angle.', - loadImage: 'The background image is empty.', - isLock: 'The executing command state is locked.', - undo: 'The promise of undo command is reject.', - redo: 'The promise of redo command is reject.', - invalidDrawingMode: 'This operation is not supported in the drawing mode', - invalidParameters: 'Invalid parameters', - noActiveObject: 'There is no active object.', - unsupportedType: 'Unsupported object type', - noObject: 'The object is not in canvas.', - addedObject: 'The object is already added.' - } - }; /** - * @author NHN Ent. FE Development Team - * @fileoverview Constants - */ + return ImageTracer; + }(); + + exports.default = ImageTracer; /***/ }), -/* 73 */ +/* 104 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -3908,7 +13397,7 @@ return /******/ (function(modules) { // webpackBootstrap */ - var _tuiCodeSnippet = __webpack_require__(2); + var _tuiCodeSnippet = __webpack_require__(3); var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); @@ -3916,75 +13405,75 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _fabric = __webpack_require__(74); + var _fabric = __webpack_require__(105); var _fabric2 = _interopRequireDefault(_fabric); - var _imageLoader = __webpack_require__(75); + var _imageLoader = __webpack_require__(106); var _imageLoader2 = _interopRequireDefault(_imageLoader); - var _cropper = __webpack_require__(77); + var _cropper = __webpack_require__(108); var _cropper2 = _interopRequireDefault(_cropper); - var _flip = __webpack_require__(79); + var _flip = __webpack_require__(110); var _flip2 = _interopRequireDefault(_flip); - var _rotation = __webpack_require__(80); + var _rotation = __webpack_require__(111); var _rotation2 = _interopRequireDefault(_rotation); - var _freeDrawing = __webpack_require__(81); + var _freeDrawing = __webpack_require__(112); var _freeDrawing2 = _interopRequireDefault(_freeDrawing); - var _line = __webpack_require__(82); + var _line = __webpack_require__(113); var _line2 = _interopRequireDefault(_line); - var _text = __webpack_require__(83); + var _text = __webpack_require__(114); var _text2 = _interopRequireDefault(_text); - var _icon = __webpack_require__(84); + var _icon = __webpack_require__(115); var _icon2 = _interopRequireDefault(_icon); - var _filter = __webpack_require__(85); + var _filter = __webpack_require__(116); var _filter2 = _interopRequireDefault(_filter); - var _shape = __webpack_require__(91); + var _shape = __webpack_require__(122); var _shape2 = _interopRequireDefault(_shape); - var _cropper3 = __webpack_require__(93); + var _cropper3 = __webpack_require__(124); var _cropper4 = _interopRequireDefault(_cropper3); - var _freeDrawing3 = __webpack_require__(95); + var _freeDrawing3 = __webpack_require__(126); var _freeDrawing4 = _interopRequireDefault(_freeDrawing3); - var _lineDrawing = __webpack_require__(96); + var _lineDrawing = __webpack_require__(127); var _lineDrawing2 = _interopRequireDefault(_lineDrawing); - var _shape3 = __webpack_require__(97); + var _shape3 = __webpack_require__(128); var _shape4 = _interopRequireDefault(_shape3); - var _text3 = __webpack_require__(98); + var _text3 = __webpack_require__(129); var _text4 = _interopRequireDefault(_text3); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); - var _util = __webpack_require__(71); + var _util = __webpack_require__(72); var _util2 = _interopRequireDefault(_util); @@ -3994,6 +13483,7 @@ return /******/ (function(modules) { // webpackBootstrap var components = _consts2.default.componentNames; var events = _consts2.default.eventNames; + var drawingModes = _consts2.default.drawingModes, fObjectOptions = _consts2.default.fObjectOptions; var extend = _tuiCodeSnippet2.default.extend, @@ -4022,11 +13512,21 @@ return /******/ (function(modules) { // webpackBootstrap * @param {Object} [option] - Canvas max width & height of css * @param {number} option.cssMaxWidth - Canvas css-max-width * @param {number} option.cssMaxHeight - Canvas css-max-height + * @param {boolean} option.useItext - Use IText in text mode + * @param {boolean} option.useDragAddIcon - Use dragable add in icon mode * @ignore */ var Graphics = function () { - function Graphics(element, cssMaxWidth, cssMaxHeight) { + function Graphics(element) { + var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}, + cssMaxWidth = _ref.cssMaxWidth, + cssMaxHeight = _ref.cssMaxHeight, + _ref$useItext = _ref.useItext, + useItext = _ref$useItext === undefined ? false : _ref$useItext, + _ref$useDragAddIcon = _ref.useDragAddIcon, + useDragAddIcon = _ref$useDragAddIcon === undefined ? false : _ref$useDragAddIcon; + _classCallCheck(this, Graphics); /** @@ -4047,6 +13547,24 @@ return /******/ (function(modules) { // webpackBootstrap */ this.cssMaxHeight = cssMaxHeight || DEFAULT_CSS_MAX_HEIGHT; + /** + * Use Itext mode for text component + * @type {boolean} + */ + this.useItext = useItext; + + /** + * Use add drag icon mode for icon component + * @type {boolean} + */ + this.useDragAddIcon = useDragAddIcon; + + /** + * cropper Selection Style + * @type {Object} + */ + this.cropSelectionStyle = {}; + /** * Image name * @type {string} @@ -4100,7 +13618,9 @@ return /******/ (function(modules) { // webpackBootstrap onObjectMoved: this._onObjectMoved.bind(this), onObjectScaled: this._onObjectScaled.bind(this), onObjectSelected: this._onObjectSelected.bind(this), - onPathCreated: this._onPathCreated.bind(this) + onPathCreated: this._onPathCreated.bind(this), + onSelectionCleared: this._onSelectionCleared.bind(this), + onSelectionCreated: this._onSelectionCreated.bind(this) }; this._setCanvasElement(element); @@ -4170,6 +13690,7 @@ return /******/ (function(modules) { // webpackBootstrap (_canvas = this._canvas).add.apply(_canvas, theArgs); } + /** * Removes the object or group * @param {Object} target - graphics object or group @@ -4296,6 +13817,17 @@ return /******/ (function(modules) { // webpackBootstrap return this._canvas.getActiveObject(); } + /** + * Gets an active group object + * @returns {Object} active group object instance + */ + + }, { + key: 'getActiveGroupObject', + value: function getActiveGroupObject() { + return this._canvas.getActiveGroup(); + } + /** * Activates an object or group * @param {Object} target - target object or group @@ -4307,6 +13839,17 @@ return /******/ (function(modules) { // webpackBootstrap this._canvas.setActiveObject(target); } + /** + * Set Crop selection style + * @param {Object} style - Selection styles + */ + + }, { + key: 'setCropSelectionStyle', + value: function setCropSelectionStyle(style) { + this.cropSelectionStyle = style; + } + /** * Get component * @param {string} name - Component name @@ -4358,6 +13901,7 @@ return /******/ (function(modules) { // webpackBootstrap return !!drawingModeInstance; } + /** * Stop the current drawing mode and back to the 'NORMAL' mode */ @@ -4651,6 +14195,19 @@ return /******/ (function(modules) { // webpackBootstrap this.getComponent(components.ICON).registerPaths(pathInfos); } + /** + * Change cursor style + * @param {string} cursorType - cursor type + */ + + }, { + key: 'changeCursor', + value: function changeCursor(cursorType) { + var canvas = this.getCanvas(); + canvas.defaultCursor = cursorType; + canvas.renderAll(); + } + /** * Whether it has the filter or not * @param {string} type - Filter type @@ -4978,7 +14535,9 @@ return /******/ (function(modules) { // webpackBootstrap 'object:moving': handler.onObjectMoved, 'object:scaling': handler.onObjectScaled, 'object:selected': handler.onObjectSelected, - 'path:created': handler.onPathCreated + 'path:created': handler.onPathCreated, + 'selection:cleared': handler.onSelectionCleared, + 'selection:created': handler.onSelectionCreated }); } @@ -5090,6 +14649,55 @@ return /******/ (function(modules) { // webpackBootstrap this.fire(events.ADD_OBJECT, params); } + /** + * "selction:cleared" canvas event handler + * @private + */ + + }, { + key: '_onSelectionCleared', + value: function _onSelectionCleared() { + this.fire(events.SELECTION_CLEARED); + } + + /** + * "selction:created" canvas event handler + * @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event + * @private + */ + + }, { + key: '_onSelectionCreated', + value: function _onSelectionCreated(fEvent) { + this.fire(events.SELECTION_CREATED, fEvent.target); + } + + /** + * Canvas discard selection all + */ + + }, { + key: 'discardSelection', + value: function discardSelection() { + this._canvas.discardActiveGroup(); + this._canvas.discardActiveObject(); + this._canvas.renderAll(); + } + + /** + * Canvas Selectable status change + * @param {boolean} selectable - expect status + */ + + }, { + key: 'changeSelectableAll', + value: function changeSelectableAll(selectable) { + this._canvas.forEachObject(function (obj) { + obj.selectable = selectable; + obj.hoverCursor = selectable ? 'move' : 'crosshair'; + }); + } + /** * Return object's properties * @param {fabric.Object} obj - fabric object @@ -5107,7 +14715,7 @@ return /******/ (function(modules) { // webpackBootstrap extend(props, _util2.default.getProperties(obj, predefinedKeys)); - if (obj.type === 'text') { + if (['i-text', 'text'].indexOf(obj.type) > -1) { extend(props, this._createTextProperties(obj, props)); } @@ -5165,13 +14773,13 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Graphics; /***/ }), -/* 74 */ +/* 105 */ /***/ (function(module, exports) { - module.exports = __WEBPACK_EXTERNAL_MODULE_74__; + module.exports = __WEBPACK_EXTERNAL_MODULE_105__; /***/ }), -/* 75 */ +/* 106 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -5182,11 +14790,11 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _component = __webpack_require__(76); + var _component = __webpack_require__(107); var _component2 = _interopRequireDefault(_component); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -5303,7 +14911,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = ImageLoader; /***/ }), -/* 76 */ +/* 107 */ /***/ (function(module, exports) { "use strict"; @@ -5489,28 +15097,28 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Component; /***/ }), -/* 77 */ +/* 108 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _fabric = __webpack_require__(74); + var _fabric = __webpack_require__(105); var _fabric2 = _interopRequireDefault(_fabric); - var _component = __webpack_require__(76); + var _component = __webpack_require__(107); var _component2 = _interopRequireDefault(_component); - var _cropzone = __webpack_require__(78); + var _cropzone = __webpack_require__(109); var _cropzone2 = _interopRequireDefault(_cropzone); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); - var _util = __webpack_require__(71); + var _util = __webpack_require__(72); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } @@ -5597,10 +15205,12 @@ return /******/ (function(modules) { // webpackBootstrap return; } var canvas = this.getCanvas(); + canvas.forEachObject(function (obj) { // {@link http://fabricjs.com/docs/fabric.Object.html#evented} obj.evented = false; }); + this._cropzone = new _cropzone2.default({ left: -10, top: -10, @@ -5614,7 +15224,8 @@ return /******/ (function(modules) { // webpackBootstrap hasBorders: false, lockScalingFlip: true, lockRotation: true - }); + }, this.graphics.cropSelectionStyle); + canvas.deactivateAll(); canvas.add(this._cropzone); canvas.on('mouse:down', this._listeners.mousedown); @@ -5860,20 +15471,20 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Cropper; /***/ }), -/* 78 */ +/* 109 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _tuiCodeSnippet = __webpack_require__(2); + var _tuiCodeSnippet = __webpack_require__(3); var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); - var _fabric = __webpack_require__(74); + var _fabric = __webpack_require__(105); var _fabric2 = _interopRequireDefault(_fabric); - var _util = __webpack_require__(71); + var _util = __webpack_require__(72); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } @@ -5904,9 +15515,14 @@ return /******/ (function(modules) { // webpackBootstrap * @param {Object} options Options object * @override */ - initialize: function initialize(options) { + initialize: function initialize(options, extendsOptions) { + options = _tuiCodeSnippet2.default.extend(options, extendsOptions); options.type = 'cropzone'; + this.callSuper('initialize', options); + + this.options = options; + this.on({ 'moving': this._onMoving, 'scaling': this._onScaling @@ -5937,11 +15553,20 @@ return /******/ (function(modules) { // webpackBootstrap // Render outer rect this._fillOuterRect(ctx, 'rgba(0, 0, 0, 0.55)'); - // Black dash line - this._strokeBorder(ctx, 'rgb(0, 0, 0)', cropzoneDashLineWidth); + if (this.options.lineWidth) { + this._fillInnerRect(ctx); + } else { + // Black dash line + this._strokeBorder(ctx, 'rgb(0, 0, 0)', { + lineDashWidth: cropzoneDashLineWidth + }); - // White dash line - this._strokeBorder(ctx, 'rgb(255, 255, 255)', cropzoneDashLineWidth, cropzoneDashLineOffset); + // White dash line + this._strokeBorder(ctx, 'rgb(255, 255, 255)', { + lineDashWidth: cropzoneDashLineWidth, + lineDashOffset: cropzoneDashLineOffset + }); + } // Reset scale ctx.scale(1 / originalScaleX, 1 / originalScaleY); @@ -5987,7 +15612,7 @@ return /******/ (function(modules) { // webpackBootstrap ctx.moveTo(x[0] - 1, y[0] - 1); ctx.lineTo(x[3] + 1, y[0] - 1); ctx.lineTo(x[3] + 1, y[3] + 1); - ctx.lineTo(x[0] - 1, y[3] - 1); + ctx.lineTo(x[0] - 1, y[3] + 1); ctx.lineTo(x[0] - 1, y[0] - 1); ctx.closePath(); @@ -6004,6 +15629,60 @@ return /******/ (function(modules) { // webpackBootstrap }, + /** + * Draw Inner grid line + * @param {CanvasRenderingContext2D} ctx - Context + * @private + */ + _fillInnerRect: function _fillInnerRect(ctx) { + var _getCoordinates2 = this._getCoordinates(ctx), + outerX = _getCoordinates2.x, + outerY = _getCoordinates2.y; + + var x = this._caculateInnerPosition(outerX, (outerX[2] - outerX[1]) / 3); + var y = this._caculateInnerPosition(outerY, (outerY[2] - outerY[1]) / 3); + + ctx.save(); + ctx.strokeStyle = 'rgba(255, 255, 255, 0.7)'; + ctx.lineWidth = this.options.lineWidth; + ctx.beginPath(); + + ctx.moveTo(x[0], y[1]); + ctx.lineTo(x[3], y[1]); + + ctx.moveTo(x[0], y[2]); + ctx.lineTo(x[3], y[2]); + + ctx.moveTo(x[1], y[0]); + ctx.lineTo(x[1], y[3]); + + ctx.moveTo(x[2], y[0]); + ctx.lineTo(x[2], y[3]); + ctx.stroke(); + ctx.closePath(); + + ctx.restore(); + }, + + + /** + * Calculate Inner Position + * @param {Array} outer - outer position + * @param {number} size - interval for calcaulate + * @returns {Array} - inner position + * @private + */ + _caculateInnerPosition: function _caculateInnerPosition(outer, size) { + var position = []; + position[0] = outer[1]; + position[1] = outer[1] + size; + position[2] = outer[1] + size * 2; + position[3] = outer[2]; + + return position; + }, + + /** * Get coordinates * @param {CanvasRenderingContext2D} ctx - Context @@ -6042,18 +15721,26 @@ return /******/ (function(modules) { // webpackBootstrap * @param {number} [lineDashOffset] - Dash offset * @private */ - _strokeBorder: function _strokeBorder(ctx, strokeStyle, lineDashWidth, lineDashOffset) { + _strokeBorder: function _strokeBorder(ctx, strokeStyle, _ref) { + var lineDashWidth = _ref.lineDashWidth, + lineDashOffset = _ref.lineDashOffset, + lineWidth = _ref.lineWidth; + var halfWidth = this.getWidth() / 2, halfHeight = this.getHeight() / 2; ctx.save(); ctx.strokeStyle = strokeStyle; + if (ctx.setLineDash) { ctx.setLineDash([lineDashWidth, lineDashWidth]); } if (lineDashOffset) { ctx.lineDashOffset = lineDashOffset; } + if (lineWidth) { + ctx.lineWidth = lineWidth; + } ctx.beginPath(); ctx.moveTo(-halfWidth, -halfHeight); @@ -6246,14 +15933,14 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Cropzone; /***/ }), -/* 79 */ +/* 110 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _tuiCodeSnippet = __webpack_require__(2); + var _tuiCodeSnippet = __webpack_require__(3); var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); @@ -6261,11 +15948,11 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _component = __webpack_require__(76); + var _component = __webpack_require__(107); var _component2 = _interopRequireDefault(_component); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -6455,14 +16142,14 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Flip; /***/ }), -/* 80 */ +/* 111 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _fabric = __webpack_require__(74); + var _fabric = __webpack_require__(105); var _fabric2 = _interopRequireDefault(_fabric); @@ -6470,11 +16157,11 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _component = __webpack_require__(76); + var _component = __webpack_require__(107); var _component2 = _interopRequireDefault(_component); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -6602,22 +16289,22 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Rotation; /***/ }), -/* 81 */ +/* 112 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _fabric = __webpack_require__(74); + var _fabric = __webpack_require__(105); var _fabric2 = _interopRequireDefault(_fabric); - var _component = __webpack_require__(76); + var _component = __webpack_require__(107); var _component2 = _interopRequireDefault(_component); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -6715,22 +16402,22 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = FreeDrawing; /***/ }), -/* 82 */ +/* 113 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _fabric = __webpack_require__(74); + var _fabric = __webpack_require__(105); var _fabric2 = _interopRequireDefault(_fabric); - var _component = __webpack_require__(76); + var _component = __webpack_require__(107); var _component2 = _interopRequireDefault(_component); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -6939,18 +16626,18 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Line; /***/ }), -/* 83 */ +/* 114 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _fabric = __webpack_require__(74); + var _fabric = __webpack_require__(105); var _fabric2 = _interopRequireDefault(_fabric); - var _tuiCodeSnippet = __webpack_require__(2); + var _tuiCodeSnippet = __webpack_require__(3); var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); @@ -6958,15 +16645,15 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _component = __webpack_require__(76); + var _component = __webpack_require__(107); var _component2 = _interopRequireDefault(_component); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); - var _util = __webpack_require__(71); + var _util = __webpack_require__(72); var _util2 = _interopRequireDefault(_util); @@ -7097,6 +16784,12 @@ return /******/ (function(modules) { // webpackBootstrap * @type {boolean} */ _this.isPrevEditing = false; + + /** + * use itext + * @type {boolean} + */ + _this.useItext = graphics.useItext; return _this; } @@ -7116,10 +16809,24 @@ return /******/ (function(modules) { // webpackBootstrap 'mouse:down': this._listeners.mousedown, 'object:selected': this._listeners.select, 'before:selection:cleared': this._listeners.selectClear, - 'object:scaling': this._listeners.scaling + 'object:scaling': this._listeners.scaling, + 'text:editing': this._listeners.modify }); - this._createTextarea(); + if (this.useItext) { + canvas.forEachObject(function (obj) { + if (obj.type === 'i-text') { + obj.set({ + left: obj.left - obj.width / 2, + top: obj.top - obj.height / 2, + originX: 'left', + originY: 'top' + }); + } + }); + } else { + this._createTextarea(); + } this.setCanvasRatio(); } @@ -7135,15 +16842,34 @@ return /******/ (function(modules) { // webpackBootstrap canvas.selection = true; canvas.defaultCursor = 'default'; - canvas.deactivateAllWithDispatch(); // action for undo stack + + if (this.useItext) { + canvas.forEachObject(function (obj) { + if (obj.type === 'i-text') { + if (obj.text === '') { + obj.remove(); + } else { + obj.set({ + left: obj.left + obj.width / 2, + top: obj.top + obj.height / 2, + originX: 'center', + originY: 'center' + }); + } + } + }); + } else { + canvas.deactivateAllWithDispatch(); + this._removeTextarea(); + } + canvas.off({ 'mouse:down': this._listeners.mousedown, 'object:selected': this._listeners.select, 'before:selection:cleared': this._listeners.selectClear, - 'object:scaling': this._listeners.scaling + 'object:scaling': this._listeners.scaling, + 'text:editing': this._listeners.modify }); - - this._removeTextarea(); } /** @@ -7169,16 +16895,27 @@ return /******/ (function(modules) { // webpackBootstrap return new _promise2.default(function (resolve) { var canvas = _this2.getCanvas(); + var newText = null; + var selectionStyle = _consts2.default.fObjectOptions.SELECTION_STYLE; var styles = _this2._defaultStyles; _this2._setInitPos(options.position); if (options.styles) { - styles = _tuiCodeSnippet2.default.extend(options.styles, styles); + styles = _tuiCodeSnippet2.default.extend(styles, options.styles); + } + + if (_this2.useItext) { + newText = new _fabric2.default.IText(text, styles); + selectionStyle = _tuiCodeSnippet2.default.extend({}, selectionStyle, { + originX: 'left', + originY: 'top' + }); + } else { + newText = new _fabric2.default.Text(text, styles); } - var newText = new _fabric2.default.Text(text, styles); - newText.set(_consts2.default.fObjectOptions.SELECTION_STYLE); + newText.set(selectionStyle); newText.on({ mouseup: _this2._onFabricMouseUp.bind(_this2) }); @@ -7548,6 +17285,7 @@ return /******/ (function(modules) { // webpackBootstrap key: '_onFabricMouseDown', value: function _onFabricMouseDown(fEvent) { var obj = fEvent.target; + if (obj && !obj.isType('text')) { return; } @@ -7600,7 +17338,9 @@ return /******/ (function(modules) { // webpackBootstrap var newClickTime = new Date().getTime(); if (this._isDoubleClick(newClickTime)) { - this._changeToEditingMode(fEvent.target); + if (!this.useItext) { + this._changeToEditingMode(fEvent.target); + } this.fire(events.TEXT_EDITING); // fire editing text event } @@ -7672,18 +17412,18 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Text; /***/ }), -/* 84 */ +/* 115 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _fabric = __webpack_require__(74); + var _fabric = __webpack_require__(105); var _fabric2 = _interopRequireDefault(_fabric); - var _tuiCodeSnippet = __webpack_require__(2); + var _tuiCodeSnippet = __webpack_require__(3); var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); @@ -7691,11 +17431,11 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _component = __webpack_require__(76); + var _component = __webpack_require__(107); var _component2 = _interopRequireDefault(_component); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -7711,6 +17451,7 @@ return /******/ (function(modules) { // webpackBootstrap */ + var events = _consts2.default.eventNames; var rejectMessages = _consts2.default.rejectMessages; @@ -7746,6 +17487,12 @@ return /******/ (function(modules) { // webpackBootstrap * @type {Object} */ _this._pathMap = pathMap; + + /** + * Option to add icon to drag. + * @type {boolean} + */ + _this.useDragAddIcon = graphics.useDragAddIcon; return _this; } @@ -7779,9 +17526,33 @@ return /******/ (function(modules) { // webpackBootstrap icon.set(_tuiCodeSnippet2.default.extend({ type: 'icon', fill: _this2._oColor - }, selectionStyle, options)); + }, selectionStyle, options, _this2.graphics.controlStyle)); + + if (_this2.useDragAddIcon) { + canvas.add(icon).setActiveObject(icon); + canvas.on({ + 'mouse:move': function mouseMove(fEvent) { + canvas.selection = false; + + _this2.fire(events.ICON_CREATE_RESIZE, { + moveOriginPointer: canvas.getPointer(fEvent.e) + }); + }, + 'mouse:up': function mouseUp(fEvent) { + _this2.fire(events.ICON_CREATE_END, { + moveOriginPointer: canvas.getPointer(fEvent.e) + }); + + canvas.defaultCursor = 'default'; + canvas.off('mouse:up'); + canvas.off('mouse:move'); + canvas.selection = true; + } + }); + } else { + canvas.add(icon).setActiveObject(icon); + } - canvas.add(icon).setActiveObject(icon); resolve(_this2.graphics.createObjectProperties(icon)); }); } @@ -7849,48 +17620,48 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Icon; /***/ }), -/* 85 */ +/* 116 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _tuiCodeSnippet = __webpack_require__(2); + var _tuiCodeSnippet = __webpack_require__(3); var _promise = __webpack_require__(4); var _promise2 = _interopRequireDefault(_promise); - var _fabric = __webpack_require__(74); + var _fabric = __webpack_require__(105); var _fabric2 = _interopRequireDefault(_fabric); - var _component = __webpack_require__(76); + var _component = __webpack_require__(107); var _component2 = _interopRequireDefault(_component); - var _mask = __webpack_require__(86); + var _mask = __webpack_require__(117); var _mask2 = _interopRequireDefault(_mask); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); - var _blur = __webpack_require__(87); + var _blur = __webpack_require__(118); var _blur2 = _interopRequireDefault(_blur); - var _sharpen = __webpack_require__(88); + var _sharpen = __webpack_require__(119); var _sharpen2 = _interopRequireDefault(_sharpen); - var _emboss = __webpack_require__(89); + var _emboss = __webpack_require__(120); var _emboss2 = _interopRequireDefault(_emboss); - var _colorFilter = __webpack_require__(90); + var _colorFilter = __webpack_require__(121); var _colorFilter2 = _interopRequireDefault(_colorFilter); @@ -8171,12 +17942,12 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Filter; /***/ }), -/* 86 */ +/* 117 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _fabric = __webpack_require__(74); + var _fabric = __webpack_require__(105); var _fabric2 = _interopRequireDefault(_fabric); @@ -8282,12 +18053,12 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Mask; /***/ }), -/* 87 */ +/* 118 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _fabric = __webpack_require__(74); + var _fabric = __webpack_require__(105); var _fabric2 = _interopRequireDefault(_fabric); @@ -8324,12 +18095,12 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Blur; /***/ }), -/* 88 */ +/* 119 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _fabric = __webpack_require__(74); + var _fabric = __webpack_require__(105); var _fabric2 = _interopRequireDefault(_fabric); @@ -8366,12 +18137,12 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Sharpen; /***/ }), -/* 89 */ +/* 120 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _fabric = __webpack_require__(74); + var _fabric = __webpack_require__(105); var _fabric2 = _interopRequireDefault(_fabric); @@ -8408,12 +18179,12 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Emboss; /***/ }), -/* 90 */ +/* 121 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _fabric = __webpack_require__(74); + var _fabric = __webpack_require__(105); var _fabric2 = _interopRequireDefault(_fabric); @@ -8457,6 +18228,7 @@ return /******/ (function(modules) { // webpackBootstrap * @param {Object} canvasEl Canvas element to apply filter to */ applyTo: function applyTo(canvasEl) { + // eslint-disable-line var context = canvasEl.getContext('2d'); var imageData = context.getImageData(0, 0, canvasEl.width, canvasEl.height); var data = imageData.data; @@ -8525,14 +18297,14 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = ColorFilter; /***/ }), -/* 91 */ +/* 122 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _fabric = __webpack_require__(74); + var _fabric = __webpack_require__(105); var _fabric2 = _interopRequireDefault(_fabric); @@ -8540,19 +18312,19 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _component = __webpack_require__(76); + var _component = __webpack_require__(107); var _component2 = _interopRequireDefault(_component); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); - var _shapeResizeHelper = __webpack_require__(92); + var _shapeResizeHelper = __webpack_require__(123); var _shapeResizeHelper2 = _interopRequireDefault(_shapeResizeHelper); - var _tuiCodeSnippet = __webpack_require__(2); + var _tuiCodeSnippet = __webpack_require__(3); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } @@ -8570,6 +18342,7 @@ return /******/ (function(modules) { // webpackBootstrap eventNames = _consts2.default.eventNames; var KEY_CODES = _consts2.default.keyCodes; + var DEFAULT_TYPE = 'rect'; var DEFAULT_OPTIONS = { strokeWidth: 1, @@ -8698,6 +18471,7 @@ return /******/ (function(modules) { // webpackBootstrap this._isSelected = false; canvas.defaultCursor = 'default'; + canvas.selection = true; canvas.uniScaleTransform = false; canvas.off({ @@ -8905,6 +18679,11 @@ return /******/ (function(modules) { // webpackBootstrap }, { key: '_onFabricMouseDown', value: function _onFabricMouseDown(fEvent) { + if (!fEvent.target) { + this._isSelected = false; + this._shapeObj = false; + } + if (!this._isSelected && !this._shapeObj) { var canvas = this.getCanvas(); this._startPoint = canvas.getPointer(fEvent.e); @@ -8968,6 +18747,8 @@ return /******/ (function(modules) { // webpackBootstrap _shapeResizeHelper2.default.adjustOriginToCenter(shape); } + this.fire(eventNames.ADD_OBJECT_AFTER, this.graphics.createObjectProperties(shape)); + canvas.off({ 'mouse:move': this._handlers.mousemove, 'mouse:up': this._handlers.mouseup @@ -9017,7 +18798,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Shape; /***/ }), -/* 92 */ +/* 123 */ /***/ (function(module, exports) { 'use strict'; @@ -9278,18 +19059,18 @@ return /******/ (function(modules) { // webpackBootstrap }; /***/ }), -/* 93 */ +/* 124 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _drawingMode = __webpack_require__(94); + var _drawingMode = __webpack_require__(125); var _drawingMode2 = _interopRequireDefault(_drawingMode); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -9358,7 +19139,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = CropperDrawingMode; /***/ }), -/* 94 */ +/* 125 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -9369,7 +19150,7 @@ return /******/ (function(modules) { // webpackBootstrap */ - var _errorMessage = __webpack_require__(70); + var _errorMessage = __webpack_require__(71); var _errorMessage2 = _interopRequireDefault(_errorMessage); @@ -9440,18 +19221,18 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = DrawingMode; /***/ }), -/* 95 */ +/* 126 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _drawingMode = __webpack_require__(94); + var _drawingMode = __webpack_require__(125); var _drawingMode2 = _interopRequireDefault(_drawingMode); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -9521,18 +19302,18 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = FreeDrawingMode; /***/ }), -/* 96 */ +/* 127 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _drawingMode = __webpack_require__(94); + var _drawingMode = __webpack_require__(125); var _drawingMode2 = _interopRequireDefault(_drawingMode); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -9602,18 +19383,18 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = LineDrawingMode; /***/ }), -/* 97 */ +/* 128 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _drawingMode = __webpack_require__(94); + var _drawingMode = __webpack_require__(125); var _drawingMode2 = _interopRequireDefault(_drawingMode); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -9682,18 +19463,18 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = ShapeDrawingMode; /***/ }), -/* 98 */ +/* 129 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _drawingMode = __webpack_require__(94); + var _drawingMode = __webpack_require__(125); var _drawingMode2 = _interopRequireDefault(_drawingMode); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -9762,12 +19543,19 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = TextDrawingMode; /***/ }), -/* 99 */ +/* 130 */ +/***/ (function(module, exports) { + + // removed by extract-text-webpack-plugin + +/***/ }), +/* 131 */, +/* 132 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _command = __webpack_require__(68); + var _command = __webpack_require__(69); var _command2 = _interopRequireDefault(_command); @@ -9775,7 +19563,7 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -9831,12 +19619,12 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 100 */ +/* 133 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _command = __webpack_require__(68); + var _command = __webpack_require__(69); var _command2 = _interopRequireDefault(_command); @@ -9844,7 +19632,7 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -9890,12 +19678,12 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 101 */ +/* 134 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _command = __webpack_require__(68); + var _command = __webpack_require__(69); var _command2 = _interopRequireDefault(_command); @@ -9903,7 +19691,7 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -9957,12 +19745,12 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 102 */ +/* 135 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _command = __webpack_require__(68); + var _command = __webpack_require__(69); var _command2 = _interopRequireDefault(_command); @@ -9970,7 +19758,7 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -10033,12 +19821,12 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 103 */ +/* 136 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _command = __webpack_require__(68); + var _command = __webpack_require__(69); var _command2 = _interopRequireDefault(_command); @@ -10046,7 +19834,7 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -10108,16 +19896,16 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 104 */ +/* 137 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _command = __webpack_require__(68); + var _command = __webpack_require__(69); var _command2 = _interopRequireDefault(_command); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -10200,12 +19988,12 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 105 */ +/* 138 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _command = __webpack_require__(68); + var _command = __webpack_require__(69); var _command2 = _interopRequireDefault(_command); @@ -10213,7 +20001,7 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -10279,16 +20067,16 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 106 */ +/* 139 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _tuiCodeSnippet = __webpack_require__(2); + var _tuiCodeSnippet = __webpack_require__(3); var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); - var _command = __webpack_require__(68); + var _command = __webpack_require__(69); var _command2 = _interopRequireDefault(_command); @@ -10296,7 +20084,7 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -10371,12 +20159,12 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 107 */ +/* 140 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _command = __webpack_require__(68); + var _command = __webpack_require__(69); var _command2 = _interopRequireDefault(_command); @@ -10384,7 +20172,7 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -10444,16 +20232,16 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 108 */ +/* 141 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _tuiCodeSnippet = __webpack_require__(2); + var _tuiCodeSnippet = __webpack_require__(3); var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); - var _command = __webpack_require__(68); + var _command = __webpack_require__(69); var _command2 = _interopRequireDefault(_command); @@ -10461,7 +20249,7 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -10533,12 +20321,12 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 109 */ +/* 142 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _command = __webpack_require__(68); + var _command = __webpack_require__(69); var _command2 = _interopRequireDefault(_command); @@ -10546,7 +20334,7 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -10591,16 +20379,16 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 110 */ +/* 143 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _command = __webpack_require__(68); + var _command = __webpack_require__(69); var _command2 = _interopRequireDefault(_command); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -10648,16 +20436,16 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 111 */ +/* 144 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _command = __webpack_require__(68); + var _command = __webpack_require__(69); var _command2 = _interopRequireDefault(_command); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -10728,16 +20516,16 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 112 */ +/* 145 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _command = __webpack_require__(68); + var _command = __webpack_require__(69); var _command2 = _interopRequireDefault(_command); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -10788,12 +20576,12 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 113 */ +/* 146 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _command = __webpack_require__(68); + var _command = __webpack_require__(69); var _command2 = _interopRequireDefault(_command); @@ -10801,7 +20589,7 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -10851,12 +20639,12 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 114 */ +/* 147 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _command = __webpack_require__(68); + var _command = __webpack_require__(69); var _command2 = _interopRequireDefault(_command); @@ -10864,7 +20652,7 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -10916,16 +20704,16 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 115 */ +/* 148 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _command = __webpack_require__(68); + var _command = __webpack_require__(69); var _command2 = _interopRequireDefault(_command); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -10976,16 +20764,16 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 116 */ +/* 149 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _tuiCodeSnippet = __webpack_require__(2); + var _tuiCodeSnippet = __webpack_require__(3); var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); - var _command = __webpack_require__(68); + var _command = __webpack_require__(69); var _command2 = _interopRequireDefault(_command); @@ -10993,7 +20781,7 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); @@ -11063,12 +20851,12 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 117 */ +/* 150 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _command = __webpack_require__(68); + var _command = __webpack_require__(69); var _command2 = _interopRequireDefault(_command); @@ -11076,7 +20864,7 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _consts = __webpack_require__(72); + var _consts = __webpack_require__(73); var _consts2 = _interopRequireDefault(_consts); diff --git a/dist/tui-image-editor.min.css b/dist/tui-image-editor.min.css new file mode 100644 index 000000000..35d0a5d0e --- /dev/null +++ b/dist/tui-image-editor.min.css @@ -0,0 +1,7 @@ +/*! + * tui-image-editor.min.js + * @version 3.2.0 + * @author NHNEnt FE Development Lab + * @license MIT + */ +body>textarea{position:fixed!important}.tui-image-editor-container{marign:0;padding:0;box-sizing:border-box;min-height:300px;height:100%;position:relative;background-color:#282828;overflow:hidden}.tui-image-editor-container div,.tui-image-editor-container input,.tui-image-editor-container label,.tui-image-editor-container li,.tui-image-editor-container ul{box-sizing:border-box;margin:0;padding:0;-ms-user-select:none;-moz-user-select:-moz-none;-khtml-user-select:none;-webkit-user-select:none;user-select:none}.tui-image-editor-container .tui-image-editor-header{min-width:533px;position:absolute;background-color:#151515;top:0;width:100%}.tui-image-editor-container .tui-image-editor-controls-buttons,.tui-image-editor-container .tui-image-editor-header-buttons{float:right;margin:8px}.tui-image-editor-container .tui-image-editor-controls-logo,.tui-image-editor-container .tui-image-editor-header-logo{float:left;width:30%;padding:17px}.tui-image-editor-container .tui-image-editor-controls-buttons,.tui-image-editor-container .tui-image-editor-controls-logo{width:270px;height:100%;display:none}.tui-image-editor-container .tui-image-editor-controls-buttons button,.tui-image-editor-container .tui-image-editor-header-buttons button{position:relative;width:120px;height:40px;outline:none;border-radius:20px;border:1px solid #ddd;padding-top:5px;font-family:NotoSans,sans-serif;font-size:12px;font-weight:700;cursor:pointer}.tui-image-editor-container .tui-image-editor-download-btn{background-color:#fdba3b;border-color:#fdba3b;color:#fff}.tui-image-editor-container .tui-image-editor-load-btn{position:absolute;left:0;right:0;display:inline-block;top:0;bottom:0;width:100%;cursor:pointer;opacity:0}.tui-image-editor-container .tui-image-editor-main-container{position:absolute;width:100%;top:0;bottom:64px}.tui-image-editor-container .tui-image-editor-main{position:absolute;text-align:center;top:64px;bottom:0;right:0;left:0}.tui-image-editor-container .tui-image-editor-wrap{bottom:150px;width:100%;overflow:auto}.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap{display:table;width:100%;height:100%}.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap .tui-image-editor-align-wrap{display:table-cell;vertical-align:middle}.tui-image-editor-container .tui-image-editor{position:static;display:inline-block}.tui-image-editor-container .tui-image-editor-menu{width:auto;list-style:none;padding:0;margin:0 auto;display:table-cell;text-align:center;vertical-align:middle;white-space:nowrap}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item{position:relative;display:inline-block;border-radius:2px;padding:7px 8px 3px;cursor:pointer;margin:0 4px}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item[title]:hover:before{content:"";display:inline-block;margin:0 auto;width:0;height:0;border-right:7px solid transparent;border-top:7px solid #2f2f2f;border-left:7px solid transparent;position:absolute;left:13px;top:-2px}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item[title]:hover:after{content:attr(title);position:absolute;display:inline-block;background-color:#2f2f2f;color:#fff;padding:5px 8px;font-size:11px;font-weight:lighter;border-radius:3px;max-height:23px;top:-22px;left:0;min-width:24px}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item.active{background-color:#fff;transition:all .3s ease}.tui-image-editor-container .tui-image-editor-wrap{position:absolute}.tui-image-editor-container .tui-image-editor-grid-visual{display:none;position:absolute;width:100%;height:100%}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor{transition:none}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-grid-visual,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-grid-visual{display:block}.tui-image-editor-container .tui-image-editor-grid-visual table{width:100%;height:100%;border-collapse:collapse;box-shadow:0 0 1px 0 rgba(0,0,0,.3)}.tui-image-editor-container .tui-image-editor-grid-visual table td{border:1px solid #fff;box-shadow:0 0 1px 0 rgba(0,0,0,.3)}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot:before{content:"";position:absolute;width:8px;height:8px;border:1px solid #cdcdcd;border-radius:100%;background-color:#fff}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-top:before{top:-4px;left:-4px}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-top:before{top:-4px;right:-4px}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-bottom:before{bottom:-4px;left:-4px}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-bottom:before{bottom:-4px;right:-4px}.tui-image-editor-container .tui-image-editor-submenu{display:none;position:absolute;bottom:0;width:100%;height:150px;white-space:nowrap}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover svg>use.active{display:block}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item li{display:inline-block;vertical-align:top}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-newline{display:block;margin-top:14px}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button{position:relative;cursor:pointer;display:inline-block;font-weight:400;font-size:11px;margin:0 7px}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item label{display:inline-block;cursor:pointer;padding-top:5px;font-family:NotoSans,sans-serif;font-size:11px;letter-spacing:.7px}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.apply label,.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.cancel label{vertical-align:7px}.tui-image-editor-container .tui-image-editor-submenu>div{display:none;vertical-align:bottom}.tui-image-editor-container .tui-image-editor-partition>div{width:1px;height:52px;border-left:1px solid #3c3c3c;margin:0 12px 0 14px}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-partition>div{height:108px;margin:0 29px 0 0}.tui-image-editor-container .tui-image-editor-submenu-align{text-align:left;margin-right:30px}.tui-image-editor-container .tui-image-editor-submenu-align label{width:55px;white-space:nowrap}.tui-image-editor-container .tui-image-editor-submenu-align:first-child{margin-right:0}.tui-image-editor-container .tui-image-editor-submenu-align:first-child label{width:70px}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-crop .tui-image-editor-submenu>div.tui-image-editor-menu-crop,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-draw .tui-image-editor-submenu>div.tui-image-editor-menu-draw,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-submenu>div.tui-image-editor-menu-filter,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-submenu>div.tui-image-editor-menu-flip,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-icon .tui-image-editor-submenu>div.tui-image-editor-menu-icon,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-mask .tui-image-editor-submenu>div.tui-image-editor-menu-mask,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-submenu>div.tui-image-editor-menu-rotate,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-shape .tui-image-editor-submenu>div.tui-image-editor-menu-shape,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-text .tui-image-editor-submenu>div.tui-image-editor-menu-text{display:table-cell}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-crop .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-draw .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-icon .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-mask .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-shape .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-text .tui-image-editor-submenu{display:table}.tui-image-editor-container .filter-color-item{display:inline-block}.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox{display:block}.tui-image-editor-container .tui-image-editor-checkbox-wrap{display:inline-block!important;text-align:left}.tui-image-editor-container .tui-image-editor-checkbox-wrap.fixed-width{width:187px;white-space:normal}.tui-image-editor-container .tui-image-editor-checkbox{display:inline-block;margin:1px 0}.tui-image-editor-container .tui-image-editor-checkbox input{width:14px;height:14px;opacity:0}.tui-image-editor-container .tui-image-editor-checkbox input+label{color:#fff;height:14px;position:relative}.tui-image-editor-container .tui-image-editor-checkbox input+label:before{content:"";position:absolute;width:14px;height:14px;background-color:#fff;top:4px;left:-19px;display:inline-block;margin:0;text-align:center;font-size:11px;border:0;border-radius:2px;padding-top:1px;box-sizing:border-box}.tui-image-editor-container .tui-image-editor-checkbox input[type=checkbox]:checked+label:before{background-size:cover;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAMBJREFUKBWVkjEOwjAMRe2WgZW7IIHEDdhghhuwcQ42rlJugAQS54Cxa5cq1QM5TUpByZfS2j9+dlJVt/tX5ZxbS4ZU9VLkQvSHKTIGRaVJYFmKrBbTCJxE2UgCdDzMZDkHrOV6b95V0US6UmgKodujEZbJg0B0ZgEModO5lrY1TMQf1TpyJGBEjD+E2NPN7ukIUDiF/BfEXgRiGEw8NgkffYGYwCi808fpn/6OvfUfsDr/Vc1IfRf8sKnFVqeiVQfDu0tf/nWH9gAAAABJRU5ErkJggg==")}.tui-image-editor-container .tui-image-editor-selectlist-wrap{position:relative}.tui-image-editor-container .tui-image-editor-selectlist-wrap select{width:100%;height:25px;margin-top:9px;border:0;outline:0;border-radius:0;border:1px solid #cbdbdb;background-color:#fff;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0 7px}.tui-image-editor-container .tui-image-editor-selectlist-wrap:after{content:"";position:absolute;display:inline-block;width:14px;height:14px;right:5px;bottom:5px;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAHlJREFUKBVjYBgFOEOAEVkmPDxc89+/f6eAYjzI4kD2FyYmJrOVK1deh4kzwRggGiQBVJCELAZig8SQNYHEmEEEMrh69eo1HR0dfqCYJUickZGxf9WqVf3IakBsFBthklpaWmVA9mEQhrJhUoTp0NBQCRAmrHL4qgAAuu4cWZOZIGsAAAAASUVORK5CYII=");background-size:cover}.tui-image-editor-container .tui-image-editor-selectlist-wrap select::-ms-expand{display:none}.tui-image-editor-container .tui-image-editor-range{position:relative;top:7px;width:166px;height:17px;display:inline-block}.tui-image-editor-container .tui-image-editor-virtual-range-bar{top:7px;position:absolute;width:100%;height:2px;background-color:#666}.tui-image-editor-container .tui-image-editor-virtual-range-subbar{position:absolute;height:100%;left:0;right:0;background-color:#d1d1d1}.tui-image-editor-container .tui-image-editor-virtual-range-pointer{position:absolute;cursor:pointer;top:-5px;left:0;width:12px;height:12px;background-color:#fff;border-radius:100%}.tui-image-editor-container .tui-image-editor-range-wrap{display:inline-block}.tui-image-editor-container .tui-image-editor-range-wrap.short .tui-image-editor-range{width:100px}.tui-image-editor-container .color-picker-control .tui-image-editor-range{width:108px}.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-pointer{background-color:#333}.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-bar{background-color:#ccc}.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-subbar{background-color:#606060}.tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short{margin-top:0;margin-left:17px}.tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label{color:#8e8e8e;font-weight:400}.tui-image-editor-container .tui-image-editor-range-wrap label{vertical-align:baseline;font-size:11px;margin-right:7px;color:#fff}.tui-image-editor-container .tui-image-editor-range-value{cursor:default;width:40px;height:24px;outline:none;border-radius:2px;box-shadow:none;border:1px solid #d5d5d5;text-align:center;background-color:#1c1c1c;color:#fff;font-weight:lighter;vertical-align:baseline;font-family:NotoSans,sans-serif;padding-top:2px}.tui-image-editor-container .tui-image-editor-controls{position:absolute;background-color:#151515;width:100%;height:64px;display:table;bottom:0;z-index:1}.tui-image-editor-container .tui-image-editor-icpartition{display:inline-block;background-color:#282828;width:1px;height:24px}.tui-image-editor-container.left .tui-image-editor-menu>.tui-image-editor-item[title]:before{left:28px;top:11px;border-right:7px solid #2f2f2f;border-top:7px solid transparent;border-bottom:7px solid transparent}.tui-image-editor-container.left .tui-image-editor-menu>.tui-image-editor-item[title]:after{top:7px;left:39px;width:27px}.tui-image-editor-container.left .tui-image-editor-submenu{left:0;height:100%;width:248px}.tui-image-editor-container.left .tui-image-editor-main-container{left:64px;width:calc(100% - 64px);height:100%}.tui-image-editor-container.left .tui-image-editor-controls{width:64px;height:100%;display:table}.tui-image-editor-container.left .tui-image-editor-menu,.tui-image-editor-container.left .tui-image-editor-submenu,.tui-image-editor-container.right .tui-image-editor-menu,.tui-image-editor-container.right .tui-image-editor-submenu{white-space:normal}.tui-image-editor-container.left .tui-image-editor-submenu>div,.tui-image-editor-container.right .tui-image-editor-submenu>div{vertical-align:middle}.tui-image-editor-container.left .tui-image-editor-controls li,.tui-image-editor-container.right .tui-image-editor-controls li{display:inline-block;margin:4px auto}.tui-image-editor-container.left .tui-image-editor-icpartition,.tui-image-editor-container.right .tui-image-editor-icpartition{position:relative;top:-7px;width:24px;height:1px}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition{display:block;width:75%;margin:auto}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition>div,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition>div{border-left:0;height:10px;border-bottom:1px solid #3c3c3c;width:100%;margin:0}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-align,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-align{margin-right:0}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-item li,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-item li{margin-top:15px}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-colorpicker-clearfix li,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-colorpicker-clearfix li{margin-top:0}.tui-image-editor-container.left .tui-image-editor-checkbox-wrap.fixed-width,.tui-image-editor-container.right .tui-image-editor-checkbox-wrap.fixed-width{width:182px;white-space:normal}.tui-image-editor-container.left .tui-image-editor-range-wrap.tui-image-editor-newline label.range,.tui-image-editor-container.right .tui-image-editor-range-wrap.tui-image-editor-newline label.range{display:block;text-align:left;width:75%;margin:auto}.tui-image-editor-container.left .tui-image-editor-range,.tui-image-editor-container.right .tui-image-editor-range{width:136px}.tui-image-editor-container.left #tie-icon-add-button .tui-image-editor-button,.tui-image-editor-container.right #tie-icon-add-button .tui-image-editor-button{width:45px}.tui-image-editor-container.right .tui-image-editor-menu>.tui-image-editor-item[title]:before{left:-3px;top:11px;border-left:7px solid #2f2f2f;border-top:7px solid transparent;border-bottom:7px solid transparent}.tui-image-editor-container.right .tui-image-editor-menu>.tui-image-editor-item[title]:after{top:7px;left:-44px;width:27px}.tui-image-editor-container.right .tui-image-editor-submenu{right:0;height:100%;width:248px}.tui-image-editor-container.right .tui-image-editor-main-container{right:64px;width:calc(100% - 64px);height:100%}.tui-image-editor-container.right .tui-image-editor-controls{right:0;width:64px;height:100%;display:table}.tui-image-editor-container.bottom .tui-image-editor-submenu .tui-image-editor-partition.only-left-right,.tui-image-editor-container.top .tui-image-editor-submenu .tui-image-editor-partition.only-left-right{display:none}.tui-image-editor-container.bottom .tui-image-editor-submenu>div{padding-bottom:24px}.tui-image-editor-container.top .color-picker-control .triangle{top:-11px;border-right:12px solid transparent;border-top:0;border-left:12px solid transparent;border-bottom:12px solid #fff}.tui-image-editor-container.top .tui-image-editor-size-wrap{height:calc(100% - 64px)}.tui-image-editor-container.top .tui-image-editor-main-container{bottom:0}.tui-image-editor-container.top .tui-image-editor-menu>.tui-image-editor-item[title]:before{left:13px;border-top:0;border-bottom:7px solid #2f2f2f;top:33px}.tui-image-editor-container.top .tui-image-editor-menu>.tui-image-editor-item[title]:after{top:38px}.tui-image-editor-container.top .tui-image-editor-submenu{top:0;bottom:inherit}.tui-image-editor-container.top .tui-image-editor-submenu>div{padding-top:24px;vertical-align:top}.tui-image-editor-container.top .tui-image-editor-controls-buttons,.tui-image-editor-container.top .tui-image-editor-controls-logo{display:table-cell}.tui-image-editor-container.top .tui-image-editor-main{top:64px;height:100%}.tui-image-editor-container.top .tui-image-editor-controls{top:0;bottom:inherit}.tui-image-editor-container .svg_ic-menu{width:24px;height:24px}.tui-image-editor-container .svg_ic-submenu{width:32px;height:32px}.tui-image-editor-container .svg_img-bi{width:257px;height:26px}.tui-image-editor-container .tui-image-editor-controls svg>use{display:none}.tui-image-editor-container .tui-image-editor-controls .active svg>use.active,.tui-image-editor-container .tui-image-editor-controls .enabled svg>use.enabled,.tui-image-editor-container .tui-image-editor-controls svg>use.normal{display:block}.tui-image-editor-container .tui-image-editor-controls .active svg>use.normal,.tui-image-editor-container .tui-image-editor-controls .enabled svg>use.normal{display:none}.tui-image-editor-container div.tui-colorpicker-clearfix{width:159px;height:28px;border:1px solid #d5d5d5;border-radius:2px;background-color:#f5f5f5;margin-top:6px;padding:4px 7px}.tui-image-editor-container .tui-colorpicker-palette-hex{width:114px;background-color:#f5f5f5;border:0;font-size:11px;margin-top:2px}.tui-image-editor-container .tui-colorpicker-palette-preview{border-radius:100%;float:left;width:16px;height:16px}.tui-image-editor-container .color-picker-control{position:absolute;display:none;z-index:99;width:188px;height:112px;background-color:#fff;box-shadow:0 3px 22px 0 #000;padding:14px;border-radius:2px}.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-toggle-slider{display:none}.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button{border-radius:100%;margin:2px}.tui-image-editor-container .color-picker-control .triangle{width:0;height:0;border-right:12px solid transparent;border-top:12px solid #fff;border-left:12px solid transparent;position:absolute;bottom:-11px;left:77px}.tui-image-editor-container .color-picker-control .tui-colorpicker-container,.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-container,.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-container ul{width:100%;height:auto}.tui-image-editor-container .filter-color-item .color-picker-control label{font-color:#333;font-weight:400;margin-right:7pxleft}.tui-image-editor-container .color-picker{width:100%;height:auto}.tui-image-editor-container .color-picker-value{width:30px;height:30px;border:0;border-radius:100%;margin:auto;margin-bottom:4px}.tui-image-editor-container .color-picker-value.transparent{border:1px solid #cbcbcb;background-size:cover;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAdBJREFUWAnFl0FuwjAQRZ0ukiugHqFSOQNdseuKW3ALzkA4BateICvUGyCxrtRFd4WuunH/TzykaYJrnLEYaTJJsP2+x8GZZCbQrLU5mj7Bn+EP8HvnCObd+R7xBV5lWfaNON4AnsA38E94qLEt+0yiFaBzAV/Bv+Cxxr4co7hKCDpw1q9wLeNYYdlAwyn8TYt8Hme3+8D5ozcTaMCZ68PXa2tnM2sbEcOZAJhrrpl2DAcTOGNjZPSfCdzkw6JrfbiMv+osBe4y9WOedhm4jZfhbENWuxS44H9Wz/xw4WzqLOAqh1+zycgAwzEMzr5k5gaHOa9ULBwuuDkFlHI1Kl4PJ66kgIpnoywOTmRFAYcbwYk9UMApWkD8zAV5ihcwHk4Rx7gl0IFTQL0EFc+CTQ9OZHWH3YhlVJiVpTHbrTGLhTHLZVgff6s9lyBsI9KduSS83oj+34rTwJutmBmCnMsvozRwZqB5GTkBw6/jdPDu69iJ6BYk6eCcfbcgcQIK/MByaaiMqm8rHcjol2TnpWDhyAKSGdA3FrxtJUToX0ODqatetfGE+8tyEUOV8GY5dGRwLP/MBS4RHQr4bT7NRAQjlcOTfZxmv2G+c4hI8nn+Ax5PG/zhI393AAAAAElFTkSuQmCC")}.tui-image-editor-container .color-picker-value+label{color:#fff}.tui-image-editor-container .tui-image-editor-submenu svg>use{display:none}#tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype=icon-arrow-2] svg>use.active,#tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype=icon-arrow-3] svg>use.active,#tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype=icon-arrow] svg>use.active,#tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype=icon-bubble] svg>use.active,#tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype=icon-heart] svg>use.active,#tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype=icon-location] svg>use.active,#tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype=icon-polygon] svg>use.active,#tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype=icon-star] svg>use.active,.tui-image-editor-container .tui-image-editor-submenu svg>use.normal{display:block}#tie-draw-line-select-button.free .tui-image-editor-button.free svg>use.normal,#tie-draw-line-select-button.line .tui-image-editor-button.line svg>use.normal{display:none}#tie-draw-line-select-button.free .tui-image-editor-button.free svg>use.active,#tie-draw-line-select-button.line .tui-image-editor-button.line svg>use.active{display:block}#tie-flip-button.flipX .tui-image-editor-button.flipX svg>use.normal,#tie-flip-button.flipY .tui-image-editor-button.flipY svg>use.normal,#tie-flip-button.resetFlip .tui-image-editor-button.resetFlip svg>use.normal{display:none}#tie-flip-button.flipX .tui-image-editor-button.flipX svg>use.active,#tie-flip-button.flipY .tui-image-editor-button.flipY svg>use.active,#tie-flip-button.resetFlip .tui-image-editor-button.resetFlip svg>use.active{display:block}#tie-mask-apply.apply.active .tui-image-editor-button.apply label{color:#fff}#tie-mask-apply.apply.active .tui-image-editor-button.apply svg>use.active{display:block}#tie-crop-button .tui-image-editor-button.apply{margin-right:24px}#tie-crop-button .tui-image-editor-button.apply.active svg>use.active{display:block}#tie-shape-button.circle .tui-image-editor-button.circle svg>use.normal,#tie-shape-button.rect .tui-image-editor-button.rect svg>use.normal,#tie-shape-button.triangle .tui-image-editor-button.triangle svg>use.normal{display:none}#tie-shape-button.circle .tui-image-editor-button.circle svg>use.active,#tie-shape-button.rect .tui-image-editor-button.rect svg>use.active,#tie-shape-button.triangle .tui-image-editor-button.triangle svg>use.active,#tie-text-align-button.center .tui-image-editor-button.center svg>use.active,#tie-text-align-button.left .tui-image-editor-button.left svg>use.active,#tie-text-align-button.right .tui-image-editor-button.right svg>use.active,#tie-text-effect-button .tui-image-editor-button.active svg>use.active{display:block}#tie-icon-image-file,#tie-mask-image-file{opacity:0;position:absolute;width:100%;height:100%;border:1px solid green;cursor:inherit;left:0;top:0}.tui-image-editor-container.top.tui-image-editor-top-optimization .tui-image-editor-controls ul{text-align:right}.tui-image-editor-container.top.tui-image-editor-top-optimization .tui-image-editor-controls-logo{display:none} \ No newline at end of file diff --git a/dist/tui-image-editor.min.js b/dist/tui-image-editor.min.js index 9f31b394a..6c8f89e8a 100644 --- a/dist/tui-image-editor.min.js +++ b/dist/tui-image-editor.min.js @@ -1,10 +1,28 @@ /*! * tui-image-editor.min.js - * @version 3.1.0 + * @version 3.2.0 * @author NHNEnt FE Development Lab * @license MIT */ -!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("fabric/dist/fabric.require"),require("tui-code-snippet")):"function"==typeof define&&define.amd?define(["fabric/dist/fabric.require","tui-code-snippet"],t):"object"==typeof exports?exports.ImageEditor=t(require("fabric/dist/fabric.require"),require("tui-code-snippet")):(e.tui=e.tui||{},e.tui.ImageEditor=t(e.fabric,e.tui&&e.tui.util))}(this,function(e,t){return function(e){function t(r){if(n[r])return n[r].exports;var i=n[r]={exports:{},id:r,loaded:!1};return e[r].call(i.exports,i,i.exports,t),i.loaded=!0,i.exports}var n={};return t.m=e,t.c=n,t.p="dist",t(0)}([function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(83),o=r(i);n(41),n(42),n(43),n(44),n(45),n(46),n(47),n(48),n(49),n(50),n(51),n(52),n(53),n(54),n(55),n(56),n(57),n(59),n(58),e.exports=o.default},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(9),o=r(i);e.exports={componentNames:o.default.keyMirror("IMAGE_LOADER","CROPPER","FLIP","ROTATION","FREE_DRAWING","LINE","TEXT","ICON","FILTER","SHAPE"),commandNames:{CLEAR_OBJECTS:"clearObjects",LOAD_IMAGE:"loadImage",FLIP_IMAGE:"flip",ROTATE_IMAGE:"rotate",ADD_OBJECT:"addObject",REMOVE_OBJECT:"removeObject",APPLY_FILTER:"applyFilter",REMOVE_FILTER:"removeFilter",ADD_ICON:"addIcon",CHANGE_ICON_COLOR:"changeIconColor",ADD_SHAPE:"addShape",CHANGE_SHAPE:"changeShape",ADD_TEXT:"addText",CHANGE_TEXT:"changeText",CHANGE_TEXT_STYLE:"changeTextStyle",ADD_IMAGE_OBJECT:"addImageObject",RESIZE_CANVAS_DIMENSION:"resizeCanvasDimension",SET_OBJECT_PROPERTIES:"setObjectProperties",SET_OBJECT_POSITION:"setObjectPosition"},eventNames:{OBJECT_ACTIVATED:"objectActivated",OBJECT_MOVED:"objectMoved",OBJECT_SCALED:"objectScaled",TEXT_EDITING:"textEditing",TEXT_CHANGED:"textChanged",ADD_TEXT:"addText",ADD_OBJECT:"addObject",MOUSE_DOWN:"mousedown",REDO_STACK_CHANGED:"redoStackChanged",UNDO_STACK_CHANGED:"undoStackChanged"},drawingModes:o.default.keyMirror("NORMAL","CROPPER","FREE_DRAWING","LINE_DRAWING","TEXT","SHAPE"),keyCodes:{Z:90,Y:89,SHIFT:16,BACKSPACE:8,DEL:46},fObjectOptions:{SELECTION_STYLE:{borderColor:"red",cornerColor:"green",cornerSize:10,originX:"center",originY:"center",transparentCorners:!1}},rejectMessages:{flip:"The flipX and flipY setting values are not changed.",rotation:"The current angle is same the old angle.",loadImage:"The background image is empty.",isLock:"The executing command state is locked.",undo:"The promise of undo command is reject.",redo:"The promise of redo command is reject.",invalidDrawingMode:"This operation is not supported in the drawing mode",invalidParameters:"Invalid parameters",noActiveObject:"There is no active object.",unsupportedType:"Unsupported object type",noObject:"The object is not in canvas.",addedObject:"The object is already added."}}},function(e,t,n){n(114),n(116),n(117),n(115),e.exports=n(13).Promise},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e){var t=u[e];if(t){for(var n=arguments.length,r=Array(n>1?n-1:0),i=1;in&&(r=t,t=n,n=r),o(t,i(e,n))},keyMirror:function(){for(var e={},t=arguments.length,n=Array(t),i=0;i0?r:n)(e)}},function(e,t,n){var r=n(92),i=n(22);e.exports=function(e){return r(i(e))}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(9),s=(0,a.keyMirror)("UN_IMPLEMENTATION","NO_COMPONENT_NAME"),u={UN_IMPLEMENTATION:"Should implement a method: ",NO_COMPONENT_NAME:"Should set a component name"},c={UN_IMPLEMENTATION:function(e){return u.UN_IMPLEMENTATION+e},NO_COMPONENT_NAME:function(){return u.NO_COMPONENT_NAME}};e.exports={types:o.default.extend({},s),create:function(e){e=e.toLowerCase();for(var t=c[e],n=arguments.length,r=Array(n>1?n-1:0),i=1;in;)t.push(arguments[n++]);return g[++v]=function(){s("function"==typeof e?e:Function(e),t)},r(v),v},d=function(e){delete g[e]},"process"==n(16)(f)?r=function(e){f.nextTick(a(y,e,1))}:p?(i=new p,o=i.port2,i.port1.onmessage=m,r=a(o.postMessage,o,1)):l.addEventListener&&"function"==typeof postMessage&&!l.importScripts?(r=function(e){l.postMessage(e+"","*")},l.addEventListener("message",m,!1)):r=_ in c("script")?function(e){u.appendChild(c("script"))[_]=function(){u.removeChild(this),y.call(e)}}:function(e){setTimeout(a(y,e,1),0)}),e.exports={set:h,clear:d}},function(e,t,n){var r=n(26),i=Math.min;e.exports=function(e){return e>0?i(r(e),9007199254740991):0}},function(e,t){var n=0,r=Math.random();e.exports=function(e){return"Symbol(".concat(void 0===e?"":e,")_",(++n+r).toString(36))}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.commandNames,h=l.ICON,d={name:f.ADD_ICON,execute:function(e,t,n){var r=this,i=e.getComponent(h);return i.add(t,n).then(function(t){return r.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(d),e.exports=d},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f={name:l.ADD_IMAGE_OBJECT,execute:function(e,t){var n=this;return e.addImageObject(t).then(function(t){return n.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f=c.default.rejectMessages,h={name:l.ADD_OBJECT,execute:function(e,t){return new s.default(function(n,r){e.contains(t)?r(f.addedObject):(e.add(t),n(t))})},undo:function(e,t){return new s.default(function(n,r){e.contains(t)?(e.remove(t),n(t)):r(f.noObject)})}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.commandNames,h=l.SHAPE,d={name:f.ADD_SHAPE,execute:function(e,t,n){var r=this,i=e.getComponent(h);return i.add(t,n).then(function(t){return r.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(d),e.exports=d},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.commandNames,h=l.TEXT,d={name:f.ADD_TEXT,execute:function(e,t,n){var r=this,i=e.getComponent(h);return i.add(t,n).then(function(t){return r.undoData.object=e.getObject(t.id),t})},undo:function(e){return e.remove(this.undoData.object),s.default.resolve()}};o.default.register(d),e.exports=d},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.rejectMessages,l=s.default.commandNames,f=u.FILTER,h={name:l.APPLY_FILTER,execute:function(e,t,n){var r=e.getComponent(f);if("mask"===t){var i=e.getObject(n.maskObjId);if(!i||!i.isType("image"))return Promise.reject(c.invalidParameters);n={mask:i}}return"mask"===t?(this.undoData.object=n.mask,e.remove(n.mask)):this.undoData.options=r.getOptions(t),r.add(t,n)},undo:function(e,t){var n=e.getComponent(f);if("mask"===t){var r=this.undoData.object;return e.add(r),e.setActiveObject(r),n.remove(t)}return this.undoData.options?n.add(t,this.undoData.options):n.remove(t)}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.rejectMessages,h=c.default.commandNames,d=l.ICON,p={name:h.CHANGE_ICON_COLOR,execute:function(e,t,n){var r=this;return new s.default(function(i,o){var a=e.getComponent(d),s=e.getObject(t);s||o(f.noObject),r.undoData.object=s,r.undoData.color=a.getColor(s),a.setColor(n,s),i()})},undo:function(e){var t=e.getComponent(d),n=this.undoData.object,r=n.object,i=n.color;return t.setColor(i,r),s.default.resolve()}};o.default.register(p),e.exports=p},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(3),s=r(a),u=n(2),c=r(u),l=n(1),f=r(l),h=f.default.componentNames,d=f.default.rejectMessages,p=f.default.commandNames,v=h.SHAPE,g={name:p.CHANGE_SHAPE,execute:function(e,t,n){var r=this,i=e.getComponent(v),a=e.getObject(t);return a?(this.undoData.object=a,this.undoData.options={},o.default.forEachOwnProperties(n,function(e,t){r.undoData.options[t]=a[t]}),i.change(a,n)):c.default.reject(d.noObject)},undo:function(e){var t=e.getComponent(v),n=this.undoData,r=n.object,i=n.options;return t.change(r,i)}};s.default.register(g),e.exports=g},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.componentNames,f=c.default.rejectMessages,h=c.default.commandNames,d=l.TEXT,p={name:h.CHANGE_TEXT,execute:function(e,t,n){var r=e.getComponent(d),i=e.getObject(t);return i?(this.undoData.object=i,this.undoData.text=r.getText(i),r.change(i,n)):s.default.reject(f.noObject)},undo:function(e){var t=e.getComponent(d),n=this.undoData,r=n.object,i=n.text;return t.change(r,i)}};o.default.register(p),e.exports=p},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(3),s=r(a),u=n(2),c=r(u),l=n(1),f=r(l),h=f.default.componentNames,d=f.default.rejectMessages,p=f.default.commandNames,v=h.TEXT,g={name:p.CHANGE_TEXT_STYLE,execute:function(e,t,n){var r=this,i=e.getComponent(v),a=e.getObject(t);return a?(this.undoData.object=a,this.undoData.styles={},o.default.forEachOwnProperties(n,function(e,t){r.undoData.styles[t]=a[t]}),i.setStyle(a,n)):c.default.reject(d.noObject)},undo:function(e){var t=e.getComponent(v),n=this.undoData,r=n.object,i=n.styles;return t.setStyle(r,i)}};s.default.register(g),e.exports=g},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f={name:l.CLEAR_OBJECTS,execute:function(e){var t=this;return new s.default(function(n){t.undoData.objects=e.removeAll(),n()})},undo:function(e){return e.add(this.undoData.objects),s.default.resolve()}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.FLIP,f={name:c.FLIP_IMAGE,execute:function(e,t){var n=e.getComponent(l);return this.undoData.setting=n.getCurrentSetting(),n[t]()},undo:function(e){var t=e.getComponent(l);return t.set(this.undoData.setting)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.IMAGE_LOADER,f={name:c.LOAD_IMAGE,execute:function(e,t,n){var r=e.getComponent(l),i=r.getCanvasImage(),o=i?i.width:0,a=i?i.height:0;return this.undoData={name:r.getImageName(),image:i,objects:e.removeAll(!0)},r.load(t,n).then(function(e){return{oldWidth:o,oldHeight:a,newWidth:e.width,newHeight:e.height}})},undo:function(e){var t=e.getComponent(l),n=this.undoData,r=n.objects,i=n.name,o=n.image;return e.removeAll(!0),e.add(r),t.load(i,o)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.FILTER,f={name:c.REMOVE_FILTER,execute:function(e,t){var n=e.getComponent(l);return this.undoData.options=n.getOptions(t),n.remove(t)},undo:function(e,t){var n=e.getComponent(l),r=this.undoData.options;return n.add(t,r)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f=c.default.rejectMessages,h={name:l.REMOVE_OBJECT,execute:function(e,t){var n=this;return new s.default(function(r,i){n.undoData.objects=e.removeObjectById(t),n.undoData.objects.length?r():i(f.noObject)})},undo:function(e){return e.add(this.undoData.objects),s.default.resolve()}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f={name:l.RESIZE_CANVAS_DIMENSION,execute:function(e,t){var n=this;return new s.default(function(r){n.undoData.size={width:e.cssMaxWidth,height:e.cssMaxHeight},e.setCssMaxDimension(t),e.adjustCanvasDimension(),r()})},undo:function(e){return e.setCssMaxDimension(this.undoData.size),e.adjustCanvasDimension(),s.default.resolve()}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(1),s=r(a),u=s.default.componentNames,c=s.default.commandNames,l=u.ROTATION,f={name:c.ROTATE_IMAGE,execute:function(e,t,n){var r=e.getComponent(l);return this.undoData.angle=r.getCurrentAngle(),r[t](n)},undo:function(e){var t=e.getComponent(l),n=this.undoData.angle;return t.setAngle(n)}};o.default.register(f),e.exports=f},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(3),o=r(i),a=n(2),s=r(a),u=n(1),c=r(u),l=c.default.commandNames,f=c.default.rejectMessages,h={name:l.SET_OBJECT_POSITION,execute:function(e,t,n){var r=e.getObject(t);return r?(this.undoData.objectId=t,this.undoData.props=e.getObjectProperties(t,["left","top"]),e.setObjectPosition(t,n),e.renderAll(),s.default.resolve()):s.default.reject(f.noObject)},undo:function(e){var t=this.undoData,n=t.objectId,r=t.props;return e.setObjectProperties(n,r),e.renderAll(),s.default.resolve()}};o.default.register(h),e.exports=h},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(3),s=r(a),u=n(2),c=r(u),l=n(1),f=r(l),h=f.default.commandNames,d=f.default.rejectMessages,p={name:h.SET_OBJECT_PROPERTIES,execute:function(e,t,n){var r=this,i=e.getObject(t);return i?(this.undoData.props={},o.default.forEachOwnProperties(n,function(e,t){r.undoData.props[t]=i[t]}),e.setObjectProperties(t,n),c.default.resolve()):c.default.reject(d.noObject)},undo:function(e,t){var n=this.undoData.props;return e.setObjectProperties(t,n),c.default.resolve()}};s.default.register(p),e.exports=p},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;ng&&(o.remove(),o.set(this._calcRectDimensionFromPoint(r,i)),t.add(o))}},{key:"_calcRectDimensionFromPoint",value:function(e,t){var n=this.getCanvas(),r=n.getWidth(),i=n.getHeight(),o=this._startX,a=this._startY,s=(0,v.clamp)(e,0,o),u=(0,v.clamp)(t,0,a),c=(0,v.clamp)(e,o,r)-s,l=(0,v.clamp)(t,a,i)-u;return this._withShiftKey&&(c>l?l=c:l>c&&(c=l),o>=e&&(s=o-c),a>=t&&(u=a-l)),{left:s,top:u,width:c,height:l}}},{key:"_onFabricMouseUp",value:function(){var e=this._cropzone,t=this._listeners,n=this.getCanvas();n.setActiveObject(e),n.off({"mouse:move":t.mousemove,"mouse:up":t.mouseup})}},{key:"getCroppedImageData",value:function(e){var t=this.getCanvas(),n=t.contains(this._cropzone);if(!e)return null;n&&this._cropzone.remove();var r={imageName:this.getImageName(),url:t.toDataURL(e)};return n&&t.add(this._cropzone),r}},{key:"getCropzoneRect",value:function(){var e=this._cropzone;return e.isValid()?{left:e.getLeft(),top:e.getTop(),width:e.getWidth(),height:e.getHeight()}:null}},{key:"_onKeyDown",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!0)}},{key:"_onKeyUp",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!1)}}]),t}(f.default);e.exports=_},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function o(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;nn},_getColor:function(e,t,n){var r=[0,0,0,0],i=e.data,o=e.width,a=4,s=(o*n+t)*a;return r[0]=i[s],r[1]=i[s+1],r[2]=i[s+2],r[3]=i[s+3],r}});e.exports=a},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(5),o=r(i),a=n(4),s=r(a),u=n(9),c="tl",l="tr",f="mt",h="ml",d="mr",p="mb",v="bl",g="br",_=s.default.util.createClass(s.default.Rect,{initialize:function(e){e.type="cropzone",this.callSuper("initialize",e),this.on({moving:this._onMoving,scaling:this._onScaling})},_render:function(e){var t=7,n=7;this.callSuper("_render",e);var r=this.flipX?-1:1,i=this.flipY?-1:1,o=r/this.scaleX,a=i/this.scaleY;e.scale(o,a),this._fillOuterRect(e,"rgba(0, 0, 0, 0.55)"),this._strokeBorder(e,"rgb(0, 0, 0)",t),this._strokeBorder(e,"rgb(255, 255, 255)",t,n),e.scale(1/o,1/a)},_fillOuterRect:function(e,t){var n=this._getCoordinates(e),r=n.x,i=n.y;e.save(),e.fillStyle=t,e.beginPath(),e.moveTo(r[0]-1,i[0]-1),e.lineTo(r[3]+1,i[0]-1),e.lineTo(r[3]+1,i[3]+1),e.lineTo(r[0]-1,i[3]-1),e.lineTo(r[0]-1,i[0]-1),e.closePath(),e.moveTo(r[1],i[1]),e.lineTo(r[1],i[2]),e.lineTo(r[2],i[2]),e.lineTo(r[2],i[1]),e.lineTo(r[1],i[1]),e.closePath(),e.fill(),e.restore()},_getCoordinates:function(e){var t=this.getWidth(),n=this.getHeight(),r=t/2,i=n/2,a=this.getLeft(),s=this.getTop(),u=e.canvas;return{x:o.default.map([-(r+a),-r,r,r+(u.width-a-t)],Math.ceil),y:o.default.map([-(i+s),-i,i,i+(u.height-s-n)],Math.ceil)}},_strokeBorder:function(e,t,n,r){var i=this.getWidth()/2,o=this.getHeight()/2;e.save(),e.strokeStyle=t,e.setLineDash&&e.setLineDash([n,n]),r&&(e.lineDashOffset=r), -e.beginPath(),e.moveTo(-i,-o),e.lineTo(i,-o),e.lineTo(i,o),e.lineTo(-i,o),e.lineTo(-i,-o),e.stroke(),e.restore()},_onMoving:function(){var e=this.getLeft(),t=this.getTop(),n=this.getWidth(),r=this.getHeight(),i=this.canvas.getWidth()-n,o=this.canvas.getHeight()-r;this.setLeft((0,u.clamp)(e,0,i)),this.setTop((0,u.clamp)(t,0,o))},_onScaling:function(e){var t=this.canvas.getPointer(e.e),n=this._calcScalingSizeFromPointer(t);this.scale(1).set(n)},_calcScalingSizeFromPointer:function(e){var t=e.x,n=e.y,r=this._calcTopLeftScalingSizeFromPointer(t,n),i=this._calcBottomRightScalingSizeFromPointer(t,n);return this._makeScalingSettings(r,i)},_calcTopLeftScalingSizeFromPointer:function(e,t){var n=this.getHeight()+this.top,r=this.getWidth()+this.left,i=(0,u.clamp)(t,0,n-1),o=(0,u.clamp)(e,0,r-1);return{top:i,left:o,width:r-o,height:n-i}},_calcBottomRightScalingSizeFromPointer:function(e,t){var n=this.canvas,r=n.width,i=n.height,o=this.left,a=this.top;return{width:(0,u.clamp)(e,o+1,r)-o,height:(0,u.clamp)(t,a+1,i)-a}},_makeScalingSettings:function(e,t){var n=e.width,r=e.height,i=t.height,o=t.width,a=e.left,s=e.top,u=void 0;switch(this.__corner){case c:u=e;break;case l:u={width:o,height:r,top:s};break;case v:u={width:n,height:i,left:a};break;case g:u=t;break;case h:u={width:n,left:a};break;case f:u={height:r,top:s};break;case d:u={width:o};break;case p:u={height:i}}return u},isValid:function(){return this.left>=0&&this.top>=0&&this.width>0&&this.height>0}});e.exports=_},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(4),o=r(i),a=o.default.util.createClass(o.default.Image.filters.Convolute,{type:"Emboss",initialize:function(){var e=[1,1,1,1,.7,-1,-1,-1,-1];this.matrix=e}});e.exports=a},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}var i=n(4),o=r(i),a=o.default.util.createClass(o.default.Image.filters.Mask,{applyTo:function(e){if(this.mask){var t=e.width,n=e.height,r=this._createCanvasOfMask(t,n),i=e.getContext("2d"),o=r.getContext("2d"),a=i.getImageData(0,0,t,n);this._drawMask(o,e,i),this._mapData(o,a,t,n),i.putImageData(a,0,0)}},_createCanvasOfMask:function(e,t){var n=o.default.util.createCanvasElement();return n.width=e,n.height=t,n},_drawMask:function(e){var t=this.mask,n=t.getElement(),r=t.getLeft(),i=t.getTop(),o=t.getAngle();e.save(),e.translate(r,i),e.rotate(o*Math.PI/180),e.scale(t.scaleX,t.scaleY),e.drawImage(n,-n.width/2,-n.height/2),e.restore()},_mapData:function(e,t,n,r){for(var i=t.data,o=e.getImageData(0,0,n,r).data,a=this.channel,s=t.width*t.height*4,u=0;uu?"right":"left",originY:i>c?"bottom":"top"}}function i(e){return"center"===e.getOriginX()&&"center"===e.getOriginY()}function o(e,t){var n=t.getPointByOrigin("center","center"),i=-t.getAngle(),o=r(n,e,i),a=o.originX,s=o.originY,u=t.getPointByOrigin(a,s),c=t.getLeft()-(n.x-u.x),l=t.getTop()-(n.x-u.y);t.set({originX:a,originY:s,left:c,top:l}),t.setCoords()}function a(e,t){var n=t.startPoint,i=-t.getAngle(),o=r(n,e,i),a=o.originX,s=o.originY;t.setPositionByOrigin(n,a,s)}function s(e){var t=e.type,n=e.scaleX,r=e.scaleY,i=l[t],o=e[i.w]*n,a=e[i.h]*r;if(e.isRegular){var s=Math.max(n,r);o=e[i.w]*s,a=e[i.h]*s}var u={hasControls:!1,hasBorders:!1,scaleX:1,scaleY:1};u[i.w]=o,u[i.h]=a,e.set(u)}function u(e,t){var n=t.type,r=t.strokeWidth,i=t.startPoint,o=c[n],a=l[n],s=!("triangle"!==t.type),u={},f=Math.abs(i.x-e.x)/o,h=Math.abs(i.y-e.y)/o;f>r&&(f-=r/o),h>r&&(h-=r/o),t.isRegular&&(f=h=Math.max(f,h),s&&(h=Math.sqrt(3)/2*f)),u[a.w]=f,u[a.h]=h,t.set(u)}var c={rect:1,circle:2,triangle:1},l={rect:{w:"width",h:"height"},circle:{w:"rx",h:"ry"},triangle:{w:"width",h:"height"}};e.exports={setOrigins:function(e){var t=e.getPointByOrigin("left","top"),n=e.getPointByOrigin("right","top"),r=e.getPointByOrigin("right","bottom"),i=e.getPointByOrigin("left","bottom");e.origins={lt:t,rt:n,rb:r,lb:i}},resize:function(e,t,r){i(e)&&(o(t,e),n(e)),r?s(e,t):u(t,e),a(t,e)},adjustOriginToCenter:function(e){var t=e.getPointByOrigin("center","center"),n=e.getOriginX(),r=e.getOriginY(),i=e.getPointByOrigin(n,r),o=e.getLeft()+(t.x-i.x),a=e.getTop()+(t.y-i.y);e.set({hasControls:!0,hasBorders:!0,originX:"center",originY:"center",left:o,top:a}),e.setCoords()}}},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{default:e}}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var o=function(){function e(e,t){for(var n=0;n1?n-1:0),i=1;il;)if(s=u[l++],s!=s)return!0}else for(;c>l;l++)if((e||l in u)&&u[l]===n)return e||l||0;return!e&&-1}}},function(e,t,n){var r=n(17),i=n(94),o=n(93),a=n(10),s=n(39),u=n(112),c={},l={},t=e.exports=function(e,t,n,f,h){var d,p,v,g,_=h?function(){return e}:u(e),y=r(n,f,t?2:1),m=0;if("function"!=typeof _)throw TypeError(e+" is not iterable!");if(o(_)){for(d=s(e.length);d>m;m++)if(g=t?y(a(p=e[m])[0],p[1]):y(e[m]),g===c||g===l)return g}else for(v=_.call(e);!(p=v.next()).done;)if(g=i(v,y,p.value,t),g===c||g===l)return g};t.BREAK=c,t.RETURN=l},function(e,t,n){e.exports=!n(14)&&!n(32)(function(){return 7!=Object.defineProperty(n(23)("div"),"a",{get:function(){return 7}}).a})},function(e,t){e.exports=function(e,t,n){var r=void 0===n;switch(t.length){case 0:return r?e():e.call(n);case 1:return r?e(t[0]):e.call(n,t[0]);case 2:return r?e(t[0],t[1]):e.call(n,t[0],t[1]);case 3:return r?e(t[0],t[1],t[2]):e.call(n,t[0],t[1],t[2]);case 4:return r?e(t[0],t[1],t[2],t[3]):e.call(n,t[0],t[1],t[2],t[3])}return e.apply(n,t)}},function(e,t,n){var r=n(16);e.exports=Object("z").propertyIsEnumerable(0)?Object:function(e){return"String"==r(e)?e.split(""):Object(e)}},function(e,t,n){var r=n(15),i=n(6)("iterator"),o=Array.prototype;e.exports=function(e){return void 0!==e&&(r.Array===e||o[i]===e)}},function(e,t,n){var r=n(10);e.exports=function(e,t,n,i){try{return i?t(r(n)[0],n[1]):t(n)}catch(t){var o=e.return;throw void 0!==o&&r(o.call(e)),t}}},function(e,t,n){"use strict";var r=n(99),i=n(36),o=n(24),a={};n(11)(a,n(6)("iterator"),function(){return this}),e.exports=function(e,t,n){e.prototype=r(a,{next:i(1,n)}),o(e,t+" Iterator")}},function(e,t,n){var r=n(6)("iterator"),i=!1;try{var o=[7][r]();o.return=function(){i=!0},Array.from(o,function(){throw 2})}catch(e){}e.exports=function(e,t){if(!t&&!i)return!1;var n=!1;try{var o=[7],a=o[r]();a.next=function(){return{done:n=!0}},o[r]=function(){return a},e(o)}catch(e){}return n}},function(e,t){e.exports=function(e,t){return{value:t,done:!!e}}},function(e,t,n){var r=n(8),i=n(38).set,o=r.MutationObserver||r.WebKitMutationObserver,a=r.process,s=r.Promise,u="process"==n(16)(a);e.exports=function(){var e,t,n,c=function(){var r,i;for(u&&(r=a.domain)&&r.exit();e;){i=e.fn,e=e.next;try{i()}catch(r){throw e?n():t=void 0,r}}t=void 0,r&&r.enter()};if(u)n=function(){a.nextTick(c)};else if(o){var l=!0,f=document.createTextNode("");new o(c).observe(f,{characterData:!0}),n=function(){f.data=l=!l}}else if(s&&s.resolve){var h=s.resolve();n=function(){h.then(c)}}else n=function(){i.call(r,c)};return function(r){var i={fn:r,next:void 0};t&&(t.next=i),e||(e=i,n()),t=i}}},function(e,t,n){var r=n(10),i=n(100),o=n(30),a=n(25)("IE_PROTO"),s=function(){},u="prototype",c=function(){var e,t=n(23)("iframe"),r=o.length,i="<",a=">";for(t.style.display="none",n(33).appendChild(t),t.src="javascript:",e=t.contentWindow.document,e.open(),e.write(i+"script"+a+"document.F=Object"+i+"/script"+a),e.close(),c=e.F;r--;)delete c[u][o[r]];return c()};e.exports=Object.create||function(e,t){var n;return null!==e?(s[u]=r(e),n=new s,s[u]=null,n[a]=e):n=c(),void 0===t?n:i(n,t)}},function(e,t,n){var r=n(20),i=n(10),o=n(103);e.exports=n(14)?Object.defineProperties:function(e,t){i(e);for(var n,a=o(t),s=a.length,u=0;s>u;)r.f(e,n=a[u++],t[n]);return e}},function(e,t,n){var r=n(18),i=n(110),o=n(25)("IE_PROTO"),a=Object.prototype;e.exports=Object.getPrototypeOf||function(e){return e=i(e),r(e,o)?e[o]:"function"==typeof e.constructor&&e instanceof e.constructor?e.constructor.prototype:e instanceof Object?a:null}},function(e,t,n){var r=n(18),i=n(27),o=n(88)(!1),a=n(25)("IE_PROTO");e.exports=function(e,t){var n,s=i(e),u=0,c=[];for(n in s)n!=a&&r(s,n)&&c.push(n);for(;t.length>u;)r(s,n=t[u++])&&(~o(c,n)||c.push(n));return c}},function(e,t,n){var r=n(102),i=n(30);e.exports=Object.keys||function(e){return r(e,i)}},function(e,t,n){var r=n(11);e.exports=function(e,t,n){for(var i in t)n&&e[i]?e[i]=t[i]:r(e,i,t[i]);return e}},function(e,t,n){e.exports=n(11)},function(e,t,n){"use strict";var r=n(8),i=n(13),o=n(20),a=n(14),s=n(6)("species");e.exports=function(e){var t="function"==typeof i[e]?i[e]:r[e];a&&t&&!t[s]&&o.f(t,s,{configurable:!0,get:function(){return this}})}},function(e,t,n){var r=n(10),i=n(21),o=n(6)("species");e.exports=function(e,t){var n,a=r(e).constructor;return void 0===a||void 0==(n=r(a)[o])?t:i(n)}},function(e,t,n){var r=n(26),i=n(22);e.exports=function(e){return function(t,n){var o,a,s=String(i(t)),u=r(n),c=s.length;return u<0||u>=c?e?"":void 0:(o=s.charCodeAt(u),o<55296||o>56319||u+1===c||(a=s.charCodeAt(u+1))<56320||a>57343?e?s.charAt(u):o:e?s.slice(u,u+2):(o-55296<<10)+(a-56320)+65536); -}}},function(e,t,n){var r=n(26),i=Math.max,o=Math.min;e.exports=function(e,t){return e=r(e),e<0?i(e+t,0):o(e,t)}},function(e,t,n){var r=n(22);e.exports=function(e){return Object(r(e))}},function(e,t,n){var r=n(19);e.exports=function(e,t){if(!r(e))return e;var n,i;if(t&&"function"==typeof(n=e.toString)&&!r(i=n.call(e)))return i;if("function"==typeof(n=e.valueOf)&&!r(i=n.call(e)))return i;if(!t&&"function"==typeof(n=e.toString)&&!r(i=n.call(e)))return i;throw TypeError("Can't convert object to primitive value")}},function(e,t,n){var r=n(29),i=n(6)("iterator"),o=n(15);e.exports=n(13).getIteratorMethod=function(e){if(void 0!=e)return e[i]||e["@@iterator"]||o[r(e)]}},function(e,t,n){"use strict";var r=n(86),i=n(97),o=n(15),a=n(27);e.exports=n(34)(Array,"Array",function(e,t){this._t=a(e),this._i=0,this._k=t},function(){var e=this._t,t=this._k,n=this._i++;return!e||n>=e.length?(this._t=void 0,i(1)):"keys"==t?i(0,n):"values"==t?i(0,e[n]):i(0,[n,e[n]])},"values"),o.Arguments=o.Array,r("keys"),r("values"),r("entries")},function(e,t){},function(e,t,n){"use strict";var r,i,o,a=n(35),s=n(8),u=n(17),c=n(29),l=n(31),f=n(19),h=n(21),d=n(87),p=n(89),v=n(107),g=n(38).set,_=n(98)(),y="Promise",m=s.TypeError,b=s.process,O=s[y],b=s.process,k="process"==c(b),w=function(){},C=!!function(){try{var e=O.resolve(1),t=(e.constructor={})[n(6)("species")]=function(e){e(w,w)};return(k||"function"==typeof PromiseRejectionEvent)&&e.then(w)instanceof t}catch(e){}}(),E=function(e,t){return e===t||e===O&&t===o},j=function(e){var t;return!(!f(e)||"function"!=typeof(t=e.then))&&t},x=function(e){return E(O,e)?new T(e):new i(e)},T=i=function(e){var t,n;this.promise=new e(function(e,r){if(void 0!==t||void 0!==n)throw m("Bad Promise constructor");t=e,n=r}),this.resolve=h(t),this.reject=h(n)},M=function(e){try{e()}catch(e){return{error:e}}},S=function(e,t){if(!e._n){e._n=!0;var n=e._c;_(function(){for(var r=e._v,i=1==e._s,o=0,a=function(t){var n,o,a=i?t.ok:t.fail,s=t.resolve,u=t.reject,c=t.domain;try{a?(i||(2==e._h&&D(e),e._h=1),a===!0?n=r:(c&&c.enter(),n=a(r),c&&c.exit()),n===t.promise?u(m("Promise-chain cycle")):(o=j(n))?o.call(n,s,u):s(n)):u(r)}catch(e){u(e)}};n.length>o;)a(n[o++]);e._c=[],e._n=!1,t&&!e._h&&P(e)})}},P=function(e){g.call(s,function(){var t,n,r,i=e._v;if(A(e)&&(t=M(function(){k?b.emit("unhandledRejection",i,e):(n=s.onunhandledrejection)?n({promise:e,reason:i}):(r=s.console)&&r.error&&r.error("Unhandled promise rejection",i)}),e._h=k||A(e)?2:1),e._a=void 0,t)throw t.error})},A=function(e){if(1==e._h)return!1;for(var t,n=e._a||e._c,r=0;n.length>r;)if(t=n[r++],t.fail||!A(t.promise))return!1;return!0},D=function(e){g.call(s,function(){var t;k?b.emit("rejectionHandled",e):(t=s.onrejectionhandled)&&t({promise:e,reason:e._v})})},I=function(e){var t=this;t._d||(t._d=!0,t=t._w||t,t._v=e,t._s=2,t._a||(t._a=t._c.slice()),S(t,!0))},N=function(e){var t,n=this;if(!n._d){n._d=!0,n=n._w||n;try{if(n===e)throw m("Promise can't be resolved itself");(t=j(e))?_(function(){var r={_w:n,_d:!1};try{t.call(e,u(N,r,1),u(I,r,1))}catch(e){I.call(r,e)}}):(n._v=e,n._s=1,S(n,!1))}catch(e){I.call({_w:n,_d:!1},e)}}};C||(O=function(e){d(this,O,y,"_h"),h(e),r.call(this);try{e(u(N,this,1),u(I,this,1))}catch(e){I.call(this,e)}},r=function(e){this._c=[],this._a=void 0,this._s=0,this._d=!1,this._v=void 0,this._h=0,this._n=!1},r.prototype=n(104)(O.prototype,{then:function(e,t){var n=x(v(this,O));return n.ok="function"!=typeof e||e,n.fail="function"==typeof t&&t,n.domain=k?b.domain:void 0,this._c.push(n),this._a&&this._a.push(n),this._s&&S(this,!1),n.promise},catch:function(e){return this.then(void 0,e)}}),T=function(){var e=new r;this.promise=e,this.resolve=u(N,e,1),this.reject=u(I,e,1)}),l(l.G+l.W+l.F*!C,{Promise:O}),n(24)(O,y),n(106)(y),o=n(13)[y],l(l.S+l.F*!C,y,{reject:function(e){var t=x(this),n=t.reject;return n(e),t.promise}}),l(l.S+l.F*(a||!C),y,{resolve:function(e){if(e instanceof O&&E(e.constructor,this))return e;var t=x(this),n=t.resolve;return n(e),t.promise}}),l(l.S+l.F*!(C&&n(96)(function(e){O.all(e).catch(w)})),y,{all:function(e){var t=this,n=x(t),r=n.resolve,i=n.reject,o=M(function(){var n=[],o=0,a=1;p(e,!1,function(e){var s=o++,u=!1;n.push(void 0),a++,t.resolve(e).then(function(e){u||(u=!0,n[s]=e,--a||r(n))},i)}),--a||r(n)});return o&&i(o.error),n.promise},race:function(e){var t=this,n=x(t),r=n.reject,i=M(function(){p(e,!1,function(e){t.resolve(e).then(n.resolve,r)})});return i&&r(i.error),n.promise}})},function(e,t,n){"use strict";var r=n(108)(!0);n(34)(String,"String",function(e){this._t=String(e),this._i=0},function(){var e,t=this._t,n=this._i;return n>=t.length?{value:void 0,done:!0}:(e=r(t,n),this._i+=e.length,{value:e,done:!1})})},function(e,t,n){n(113);for(var r=n(8),i=n(11),o=n(15),a=n(6)("toStringTag"),s=["NodeList","DOMTokenList","MediaList","StyleSheetList","CSSRuleList"],u=0;u<5;u++){var c=s[u],l=r[c],f=l&&l.prototype;f&&!f[a]&&i(f,a,c),o[c]=o.Array}}])}); \ No newline at end of file +!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("tui-code-snippet"),require("fabric/dist/fabric.require")):"function"==typeof define&&define.amd?define(["tui-code-snippet","fabric/dist/fabric.require"],t):"object"==typeof exports?exports.ImageEditor=t(require("tui-code-snippet"),require("fabric/dist/fabric.require")):(e.tui=e.tui||{},e.tui.ImageEditor=t(e.tui&&e.tui.util,e.fabric))}(this,function(e,t){return function(e){function t(i){if(n[i])return n[i].exports;var o=n[i]={exports:{},id:i,loaded:!1};return e[i].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var n={};return t.m=e,t.c=n,t.p="dist",t(0)}([function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}n(91);var o=n(88),r=i(o);n(148),n(45),n(46),n(47),n(48),n(49),n(50),n(51),n(52),n(53),n(54),n(55),n(56),n(57),n(58),n(59),n(60),n(61),n(63),n(62),e.exports=r.default},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(5),r=i(o);e.exports={componentNames:r.default.keyMirror("IMAGE_LOADER","CROPPER","FLIP","ROTATION","FREE_DRAWING","LINE","TEXT","ICON","FILTER","SHAPE"),commandNames:{CLEAR_OBJECTS:"clearObjects",LOAD_IMAGE:"loadImage",FLIP_IMAGE:"flip",ROTATE_IMAGE:"rotate",ADD_OBJECT:"addObject",REMOVE_OBJECT:"removeObject",APPLY_FILTER:"applyFilter",REMOVE_FILTER:"removeFilter",ADD_ICON:"addIcon",CHANGE_ICON_COLOR:"changeIconColor",ADD_SHAPE:"addShape",CHANGE_SHAPE:"changeShape",ADD_TEXT:"addText",CHANGE_TEXT:"changeText",CHANGE_TEXT_STYLE:"changeTextStyle",ADD_IMAGE_OBJECT:"addImageObject",RESIZE_CANVAS_DIMENSION:"resizeCanvasDimension",SET_OBJECT_PROPERTIES:"setObjectProperties",SET_OBJECT_POSITION:"setObjectPosition"},eventNames:{OBJECT_ACTIVATED:"objectActivated",OBJECT_MOVED:"objectMoved",OBJECT_SCALED:"objectScaled",OBJECT_CREATED:"objectCreated",TEXT_EDITING:"textEditing",TEXT_CHANGED:"textChanged",ICON_CREATE_RESIZE:"iconCreateResize",ICON_CREATE_END:"iconCreateEnd",ADD_TEXT:"addText",ADD_OBJECT:"addObject",ADD_OBJECT_AFTER:"addObjectAfter",MOUSE_DOWN:"mousedown",MOUSE_UP:"mouseup",MOUSE_MOVE:"mousemove",REDO_STACK_CHANGED:"redoStackChanged",UNDO_STACK_CHANGED:"undoStackChanged",SELECTION_CLEARED:"selectionCleared",SELECTION_CREATED:"selectionCreated"},drawingModes:r.default.keyMirror("NORMAL","CROPPER","FREE_DRAWING","LINE_DRAWING","TEXT","SHAPE"),keyCodes:{Z:90,Y:89,SHIFT:16,BACKSPACE:8,DEL:46},fObjectOptions:{SELECTION_STYLE:{borderColor:"red",cornerColor:"green",cornerSize:10,originX:"center",originY:"center",transparentCorners:!1}},rejectMessages:{flip:"The flipX and flipY setting values are not changed.",rotation:"The current angle is same the old angle.",loadImage:"The background image is empty.",isLock:"The executing command state is locked.",undo:"The promise of undo command is reject.",redo:"The promise of redo command is reject.",invalidDrawingMode:"This operation is not supported in the drawing mode",invalidParameters:"Invalid parameters",noActiveObject:"There is no active object.",unsupportedType:"Unsupported object type",noObject:"The object is not in canvas.",addedObject:"The object is already added."},defaultIconPath:{"icon-arrow":"M40 12V0l24 24-24 24V36H0V12h40z","icon-arrow-2":"M49,32 H3 V22 h46 l-18,-18 h12 l23,23 L43,50 h-12 l18,-18 z ","icon-arrow-3":"M43.349998,27 L17.354,53 H1.949999 l25.996,-26 L1.949999,1 h15.404 L43.349998,27 z ","icon-star":"M35,54.557999 l-19.912001,10.468 l3.804,-22.172001 l-16.108,-15.7 l22.26,-3.236 L35,3.746 l9.956,20.172001 l22.26,3.236 l-16.108,15.7 l3.804,22.172001 z ","icon-star-2":"M17,31.212 l-7.194,4.08 l-4.728,-6.83 l-8.234,0.524 l-1.328,-8.226 l-7.644,-3.14 l2.338,-7.992 l-5.54,-6.18 l5.54,-6.176 l-2.338,-7.994 l7.644,-3.138 l1.328,-8.226 l8.234,0.522 l4.728,-6.83 L17,-24.312 l7.194,-4.08 l4.728,6.83 l8.234,-0.522 l1.328,8.226 l7.644,3.14 l-2.338,7.992 l5.54,6.178 l-5.54,6.178 l2.338,7.992 l-7.644,3.14 l-1.328,8.226 l-8.234,-0.524 l-4.728,6.83 z ","icon-polygon":"M3,31 L19,3 h32 l16,28 l-16,28 H19 z ","icon-location":"M24 62C8 45.503 0 32.837 0 24 0 10.745 10.745 0 24 0s24 10.745 24 24c0 8.837-8 21.503-24 38zm0-28c5.523 0 10-4.477 10-10s-4.477-10-10-10-10 4.477-10 10 4.477 10 10 10z","icon-heart":"M49.994999,91.349998 l-6.96,-6.333 C18.324001,62.606995 2.01,47.829002 2.01,29.690998 C2.01,14.912998 13.619999,3.299999 28.401001,3.299999 c8.349,0 16.362,5.859 21.594,12 c5.229,-6.141 13.242001,-12 21.591,-12 c14.778,0 26.390999,11.61 26.390999,26.390999 c0,18.138 -16.314001,32.916 -41.025002,55.374001 l-6.96,6.285 z ","icon-bubble":"M44 48L34 58V48H12C5.373 48 0 42.627 0 36V12C0 5.373 5.373 0 12 0h40c6.627 0 12 5.373 12 12v24c0 6.627-5.373 12-12 12h-8z"},defaultRotateRangeValus:{realTimeEvent:!0,min:-360,max:360,value:0},defaultDrawRangeValus:{min:5,max:30,value:12},defaultShapeStrokeValus:{realTimeEvent:!1,min:2,max:300,value:3},defaultTextRangeValus:{realTimeEvent:!0,min:10,max:100,value:50},defaultFilterRangeValus:{tintOpacityRange:{min:0,max:1,value:.7},removewhiteThresholdRange:{min:0,max:255,value:60},removewhiteDistanceRange:{min:0,max:255,value:10},gradientTransparencyRange:{min:0,max:255,value:100},brightnessRange:{min:-255,max:255,value:100},noiseRange:{min:0,max:1e3,value:100},pixelateRange:{min:2,max:20,value:4},colorfilterThresholeRange:{min:0,max:255,value:45}}}},function(e,t,n){n(144),n(146),n(147),n(145),e.exports=n(16).Promise},function(t,n){t.exports=e},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e){var t=l[e];if(t){for(var n=arguments.length,i=Array(n>1?n-1:0),o=1;on&&(i=t,t=n,n=i),r(t,o(e,n))},keyMirror:function(){for(var e={},t=arguments.length,n=Array(t),o=0;o1&&void 0!==arguments[1]?arguments[1]:"#7e7e7e",i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"up";o(this,e);var r=t.getAttribute("title");this._show=!1,this._toggleDirection=i,this._makePickerButtonElement(t,n),this._makePickerLayerElement(t,r),this._color=n,this.picker=u.default.create({container:this.pickerElement,preset:d,color:n}),this._addEvent(t)}return r(e,[{key:"_changeColorElement",value:function(e){e?(this.colorElement.classList.remove("transparent"),this.colorElement.style.backgroundColor=e):(this.colorElement.style.backgroundColor="#fff",this.colorElement.classList.add("transparent"))}},{key:"_makePickerButtonElement",value:function(e,t){e.classList.add("tui-image-editor-button"),this.colorElement=document.createElement("div"),this.colorElement.className="color-picker-value",t?this.colorElement.style.backgroundColor=t:this.colorElement.classList.add("transparent")}},{key:"_makePickerLayerElement",value:function(e,t){var n=document.createElement("label"),i=document.createElement("div");this.pickerControl=document.createElement("div"),this.pickerControl.className="color-picker-control",this.pickerElement=document.createElement("div"),this.pickerElement.className="color-picker",n.innerHTML=t,i.className="triangle",this.pickerControl.appendChild(this.pickerElement),this.pickerControl.appendChild(i),e.appendChild(this.pickerControl),e.appendChild(this.colorElement),e.appendChild(n),this._setPickerControlPosition()}},{key:"_addEvent",value:function(e){var t=this;this.picker.on("selectColor",function(e){t._changeColorElement(e.color),t._color=e.color,t.fire("change",e.color)}),e.addEventListener("click",function(e){t._show=!t._show,t.pickerControl.style.display=t._show?"block":"none",e.stopPropagation()}),document.body.addEventListener("click",function(){t._show=!1,t.pickerControl.style.display="none"})}},{key:"_setPickerControlPosition",value:function(){var e=this.pickerControl.style,t=(0,l.toInteger)(window.getComputedStyle(this.pickerControl,null).width)/2-20,n=((0,l.toInteger)(window.getComputedStyle(this.pickerControl,null).height)+12)*-1;"down"===this._toggleDirection&&(n=30),e.top=n+"px",e.left="-"+t+"px"}},{key:"color",get:function(){return this._color},set:function(e){this._color=e,this._changeColorElement(e)}}]),e}();s.default.CustomEvents.mixin(h),t.default=h},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var r=function(){function e(e,t){for(var n=0;n1&&void 0!==arguments[1]?arguments[1]:{};o(this,e),this._value=n.value||0,this.rangeElement=t,this._drawRangeElement(),this.rangeWidth=(0,l.toInteger)(window.getComputedStyle(t,null).width)-12,this._min=n.min||0,this._max=n.max||100,this._absMax=this._min*-1+this._max,this.realTimeEvent=n.realTimeEvent||!1,this._addClickEvent(),this._addDragEvent(),this.value=n.value,this.trigger("change")}return r(e,[{key:"trigger",value:function(e){this.fire(e,this._value)}},{key:"_drawRangeElement",value:function(){this.rangeElement.classList.add("tui-image-editor-range"),this.bar=document.createElement("div"),this.bar.className="tui-image-editor-virtual-range-bar",this.subbar=document.createElement("div"),this.subbar.className="tui-image-editor-virtual-range-subbar",this.pointer=document.createElement("div"),this.pointer.className="tui-image-editor-virtual-range-pointer",this.bar.appendChild(this.subbar),this.bar.appendChild(this.pointer),this.rangeElement.appendChild(this.bar)}},{key:"_addClickEvent",value:function(){var e=this;this.rangeElement.addEventListener("click",function(t){if(t.stopPropagation(),"tui-image-editor-range"===t.target.className){var n=t.offsetX,i=n/e.rangeWidth,o=e._absMax*i+e._min;e.pointer.style.left=i*e.rangeWidth+"px",e.subbar.style.right=(1-i)*e.rangeWidth+"px",e._value=o,e.fire("change",o)}})}},{key:"_addDragEvent",value:function(){var e=this;this.pointer.addEventListener("mousedown",function(t){e.firstPosition=t.screenX,e.firstLeft=(0,l.toInteger)(e.pointer.style.left)||0,e.dragEventHandler={changeAngle:e._changeAngle.bind(e),stopChangingAngle:e._stopChangingAngle.bind(e)},document.addEventListener("mousemove",e.dragEventHandler.changeAngle),document.addEventListener("mouseup",e.dragEventHandler.stopChangingAngle)})}},{key:"_changeAngle",value:function(e){var t=e.screenX,n=t-this.firstPosition,i=this.firstLeft+n;i=i>this.rangeWidth?this.rangeWidth:i,i=i<0?0:i,this.pointer.style.left=i+"px",this.subbar.style.right=this.rangeWidth-i+"px";var o=i/this.rangeWidth,r=this._absMax*o+this._min;this._value=r,this.realTimeEvent&&this.fire("change",r)}},{key:"_stopChangingAngle",value:function(){this.fire("change",this._value),document.removeEventListener("mousemove",this.dragEventHandler.changeAngle),document.removeEventListener("mouseup",this.dragEventHandler.stopChangingAngle)}},{key:"max",set:function(e){this._max=e,this._absMax=this._min*-1+this._max,this.value=this._value},get:function(){return this._max}},{key:"value",get:function(){return this._value},set:function(e){var t=e-this._min,n=t*this.rangeWidth/this._absMax;this.rangeWidth0?i:n)(e)}},function(e,t,n){var i=n(122),o=n(25);e.exports=function(e){return i(o(e))}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(3),r=i(o),a=n(5),s=(0,a.keyMirror)("UN_IMPLEMENTATION","NO_COMPONENT_NAME"),l={UN_IMPLEMENTATION:"Should implement a method: ",NO_COMPONENT_NAME:"Should set a component name"},c={UN_IMPLEMENTATION:function(e){return l.UN_IMPLEMENTATION+e},NO_COMPONENT_NAME:function(){return l.NO_COMPONENT_NAME}};e.exports={types:r.default.extend({},s),create:function(e){e=e.toLowerCase();for(var t=c[e],n=arguments.length,i=Array(n>1?n-1:0),o=1;on;)t.push(arguments[n++]);return v[++g]=function(){s("function"==typeof e?e:Function(e),t)},i(g),g},f=function(e){delete v[e]},"process"==n(19)(d)?i=function(e){d.nextTick(a(b,e,1))}:p?(o=new p,r=o.port2,o.port1.onmessage=y,i=a(r.postMessage,r,1)):u.addEventListener&&"function"==typeof postMessage&&!u.importScripts?(i=function(e){u.postMessage(e+"","*")},u.addEventListener("message",y,!1)):i=m in c("script")?function(e){l.appendChild(c("script"))[m]=function(){l.removeChild(this),b.call(e)}}:function(e){setTimeout(a(b,e,1),0)}),e.exports={set:h,clear:f}},function(e,t,n){var i=n(29),o=Math.min;e.exports=function(e){return e>0?o(i(e),9007199254740991):0}},function(e,t){var n=0,i=Math.random();e.exports=function(e){return"Symbol(".concat(void 0===e?"":e,")_",(++n+i).toString(36))}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0});var o=n(3),r=n(5),a=i(r),s=n(86),l=i(s);t.default={getActions:function(){return{main:this._mainAction(),shape:this._shapeAction(),crop:this._cropAction(),flip:this._flipAction(),rotate:this._rotateAction(),text:this._textAction(),mask:this._maskAction(),draw:this._drawAction(),icon:this._iconAction(),filter:this._filterAction()}},_mainAction:function(){var e=this,t=function(){"crop"===e.ui.submenu&&(e.stopDrawingMode(),e.ui.changeMenu("crop"))};return(0,o.extend)({initLoadImage:function(n,i){return e.loadImageFromURL(n,i).then(function(i){t(),e.ui.initializeImgUrl=n,e.ui.resizeEditor({imageSize:i}),e.clearUndoStack()})},undo:function(){e.isEmptyUndoStack()||(t(),e.undo())},redo:function(){e.isEmptyRedoStack()||(t(),e.redo())},reset:function(){t(),e.loadImageFromURL(e.ui.initializeImgUrl,"resetImage").then(function(n){t(),e.ui.resizeEditor({imageSize:n}),e.clearUndoStack()})},delete:function(){e.ui.changeDeleteButtonEnabled(!1),t(),e.removeActiveObject(),e.activeObjectId=null},deleteAll:function(){t(),e.clearObjects(),e.ui.changeDeleteButtonEnabled(!1),e.ui.changeDeleteAllButtonEnabled(!1)},load:function(n){a.default.isSupportFileApi()||alert("This browser does not support file-api"),e.ui.initializeImgUrl=URL.createObjectURL(n),e.loadImageFromFile(n).then(function(){t(),e.clearUndoStack(),e.ui.resizeEditor()}).catch(function(e){return Promise.reject(e)})},download:function(){var t=e.toDataURL(),n=e.getImageName(),i=void 0,o=void 0,r=void 0;a.default.isSupportFileApi()&&window.saveAs?(i=a.default.base64ToBlob(t),o=i.type.split("/")[1],n.split(".").pop()!==o&&(n+="."+o),saveAs(i,n)):(r=window.open(),r.document.body.innerHTML="")}},this._commonAction())},_iconAction:function(){var e=this,t=void 0,n=void 0,i=void 0,r=void 0,a=void 0,s=void 0,c=void 0;this.on({iconCreateResize:function(t){var n=t.moveOriginPointer,o=(n.x-i)/a,l=(n.y-r)/s;e.setObjectPropertiesQuietly(c,{scaleX:Math.abs(2*o),scaleY:Math.abs(2*l)})},iconCreateEnd:function(){e.ui.icon.clearIconType(),e.changeSelectableAll(!0)}});var u=function(o,l){i=l.x,r=l.y,e.addIcon(t,{left:l.x,top:l.y,fill:n}).then(function(e){c=e.id,a=e.width,s=e.height})};return(0,o.extend)({changeColor:function(t){e.activeObjectId&&e.changeIconColor(e.activeObjectId,t)},addIcon:function(i,o){t=i,n=o,e.changeCursor("crosshair"),e.off("mousedown"),e.once("mousedown",u.bind(e))},cancelAddIcon:function(){e.off("mousedown"),e.ui.icon.clearIconType(),e.changeSelectableAll(!0),e.changeCursor("default")},registDefalutIcons:function(t,n){var i={};i[t]=n,e.registerIcons(i)},registCustomIcon:function(t,n){var i=new l.default;i.imageToSVG(t,function(t){var i=t.match(/path[^>]*d="([^"]*)"/),o=i[1],r={};r[n.name]=o,e.registerIcons(r),e.addIcon(n.name,{left:100,top:100})},l.default.tracerDefaultOption())}},this._commonAction())},_drawAction:function(){var e=this;return(0,o.extend)({setDrawMode:function(t,n){e.stopDrawingMode(),"free"===t?e.startDrawingMode("FREE_DRAWING",n):e.startDrawingMode("LINE_DRAWING",n)},setColor:function(t){e.setBrush({color:t})}},this._commonAction())},_maskAction:function(){var e=this;return(0,o.extend)({loadImageFromURL:function(t,n){return e.loadImageFromURL(e.toDataURL(),"FilterImage").then(function(){e.addImageObject(t).then(function(){URL.revokeObjectURL(n)})})},applyFilter:function(){e.applyFilter("mask",{maskObjId:e.activeObjectId})}},this._commonAction())},_textAction:function(){var e=this;return(0,o.extend)({changeTextStyle:function(t){e.activeObjectId&&e.changeTextStyle(e.activeObjectId,t)}},this._commonAction())},_rotateAction:function(){var e=this;return(0,o.extend)({rotate:function(t){e.rotate(t),e.ui.resizeEditor()},setAngle:function(t){e.setAngle(t),e.ui.resizeEditor()}},this._commonAction())},_shapeAction:function(){var e=this;return(0,o.extend)({changeShape:function(t){e.activeObjectId&&e.changeShape(e.activeObjectId,t)},setDrawingShape:function(t){e.setDrawingShape(t)}},this._commonAction())},_cropAction:function(){var e=this;return(0,o.extend)({crop:function(){var t=e.getCropzoneRect();t&&e.crop(t).then(function(){e.stopDrawingMode(),e.ui.resizeEditor(),e.ui.changeMenu("crop")}).catch(function(e){return Promise.reject(e)})},cancel:function(){e.stopDrawingMode(),e.ui.changeMenu("crop")}},this._commonAction())},_flipAction:function(){var e=this;return(0,o.extend)({flip:function(t){return e[t]()}},this._commonAction())},_filterAction:function(){var e=this;return(0,o.extend)({applyFilter:function(t,n,i){t?e.applyFilter(n,i):e.hasFilter(n)&&e.removeFilter(n)}},this._commonAction())},setReAction:function(){var e=this;this.on({undoStackChanged:function(t){t?(e.ui.changeUndoButtonStatus(!0),e.ui.changeResetButtonStatus(!0)):(e.ui.changeUndoButtonStatus(!1),e.ui.changeResetButtonStatus(!1)),e.ui.resizeEditor()},redoStackChanged:function(t){t?e.ui.changeRedoButtonStatus(!0):e.ui.changeRedoButtonStatus(!1),e.ui.resizeEditor()},objectActivated:function(t){e.activeObjectId=t.id,e.ui.changeDeleteButtonEnabled(!0),e.ui.changeDeleteAllButtonEnabled(!0),"cropzone"===t.type?e.ui.crop.changeApplyButtonStatus(!0):["rect","circle","triangle"].indexOf(t.type)>-1?(e.stopDrawingMode(),"shape"!==e.ui.submenu&&e.ui.changeMenu("shape",!1,!1),e.ui.shape.setShapeStatus({strokeColor:t.stroke,strokeWidth:t.strokeWidth,fillColor:t.fill}),e.ui.shape.setMaxStrokeValue(Math.min(t.width,t.height))):"path"===t.type||"line"===t.type?"draw"!==e.ui.submenu&&(e.ui.changeMenu("draw",!1,!1),e.ui.draw.changeStandbyMode()):["i-text","text"].indexOf(t.type)>-1?"text"!==e.ui.submenu&&e.ui.changeMenu("text",!1,!1):"icon"===t.type&&(e.stopDrawingMode(),"icon"!==e.ui.submenu&&e.ui.changeMenu("icon",!1,!1),e.ui.icon.setIconPickerColor(t.fill))},addText:function(t){e.addText("Double Click",{position:t.originPosition,styles:{fill:e.ui.text.textColor,fontSize:a.default.toInteger(e.ui.text.fontSize)}}).then(function(){e.changeCursor("default")})},addObjectAfter:function(t){["rect","circle","triangle"].indexOf(t.type)>-1&&(e.ui.shape.setMaxStrokeValue(Math.min(t.width,t.height)),e.ui.shape.changeStandbyMode())},objectScaled:function(t){if(["i-text","text"].indexOf(t.type)>-1)e.ui.text.fontSize=a.default.toInteger(t.fontSize);else if(["rect","circle","triangle"].indexOf(t.type)>=0){var n=t.width,i=t.height,o=e.ui.shape.getStrokeValue();nv&&(r.remove(),r.set(this._calcRectDimensionFromPoint(i,o)),t.add(r))}},{key:"_calcRectDimensionFromPoint",value:function(e,t){var n=this.getCanvas(),i=n.getWidth(),o=n.getHeight(),r=this._startX,a=this._startY,s=(0,g.clamp)(e,0,r),l=(0,g.clamp)(t,0,a),c=(0,g.clamp)(e,r,i)-s,u=(0,g.clamp)(t,a,o)-l;return this._withShiftKey&&(c>u?u=c:u>c&&(c=u),r>=e&&(s=r-c),a>=t&&(l=a-u)),{left:s,top:l,width:c,height:u}}},{key:"_onFabricMouseUp",value:function(){var e=this._cropzone,t=this._listeners,n=this.getCanvas();n.setActiveObject(e),n.off({"mouse:move":t.mousemove,"mouse:up":t.mouseup})}},{key:"getCroppedImageData",value:function(e){var t=this.getCanvas(),n=t.contains(this._cropzone);if(!e)return null;n&&this._cropzone.remove();var i={imageName:this.getImageName(),url:t.toDataURL(e)};return n&&t.add(this._cropzone),i}},{key:"getCropzoneRect",value:function(){var e=this._cropzone;return e.isValid()?{left:e.getLeft(),top:e.getTop(),width:e.getWidth(),height:e.getHeight()}:null}},{key:"_onKeyDown",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!0)}},{key:"_onKeyUp",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!1)}}]),t}(d.default);e.exports=m},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;nn},_getColor:function(e,t,n){var i=[0,0,0,0],o=e.data,r=e.width,a=4,s=(r*n+t)*a;return i[0]=o[s],i[1]=o[s+1],i[2]=o[s+2],i[3]=o[s+3],i}});e.exports=a},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(3),r=i(o),a=n(6),s=i(a),l=n(5),c="tl",u="tr",d="mt",h="ml",f="mr",p="mb",g="bl",v="br",m=s.default.util.createClass(s.default.Rect,{initialize:function(e,t){e=r.default.extend(e,t),e.type="cropzone",this.callSuper("initialize",e),this.options=e,this.on({moving:this._onMoving,scaling:this._onScaling})},_render:function(e){var t=7,n=7;this.callSuper("_render",e);var i=this.flipX?-1:1,o=this.flipY?-1:1,r=i/this.scaleX,a=o/this.scaleY;e.scale(r,a),this._fillOuterRect(e,"rgba(0, 0, 0, 0.55)"),this.options.lineWidth?this._fillInnerRect(e):(this._strokeBorder(e,"rgb(0, 0, 0)",{lineDashWidth:t}),this._strokeBorder(e,"rgb(255, 255, 255)",{lineDashWidth:t,lineDashOffset:n})),e.scale(1/r,1/a)},_fillOuterRect:function(e,t){var n=this._getCoordinates(e),i=n.x,o=n.y;e.save(),e.fillStyle=t,e.beginPath(),e.moveTo(i[0]-1,o[0]-1),e.lineTo(i[3]+1,o[0]-1),e.lineTo(i[3]+1,o[3]+1),e.lineTo(i[0]-1,o[3]+1),e.lineTo(i[0]-1,o[0]-1),e.closePath(),e.moveTo(i[1],o[1]),e.lineTo(i[1],o[2]),e.lineTo(i[2],o[2]),e.lineTo(i[2],o[1]),e.lineTo(i[1],o[1]),e.closePath(),e.fill(),e.restore()},_fillInnerRect:function(e){var t=this._getCoordinates(e),n=t.x,i=t.y,o=this._caculateInnerPosition(n,(n[2]-n[1])/3),r=this._caculateInnerPosition(i,(i[2]-i[1])/3);e.save(),e.strokeStyle="rgba(255, 255, 255, 0.7)",e.lineWidth=this.options.lineWidth,e.beginPath(),e.moveTo(o[0],r[1]),e.lineTo(o[3],r[1]),e.moveTo(o[0],r[2]),e.lineTo(o[3],r[2]),e.moveTo(o[1],r[0]),e.lineTo(o[1],r[3]),e.moveTo(o[2],r[0]),e.lineTo(o[2],r[3]),e.stroke(),e.closePath(),e.restore()},_caculateInnerPosition:function(e,t){var n=[];return n[0]=e[1],n[1]=e[1]+t,n[2]=e[1]+2*t,n[3]=e[2],n},_getCoordinates:function(e){var t=this.getWidth(),n=this.getHeight(),i=t/2,o=n/2,a=this.getLeft(),s=this.getTop(),l=e.canvas;return{x:r.default.map([-(i+a),-i,i,i+(l.width-a-t)],Math.ceil),y:r.default.map([-(o+s),-o,o,o+(l.height-s-n)],Math.ceil)}},_strokeBorder:function(e,t,n){var i=n.lineDashWidth,o=n.lineDashOffset,r=n.lineWidth,a=this.getWidth()/2,s=this.getHeight()/2;e.save(),e.strokeStyle=t,e.setLineDash&&e.setLineDash([i,i]),o&&(e.lineDashOffset=o),r&&(e.lineWidth=r),e.beginPath(),e.moveTo(-a,-s),e.lineTo(a,-s),e.lineTo(a,s),e.lineTo(-a,s),e.lineTo(-a,-s),e.stroke(),e.restore()},_onMoving:function(){var e=this.getLeft(),t=this.getTop(),n=this.getWidth(),i=this.getHeight(),o=this.canvas.getWidth()-n,r=this.canvas.getHeight()-i;this.setLeft((0,l.clamp)(e,0,o)),this.setTop((0,l.clamp)(t,0,r))},_onScaling:function(e){var t=this.canvas.getPointer(e.e),n=this._calcScalingSizeFromPointer(t);this.scale(1).set(n)},_calcScalingSizeFromPointer:function(e){var t=e.x,n=e.y,i=this._calcTopLeftScalingSizeFromPointer(t,n),o=this._calcBottomRightScalingSizeFromPointer(t,n);return this._makeScalingSettings(i,o)},_calcTopLeftScalingSizeFromPointer:function(e,t){var n=this.getHeight()+this.top,i=this.getWidth()+this.left,o=(0,l.clamp)(t,0,n-1),r=(0,l.clamp)(e,0,i-1);return{top:o,left:r,width:i-r,height:n-o}},_calcBottomRightScalingSizeFromPointer:function(e,t){var n=this.canvas,i=n.width,o=n.height,r=this.left,a=this.top;return{width:(0,l.clamp)(e,r+1,i)-r,height:(0,l.clamp)(t,a+1,o)-a}},_makeScalingSettings:function(e,t){var n=e.width,i=e.height,o=t.height,r=t.width,a=e.left,s=e.top,l=void 0;switch(this.__corner){case c:l=e;break;case u:l={width:r,height:i,top:s};break;case g:l={width:n,height:o,left:a};break;case v:l=t;break;case h:l={width:n,left:a};break;case d:l={height:i,top:s};break;case f:l={width:r};break;case p:l={height:o}}return l},isValid:function(){return this.left>=0&&this.top>=0&&this.width>0&&this.height>0}});e.exports=m},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(6),r=i(o),a=r.default.util.createClass(r.default.Image.filters.Convolute,{type:"Emboss",initialize:function(){var e=[1,1,1,1,.7,-1,-1,-1,-1];this.matrix=e}});e.exports=a},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(6),r=i(o),a=r.default.util.createClass(r.default.Image.filters.Mask,{applyTo:function(e){if(this.mask){var t=e.width,n=e.height,i=this._createCanvasOfMask(t,n),o=e.getContext("2d"),r=i.getContext("2d"),a=o.getImageData(0,0,t,n);this._drawMask(r,e,o),this._mapData(r,a,t,n),o.putImageData(a,0,0)}},_createCanvasOfMask:function(e,t){var n=r.default.util.createCanvasElement();return n.width=e,n.height=t,n},_drawMask:function(e){var t=this.mask,n=t.getElement(),i=t.getLeft(),o=t.getTop(),r=t.getAngle();e.save(),e.translate(i,o),e.rotate(r*Math.PI/180),e.scale(t.scaleX,t.scaleY),e.drawImage(n,-n.width/2,-n.height/2),e.restore()},_mapData:function(e,t,n,i){for(var o=t.data,r=e.getImageData(0,0,n,i).data,a=this.channel,s=t.width*t.height*4,l=0;l1&&void 0!==arguments[1]?arguments[1]:{},i=n.cssMaxWidth,r=n.cssMaxHeight,a=n.useItext,s=void 0!==a&&a,l=n.useDragAddIcon,c=void 0!==l&&l;o(this,e),this.canvasImage=null,this.cssMaxWidth=i||ie,this.cssMaxHeight=r||oe,this.useItext=s,this.useDragAddIcon=c,this.cropSelectionStyle={},this.imageName="",this._objects={},this._canvas=null,this._drawingMode=q.NORMAL,this._drawingModeMap={},this._componentMap={},this._handler={onMouseDown:this._onMouseDown.bind(this),onObjectAdded:this._onObjectAdded.bind(this),onObjectRemoved:this._onObjectRemoved.bind(this),onObjectMoved:this._onObjectMoved.bind(this),onObjectScaled:this._onObjectScaled.bind(this),onObjectSelected:this._onObjectSelected.bind(this),onPathCreated:this._onPathCreated.bind(this),onSelectionCleared:this._onSelectionCleared.bind(this),onSelectionCreated:this._onSelectionCreated.bind(this)},this._setCanvasElement(t),this._createDrawingModeInstances(),this._createComponents(),this._attachCanvasEvents()}return r(e,[{key:"destroy",value:function(){var e=this._canvas.wrapperEl;this._canvas.clear(),e.parentNode.removeChild(e)}},{key:"deactivateAll",value:function(){return this._canvas.deactivateAll(),this}},{key:"renderAll",value:function(){return this._canvas.renderAll(),this}},{key:"add",value:function(e){var t,n=[];$(e)?n=e:n.push(e),(t=this._canvas).add.apply(t,n)}},{key:"contains",value:function(e){return this._canvas.contains(e)}},{key:"getObjects",value:function(){return this._canvas.getObjects().slice()}},{key:"getObject",value:function(e){return this._objects[e]}},{key:"remove",value:function(e){this._canvas.remove(e)}},{key:"removeAll",value:function(e){var t=this._canvas,n=t.getObjects().slice();return t.remove.apply(t,this._canvas.getObjects()),e&&t.clear(),n}},{key:"removeObjectById",value:function(e){var t=[],n=this._canvas,i=this.getObject(e),o=i&&i.isType("group")&&!i.isEmpty();return o?(n.discardActiveGroup(),i.forEachObject(function(e){t.push(e),e.remove()})):n.contains(i)&&(t.push(i),i.remove()),t}},{key:"getObjectId",value:function(e){var t=null;for(t in this._objects)if(this._objects.hasOwnProperty(t)&&e===this._objects[t])return t;return null}},{key:"getActiveObject",value:function(){return this._canvas.getActiveObject()}},{key:"getActiveGroupObject",value:function(){return this._canvas.getActiveGroup()}},{key:"setActiveObject",value:function(e){this._canvas.setActiveObject(e)}},{key:"setCropSelectionStyle",value:function(e){this.cropSelectionStyle=e}},{key:"getComponent",value:function(e){return this._componentMap[e]}},{key:"getDrawingMode",value:function(){return this._drawingMode}},{key:"startDrawingMode",value:function(e,t){if(this._isSameDrawingMode(e))return!0;this.stopDrawingMode();var n=this._getDrawingModeInstance(e);return n&&n.start&&(n.start(this,t),this._drawingMode=e),!!n}},{key:"stopDrawingMode",value:function(){if(!this._isSameDrawingMode(q.NORMAL)){var e=this._getDrawingModeInstance(this.getDrawingMode());e&&e.end&&e.end(this),this._drawingMode=q.NORMAL}}},{key:"toDataURL",value:function(e){return this._canvas&&this._canvas.toDataURL(e)}},{key:"setCanvasImage",value:function(e,t){t&&Z(t),this.imageName=e,this.canvasImage=t}},{key:"setCssMaxDimension",value:function(e){this.cssMaxWidth=e.width||this.cssMaxWidth,this.cssMaxHeight=e.height||this.cssMaxHeight}},{key:"adjustCanvasDimension",value:function(){var e=this.canvasImage.scale(1),t=e.getBoundingRect(),n=t.width,i=t.height,o=this._calcMaxDimension(n,i);this.setCanvasCssDimension({width:"100%",height:"100%","max-width":o.width+"px","max-height":o.height+"px"}),this.setCanvasBackstoreDimension({width:n,height:i}),this._canvas.centerObject(e)}},{key:"setCanvasCssDimension",value:function(e){this._canvas.setDimensions(e,re)}},{key:"setCanvasBackstoreDimension",value:function(e){this._canvas.setDimensions(e,ae)}},{key:"setImageProperties",value:function(e,t){var n=this.canvasImage;n&&(n.set(e).setCoords(),t&&this._canvas.renderAll())}},{key:"getCanvasElement",value:function(){return this._canvas.getElement()}},{key:"getCanvas",value:function(){return this._canvas}},{key:"getCanvasImage",value:function(){return this.canvasImage}},{key:"getImageName",value:function(){return this.imageName}},{key:"addImageObject",value:function(e){var t=this,n=this._callbackAfterLoadingImageObject.bind(this);return new c.default(function(i){d.default.Image.fromURL(e,function(e){n(e),i(t.createObjectProperties(e))},{crossOrigin:"Anonymous"})})}},{key:"getCenter",value:function(){return this._canvas.getCenter()}},{key:"getCropzoneRect",value:function(){return this.getComponent(G.CROPPER).getCropzoneRect()}},{key:"getCroppedImageData",value:function(e){return this.getComponent(G.CROPPER).getCroppedImageData(e)}},{key:"setBrush",value:function(e){var t=this._drawingMode,n=G.FREE_DRAWING;t===q.LINE&&(n=q.LINE),this.getComponent(n).setBrush(e)}},{key:"setDrawingShape",value:function(e,t){this.getComponent(G.SHAPE).setStates(e,t)}},{key:"registerPaths",value:function(e){this.getComponent(G.ICON).registerPaths(e)}},{key:"changeCursor",value:function(e){var t=this.getCanvas();t.defaultCursor=e,t.renderAll()}},{key:"hasFilter",value:function(e){return this.getComponent(G.FILTER).hasFilter(e)}},{key:"setSelectionStyle",value:function(e){J(K.SELECTION_STYLE,e)}},{key:"setObjectProperties",value:function(e,t){var n=this.getObject(e),i=J({},t);return n.set(i),n.setCoords(),this.getCanvas().renderAll(),i}},{key:"getObjectProperties",value:function(e,t){var n=this.getObject(e),i={};return Q(t)?i[t]=n[t]:$(t)?ee(t,function(e){i[e]=n[e]}):te(t,function(e,t){i[t]=n[t]}),i}},{key:"getObjectPosition",value:function(e,t,n){var i=this.getObject(e);return i?i.getPointByOrigin(t,n):null}},{key:"setObjectPosition",value:function(e,t){var n=this.getObject(e),i=t.x,o=t.y,r=t.originX,a=t.originY;if(!n)return!1;var s=n.getPointByOrigin(r,a),l=n.getPointByOrigin("center","center"),c=l.x-s.x,u=l.y-s.y;return n.set({left:i+c,top:o+u}),n.setCoords(),!0}},{key:"getCanvasSize",value:function(){var e=this.getCanvasImage();return{width:e?e.width:0,height:e?e.height:0}}},{key:"_getDrawingModeInstance",value:function(e){return this._drawingModeMap[e]}},{key:"_setCanvasElement",value:function(e){var t=void 0,n=void 0;t=e.jquery?e[0]:e.nodeType?e:document.querySelector(e),"CANVAS"!==t.nodeName.toUpperCase()&&(n=document.createElement("canvas"),t.appendChild(n)),this._canvas=new d.default.Canvas(n,{containerClass:"tui-image-editor-canvas-container",enableRetinaScaling:!1})}},{key:"_createDrawingModeInstances",value:function(){this._register(this._drawingModeMap,new I.default),this._register(this._drawingModeMap,new R.default),this._register(this._drawingModeMap,new N.default),this._register(this._drawingModeMap,new F.default),this._register(this._drawingModeMap,new z.default)}},{key:"_createComponents",value:function(){this._register(this._componentMap,new f.default(this)),this._register(this._componentMap,new g.default(this)),this._register(this._componentMap,new m.default(this)),this._register(this._componentMap,new y.default(this)),this._register(this._componentMap,new k.default(this)),this._register(this._componentMap,new x.default(this)),this._register(this._componentMap,new C.default(this)),this._register(this._componentMap,new S.default(this)),this._register(this._componentMap,new j.default(this)),this._register(this._componentMap,new P.default(this))}},{key:"_register",value:function(e,t){e[t.getName()]=t}},{key:"_isSameDrawingMode",value:function(e){return this.getDrawingMode()===e}},{key:"_calcMaxDimension",value:function(e,t){var n=this.cssMaxWidth/e,i=this.cssMaxHeight/t,o=Math.min(e,this.cssMaxWidth),r=Math.min(t,this.cssMaxHeight);return n<1&&n-1&&J(n,this._createTextProperties(e,n)),n}},{key:"_createTextProperties",value:function(e){var t=["text","fontFamily","fontSize","fontStyle","textAlign","textDecoration"],n={};return J(n,X.default.getProperties(e,t)),n}},{key:"_addFabricObject",value:function(e){var t=Z(e);return this._objects[t]=e,t}},{key:"_removeFabricObject",value:function(e){delete this._objects[e]}}]),e}();ne.mixin(se),e.exports=se},function(e,t){"use strict";function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n0&&(e=this.blur(e,t.blurradius,t.blurdelta)),h=0;h0)for(d=0;d0&&(f[d]={r:Math.floor(s[d].r/s[d].n),g:Math.floor(s[d].g/s[d].n),b:Math.floor(s[d].b/s[d].n),a:Math.floor(s[d].a/s[d].n)}),s[d].n/ln[i].boundingbox[2]&&(n[i].boundingbox[2]=r-1),a-1n[i].boundingbox[3]&&(n[i].boundingbox[3]=a-1),h=this.pathscan_combined_lookup[e[a][r]][c],e[a][r]=h[0],c=h[1],r+=h[2],a+=h[3],r-1===n[i].points[0].x&&a-1===n[i].points[0].y)if(u=!0,n[i].points.lengtht[2]&&e[3]>t[3]}},{key:"batchpathscan",value:function(e,t){var n=[];for(var i in e)e.hasOwnProperty(i)&&(n[i]=this.pathscan(e[i],t));return n}},{key:"internodes",value:function(e,t){var n=[],i=0,o=0,r=0,a=0,s=0,l=void 0,c=void 0;for(l=0;l0&&(n[l].points[n[l].points.length-1].linesegment=this.getdirection(n[l].points[n[l].points.length-1].x,n[l].points[n[l].points.length-1].y,e[l].points[c].x,e[l].points[c].y)),n[l].points.push({x:e[l].points[c].x,y:e[l].points[c].y,linesegment:this.getdirection(e[l].points[c].x,e[l].points[c].y,(e[l].points[c].x+e[l].points[o].x)/2,(e[l].points[c].y+e[l].points[o].y)/2)})),n[l].points.push({x:(e[l].points[c].x+e[l].points[o].x)/2,y:(e[l].points[c].y+e[l].points[o].y)/2,linesegment:this.getdirection((e[l].points[c].x+e[l].points[o].x)/2,(e[l].points[c].y+e[l].points[o].y)/2,(e[l].points[o].x+e[l].points[r].x)/2,(e[l].points[o].y+e[l].points[r].y)/2)});return n}},{key:"testrightangle",value:function(e,t,n,i,o,r){return e.points[i].x===e.points[t].x&&e.points[i].x===e.points[n].x&&e.points[i].y===e.points[o].y&&e.points[i].y===e.points[r].y||e.points[i].y===e.points[t].y&&e.points[i].y===e.points[n].y&&e.points[i].x===e.points[o].x&&e.points[i].x===e.points[r].x}},{key:"getdirection",value:function(e,t,n,i){var o=8;return o=ei?7:0:e>n?ti?5:4:ti?6:8}},{key:"batchinternodes",value:function(e,t){var n=[];for(var i in e)e.hasOwnProperty(i)&&(n[i]=this.internodes(e[i],t));return n}},{key:"tracepath",value:function(e,t,n){var i=0,o=void 0,r=void 0,a=void 0,s={};for(s.segments=[],s.boundingbox=e.boundingbox,s.holechildren=e.holechildren,s.isholepath=e.isholepath;i0?a:e.points.length}return s}},{key:"fitseq",value:function(e,t,n,i,o){if(o>e.points.length||o<0)return[];var r=i,a=0,s=!0,l=void 0,c=void 0,u=void 0,d=o-i;d<0&&(d+=e.points.length);for(var h=(e.points[o].x-e.points[i].x)/d,f=(e.points[o].y-e.points[i].y)/d,p=(i+1)%e.points.length,g=void 0;p!=o;)g=p-i,g<0&&(g+=e.points.length),l=e.points[i].x+h*g,c=e.points[i].y+f*g,u=(e.points[p].x-l)*(e.points[p].x-l)+(e.points[p].y-c)*(e.points[p].y-c),u>t&&(s=!1),u>a&&(r=p,a=u),p=(p+1)%e.points.length;if(s)return[{type:"L",x1:e.points[i].x,y1:e.points[i].y,x2:e.points[o].x,y2:e.points[o].y}];var v=r;s=!0,a=0;var m=(v-i)/d,b=(1-m)*(1-m),y=2*(1-m)*m,_=m*m,k=(b*e.points[i].x+_*e.points[o].x-e.points[v].x)/-y,w=(b*e.points[i].y+_*e.points[o].y-e.points[v].y)/-y;for(p=i+1;p!=o;)m=(p-i)/d,b=(1-m)*(1-m),y=2*(1-m)*m,_=m*m,l=b*e.points[i].x+y*k+_*e.points[o].x,c=b*e.points[i].y+y*w+_*e.points[o].y,u=(e.points[p].x-l)*(e.points[p].x-l)+(e.points[p].y-c)*(e.points[p].y-c),u>n&&(s=!1),u>a&&(r=p,a=u),p=(p+1)%e.points.length;if(s)return[{type:"Q",x1:e.points[i].x,y1:e.points[i].y,x2:k,y2:w,x3:e.points[o].x,y3:e.points[o].y}];var x=v;return this.fitseq(e,t,n,i,x).concat(this.fitseq(e,t,n,x,o))}},{key:"batchtracepaths",value:function(e,t,n){var i=[];for(var o in e)e.hasOwnProperty(o)&&i.push(this.tracepath(e[o],t,n));return i}},{key:"batchtracelayers",value:function(e,t,n){var i=[];for(var o in e)e.hasOwnProperty(o)&&(i[o]=this.batchtracepaths(e[o],t,n));return i}},{key:"roundtodec",value:function(e,t){return Number(e.toFixed(t))}},{key:"svgpathstring",value:function(e,t,n,i){var o=e.layers[t],r=o[n],a="",s=void 0;if(i.linefilter&&r.segments.length<3)return a;if(a="=0;s--)a+=c.segments[s].type+" ",c.segments[s].hasOwnProperty("x3")&&(a+=c.segments[s].x2*i.scale+" "+c.segments[s].y2*i.scale+" "),a+=c.segments[s].x1*i.scale+" "+c.segments[s].y1*i.scale+" ";else for(a+=c.segments[c.segments.length-1].hasOwnProperty("x3")?"M "+this.roundtodec(c.segments[c.segments.length-1].x3*i.scale)+" "+this.roundtodec(c.segments[c.segments.length-1].y3*i.scale)+" ":"M "+this.roundtodec(c.segments[c.segments.length-1].x2*i.scale)+" "+this.roundtodec(c.segments[c.segments.length-1].y2*i.scale)+" ",s=c.segments.length-1;s>=0;s--)a+=c.segments[s].type+" ",c.segments[s].hasOwnProperty("x3")&&(a+=this.roundtodec(c.segments[s].x2*i.scale)+" "+this.roundtodec(c.segments[s].y2*i.scale)+" "),a+=this.roundtodec(c.segments[s].x1*i.scale)+" "+this.roundtodec(c.segments[s].y1*i.scale)+" ";a+="Z "}if(a+='" />',i.lcpr||i.qcpr){for(s=0;s',a+='',a+='',a+=''),!r.segments[s].hasOwnProperty("x3")&&i.lcpr&&(a+='');for(var l=0;l',a+='',a+='',a+=''),!c.segments[s].hasOwnProperty("x3")&&i.lcpr&&(a+='')}}return a}},{key:"getsvgstring",value:function(e,t){t=this.checkoptions(t);for(var n=e.width*t.scale,i=e.height*t.scale,o="',r=0;r5&&(t=5),n=Math.abs(n),n>1024&&(n=1024);var p=this.gks[t-1];for(o=0;o0&&i+r0&&o+rn&&(f.data[s]=e.data[s],f.data[s+1]=e.data[s+1],f.data[s+2]=e.data[s+2],f.data[s+3]=e.data[s+3]);return f}},{key:"loadImage",value:function(e,t,n){var i=new Image;n&&n.corsenabled&&(i.crossOrigin="Anonymous"),i.src=e,i.onload=function(){var e=document.createElement("canvas");e.width=i.width,e.height=i.height;var n=e.getContext("2d");n.drawImage(i,0,0),t(e)}}},{key:"getImgdata",value:function(e){var t=e.getContext("2d");return t.getImageData(0,0,e.width,e.height)}},{key:"drawLayers",value:function(e,t,n,i){n=n||1;var o=void 0,r=void 0,a=void 0,s=void 0,l=void 0,c=void 0;i?(c=document.getElementById(i),c||(c=document.createElement("div"),c.id=i,document.body.appendChild(c))):(c=document.createElement("div"),document.body.appendChild(c));for(l in e)if(e.hasOwnProperty(l)){o=e[l][0].length,r=e[l].length;var u=document.createElement("canvas");u.width=o*n,u.height=r*n;var d=u.getContext("2d");for(s=0;sl?"right":"left",originY:o>c?"bottom":"top"}}function o(e){return"center"===e.getOriginX()&&"center"===e.getOriginY()}function r(e,t){var n=t.getPointByOrigin("center","center"),o=-t.getAngle(),r=i(n,e,o),a=r.originX,s=r.originY,l=t.getPointByOrigin(a,s),c=t.getLeft()-(n.x-l.x),u=t.getTop()-(n.x-l.y);t.set({originX:a,originY:s,left:c,top:u}),t.setCoords()}function a(e,t){var n=t.startPoint,o=-t.getAngle(),r=i(n,e,o),a=r.originX,s=r.originY;t.setPositionByOrigin(n,a,s)}function s(e){var t=e.type,n=e.scaleX,i=e.scaleY,o=u[t],r=e[o.w]*n,a=e[o.h]*i;if(e.isRegular){var s=Math.max(n,i);r=e[o.w]*s,a=e[o.h]*s}var l={hasControls:!1,hasBorders:!1,scaleX:1,scaleY:1};l[o.w]=r,l[o.h]=a,e.set(l)}function l(e,t){var n=t.type,i=t.strokeWidth,o=t.startPoint,r=c[n],a=u[n],s=!("triangle"!==t.type),l={},d=Math.abs(o.x-e.x)/r,h=Math.abs(o.y-e.y)/r;d>i&&(d-=i/r),h>i&&(h-=i/r),t.isRegular&&(d=h=Math.max(d,h),s&&(h=Math.sqrt(3)/2*d)),l[a.w]=d,l[a.h]=h,t.set(l)}var c={rect:1,circle:2,triangle:1},u={rect:{w:"width",h:"height"},circle:{w:"rx",h:"ry"},triangle:{w:"width",h:"height"}};e.exports={setOrigins:function(e){var t=e.getPointByOrigin("left","top"),n=e.getPointByOrigin("right","top"),i=e.getPointByOrigin("right","bottom"),o=e.getPointByOrigin("left","bottom");e.origins={lt:t,rt:n,rb:i,lb:o}},resize:function(e,t,i){o(e)&&(r(t,e),n(e)),i?s(e,t):l(t,e),a(t,e)},adjustOriginToCenter:function(e){var t=e.getPointByOrigin("center","center"),n=e.getOriginX(),i=e.getOriginY(),o=e.getPointByOrigin(n,i),r=e.getLeft()+(t.x-o.x),a=e.getTop()+(t.y-o.y);e.set({hasControls:!0,hasBorders:!0,originX:"center",originY:"center",left:r,top:a}),e.setCoords()}}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var r=function(){function e(e,t){for(var n=0;n1?n-1:0),o=1;o0&&void 0!==arguments[0]?arguments[0]:{},t=e.uiSize,n=e.imageSize,i=void 0===n?this.imageSize:n;i!==this.imageSize&&(this.imageSize=i),t&&this._setUiSize(t);var o=this._getEditorDimension(),r=o.width,a=o.height,s=this._editorElement.style,l=this.options.menuBarPosition;s.height=a+"px",s.width=r+"px";var c=this._getEditorPosition(l),u=c.top,d=c.bottom,h=c.left,f=c.right;this._editorElementWrap.style.bottom=d+"px",this._editorElementWrap.style.top=u+"px",this._editorElementWrap.style.left=h+"px",this._editorElementWrap.style.width="calc(100% - "+f+"px)";var p=this._selectedElement.classList;"top"===l&&this._selectedElement.offsetWidth0&&void 0!==arguments[0]?arguments[0]:this.options.uiSize,t=this._selectedElement.style;t.width=e.width,t.height=e.height}},{key:"_makeSubMenu",value:function(){var e=this;s.default.forEach(this.options.menu,function(t){var n=D[t.replace(/^[a-z]/,function(e){return e.toUpperCase()})];e._makeMenuElement(t),e._els[t]=e._menuElement.querySelector("#tie-btn-"+t),e[t]=new n(e._subMenuElement,{iconStyle:e.theme.getStyle("submenu.icon"),menuBarPosition:e.options.menuBarPosition})})}},{key:"_makeUiElement",value:function(e){var t=void 0;window.snippet=s.default,t=e.jquery?e[0]:e.nodeType?e:document.querySelector(e);var n=c.default.getSelector(t);t.classList.add("tui-image-editor-container"),t.innerHTML=(0,f.default)({biImage:this.theme.getStyle("common.bi"),iconStyle:this.theme.getStyle("menu.icon"),loadButtonStyle:this.theme.getStyle("loadButton"),downloadButtonStyle:this.theme.getStyle("downloadButton")})+(0,d.default)({biImage:this.theme.getStyle("common.bi"),commonStyle:this.theme.getStyle("common"),headerStyle:this.theme.getStyle("header"),loadButtonStyle:this.theme.getStyle("loadButton"),downloadButtonStyle:this.theme.getStyle("downloadButton"),submenuStyle:this.theme.getStyle("submenu")}),this._selectedElement=t,this._selectedElement.classList.add(this.options.menuBarPosition),this._mainElement=n(".tui-image-editor-main"),this._editorElementWrap=n(".tui-image-editor-wrap"),this._editorElement=n(".tui-image-editor"),this._menuElement=n(".tui-image-editor-menu"),this._subMenuElement=n(".tui-image-editor-submenu")}},{key:"_makeMenuElement",value:function(e){var t=document.createElement("li"),n=this.theme.getStyle("menu.icon"),i=n.normal,o=n.active,r='\n \n \n \n \n ';t.id="tie-btn-"+e,t.className="tui-image-editor-item",t.title=e,t.innerHTML=r,this._menuElement.appendChild(t)}},{key:"_addHelpActionEvent",value:function(e){var t=this;this._els[e].addEventListener("click",function(){t._actions.main[e]()})}},{key:"_addDownloadEvent",value:function(){var e=this;s.default.forEach(this._els.download,function(t){t.addEventListener("click",function(){e._actions.main.download()})})}},{key:"_addLoadEvent",value:function(){var e=this;s.default.forEach(this._els.load,function(t){t.addEventListener("change",function(t){e._actions.main.load(t.target.files[0])})})}},{key:"_addMenuEvent",value:function(e){var t=this;this._els[e].addEventListener("click",function(){t.changeMenu(e)})}},{key:"_addSubMenuEvent",value:function(e){this[e].addEvent(this._actions[e])}},{key:"getEditorArea",value:function(){return this._editorElement}},{key:"initCanvas",value:function(){var e=this,t=this._getLoadImage();t&&this._actions.main.initLoadImage(t.path,t.name).then(function(){e._addHelpActionEvent("undo"),e._addHelpActionEvent("redo"),e._addHelpActionEvent("reset"),e._addHelpActionEvent("delete"),e._addHelpActionEvent("deleteAll"),e._addDownloadEvent(),e._addLoadEvent(),s.default.forEach(e.options.menu,function(t){e._addMenuEvent(t),e._addSubMenuEvent(t)}),e._initMenu()});var n=document.createElement("div");n.className="tui-image-editor-grid-visual";var i='\n \n \n \n
    ';n.innerHTML=i,this._editorContainerElement=this._editorElement.querySelector(".tui-image-editor-canvas-container"),this._editorContainerElement.appendChild(n)}},{key:"_getLoadImage",value:function(){return this.options.loadImage}},{key:"changeMenu",value:function(e){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],n=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];this._submenuChangeTransection||(this._submenuChangeTransection=!0,this._changeMenu(e,t,n),this._submenuChangeTransection=!1)}},{key:"_changeMenu",value:function(e,t,n){this.submenu&&(this._els[this.submenu].classList.remove("active"),this._mainElement.classList.remove("tui-image-editor-menu-"+this.submenu),n&&this._actions.main.discardSelection(),this._actions.main.changeSelectableAll(!0),this[this.submenu].changeStandbyMode()),this.submenu===e&&t?this.submenu=null:(this._els[e].classList.add("active"),this._mainElement.classList.add("tui-image-editor-menu-"+e),this.submenu=e,this[this.submenu].changeStartMode()),this.resizeEditor()}},{key:"_initMenu",value:function(){if(this.options.initMenu){var e=document.createEvent("MouseEvents");e.initEvent("click",!0,!1),this._els[this.options.initMenu].dispatchEvent(e),this.icon&&this.icon.registDefaultIcon()}}},{key:"_getEditorDimension",value:function(){var e=parseFloat(this._editorContainerElement.style.maxHeight),t=this.imageSize.newHeight>e?e:this.imageSize.newHeight,n=parseFloat(this._editorContainerElement.style.maxWidth),i=this.imageSize.newWidth>n?n:this.imageSize.newWidth;return{width:i,height:t}}},{key:"_getEditorPosition",value:function(e){var t=0,n=0,i=0,o=0;if(this.submenu)switch(e){case"bottom":t+=150;break;case"top":n+=150;break;case"left":i+=248,o+=248;break;case"right":o+=248}return{top:n,bottom:t,left:i,right:o}}}]),e}();t.default=L},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n\n \n
      \n
    • \n \n \n \n \n
      • \n
    • \n \n \n \n \n
      • \n
    • \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    • \n \n \n \n \n
      • \n
    • \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    \n\n
    \n \n \n
    \n \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.biImage,n=e.commonStyle,i=e.headerStyle,o=e.loadButtonStyle,r=e.downloadButtonStyle,a=e.submenuStyle;return'\n
    \n
    \n \n
    \n \n \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.subMenuLabelActive,n=e.subMenuLabelNormal,i=e.subMenuRangeTitle,o=e.submenuPartitionVertical,r=e.submenuPartitionHorizontal,a=e.submenuCheckbox,s=e.submenuRangePointer,l=e.submenuRangeValue,c=e.submenuColorpickerTitle,u=e.submenuColorpickerButton,d=e.submenuRangeBar,h=e.submenuRangeSubbar,f=e.submenuIconSize,p=e.menuIconSize,g=e.biSize;return'\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype="icon-bubble"] label,\n #tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype="icon-heart"] label,\n #tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype="icon-location"] label,\n #tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype="icon-polygon"] label,\n #tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype="icon-star"] label,\n #tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype="icon-arrow-3"] label,\n #tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype="icon-arrow-2"] label,\n #tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype="icon-arrow"] label,\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype="icon-bubble"] label,\n #tie-draw-line-select-button.line .tui-image-editor-button.line label,\n #tie-draw-line-select-button.free .tui-image-editor-button.free label,\n #tie-flip-button.flipX .tui-image-editor-button.flipX label,\n #tie-flip-button.flipY .tui-image-editor-button.flipY label,\n #tie-flip-button.resetFlip .tui-image-editor-button.resetFlip label,\n #tie-crop-button .tui-image-editor-button.apply.active label,\n #tie-shape-button.rect .tui-image-editor-button.rect label,\n #tie-shape-button.circle .tui-image-editor-button.circle label,\n #tie-shape-button.triangle .tui-image-editor-button.triangle label,\n #tie-text-effect-button .tui-image-editor-button.active label,\n #tie-text-align-button.left .tui-image-editor-button.left label,\n #tie-text-align-button.center .tui-image-editor-button.center label,\n #tie-text-align-button.right .tui-image-editor-button.right label,\n #tie-mask-apply.apply.active .tui-image-editor-button.apply label,\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover > label,\n .tui-image-editor-container .tui-image-editor-checkbox input + label {\n '+t+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button > label,\n .tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label {\n "+n+"\n }\n .tui-image-editor-container .tui-image-editor-range-wrap label {\n "+i+"\n }\n .tui-image-editor-container .tui-image-editor-partition > div {\n "+o+"\n }\n .tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition > div,\n .tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition > div {\n "+r+"\n }\n .tui-image-editor-container .tui-image-editor-checkbox input + label:before {\n "+a+"\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-pointer {\n "+s+"\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-bar {\n "+d+"\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-subbar {\n "+h+"\n }\n .tui-image-editor-container .tui-image-editor-range-value {\n "+l+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value + label {\n "+c+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value {\n "+u+"\n }\n .tui-image-editor-container .svg_ic-menu {\n "+p+"\n }\n .tui-image-editor-container .svg_ic-submenu {\n "+f+"\n }\n .tui-image-editor-container .tui-image-editor-controls-logo > img,\n .tui-image-editor-container .tui-image-editor-header-logo > img {\n "+g+"\n }\n\n"}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n \n \n \n \n \n
      \n
      \n \n \n \n \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(){return'\n
      \n
    • \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n\n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n \n \n \n \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'; +}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n-1&&"none"!==e&&(e="url("+e+")"),n.push(t._toUnderScore(i)+": "+e)}),n.join(";")}},{key:"_toUnderScore",value:function(e){return e.replace(/([A-Z])/g,function(e,t){return"-"+t.toLowerCase()})}}]),e}();t.default=h},function(e,t){e.exports=function(){}},function(e,t){e.exports=function(e,t,n,i){if(!(e instanceof t)||void 0!==i&&i in e)throw TypeError(n+": incorrect invocation!");return e}},function(e,t,n){var i=n(30),o=n(42),r=n(139);e.exports=function(e){return function(t,n,a){var s,l=i(t),c=o(l.length),u=r(a,c);if(e&&n!=n){for(;c>u;)if(s=l[u++],s!=s)return!0}else for(;c>u;u++)if((e||u in l)&&l[u]===n)return e||u||0;return!e&&-1}}},function(e,t,n){var i=n(20),o=n(124),r=n(123),a=n(11),s=n(42),l=n(142),c={},u={},t=e.exports=function(e,t,n,d,h){var f,p,g,v,m=h?function(){return e}:l(e),b=i(n,d,t?2:1),y=0;if("function"!=typeof m)throw TypeError(e+" is not iterable!");if(r(m)){for(f=s(e.length);f>y;y++)if(v=t?b(a(p=e[y])[0],p[1]):b(e[y]),v===c||v===u)return v}else for(g=m.call(e);!(p=g.next()).done;)if(v=o(g,b,p.value,t),v===c||v===u)return v};t.BREAK=c,t.RETURN=u},function(e,t,n){e.exports=!n(17)&&!n(35)(function(){return 7!=Object.defineProperty(n(26)("div"),"a",{get:function(){return 7}}).a})},function(e,t){e.exports=function(e,t,n){var i=void 0===n;switch(t.length){case 0:return i?e():e.call(n);case 1:return i?e(t[0]):e.call(n,t[0]);case 2:return i?e(t[0],t[1]):e.call(n,t[0],t[1]);case 3:return i?e(t[0],t[1],t[2]):e.call(n,t[0],t[1],t[2]);case 4:return i?e(t[0],t[1],t[2],t[3]):e.call(n,t[0],t[1],t[2],t[3])}return e.apply(n,t)}},function(e,t,n){var i=n(19);e.exports=Object("z").propertyIsEnumerable(0)?Object:function(e){return"String"==i(e)?e.split(""):Object(e)}},function(e,t,n){var i=n(18),o=n(7)("iterator"),r=Array.prototype;e.exports=function(e){return void 0!==e&&(i.Array===e||r[o]===e)}},function(e,t,n){var i=n(11);e.exports=function(e,t,n,o){try{return o?t(i(n)[0],n[1]):t(n)}catch(t){var r=e.return;throw void 0!==r&&i(r.call(e)),t}}},function(e,t,n){"use strict";var i=n(129),o=n(39),r=n(27),a={};n(12)(a,n(7)("iterator"),function(){return this}),e.exports=function(e,t,n){e.prototype=i(a,{next:o(1,n)}),r(e,t+" Iterator")}},function(e,t,n){var i=n(7)("iterator"),o=!1;try{var r=[7][i]();r.return=function(){o=!0},Array.from(r,function(){throw 2})}catch(e){}e.exports=function(e,t){if(!t&&!o)return!1;var n=!1;try{var r=[7],a=r[i]();a.next=function(){return{done:n=!0}},r[i]=function(){return a},e(r)}catch(e){}return n}},function(e,t){e.exports=function(e,t){return{value:t,done:!!e}}},function(e,t,n){var i=n(9),o=n(41).set,r=i.MutationObserver||i.WebKitMutationObserver,a=i.process,s=i.Promise,l="process"==n(19)(a);e.exports=function(){var e,t,n,c=function(){var i,o;for(l&&(i=a.domain)&&i.exit();e;){o=e.fn,e=e.next;try{o()}catch(i){throw e?n():t=void 0,i}}t=void 0,i&&i.enter()};if(l)n=function(){a.nextTick(c)};else if(r){var u=!0,d=document.createTextNode("");new r(c).observe(d,{characterData:!0}),n=function(){d.data=u=!u}}else if(s&&s.resolve){var h=s.resolve();n=function(){h.then(c)}}else n=function(){o.call(i,c)};return function(i){var o={fn:i,next:void 0};t&&(t.next=o),e||(e=o,n()),t=o}}},function(e,t,n){var i=n(11),o=n(130),r=n(33),a=n(28)("IE_PROTO"),s=function(){},l="prototype",c=function(){var e,t=n(26)("iframe"),i=r.length,o="<",a=">";for(t.style.display="none",n(36).appendChild(t),t.src="javascript:",e=t.contentWindow.document,e.open(),e.write(o+"script"+a+"document.F=Object"+o+"/script"+a),e.close(),c=e.F;i--;)delete c[l][r[i]];return c()};e.exports=Object.create||function(e,t){var n;return null!==e?(s[l]=i(e),n=new s,s[l]=null,n[a]=e):n=c(),void 0===t?n:o(n,t)}},function(e,t,n){var i=n(23),o=n(11),r=n(133);e.exports=n(17)?Object.defineProperties:function(e,t){o(e);for(var n,a=r(t),s=a.length,l=0;s>l;)i.f(e,n=a[l++],t[n]);return e}},function(e,t,n){var i=n(21),o=n(140),r=n(28)("IE_PROTO"),a=Object.prototype;e.exports=Object.getPrototypeOf||function(e){return e=o(e),i(e,r)?e[r]:"function"==typeof e.constructor&&e instanceof e.constructor?e.constructor.prototype:e instanceof Object?a:null}},function(e,t,n){var i=n(21),o=n(30),r=n(118)(!1),a=n(28)("IE_PROTO");e.exports=function(e,t){var n,s=o(e),l=0,c=[];for(n in s)n!=a&&i(s,n)&&c.push(n);for(;t.length>l;)i(s,n=t[l++])&&(~r(c,n)||c.push(n));return c}},function(e,t,n){var i=n(132),o=n(33);e.exports=Object.keys||function(e){return i(e,o)}},function(e,t,n){var i=n(12);e.exports=function(e,t,n){for(var o in t)n&&e[o]?e[o]=t[o]:i(e,o,t[o]);return e}},function(e,t,n){e.exports=n(12)},function(e,t,n){"use strict";var i=n(9),o=n(16),r=n(23),a=n(17),s=n(7)("species");e.exports=function(e){var t="function"==typeof o[e]?o[e]:i[e];a&&t&&!t[s]&&r.f(t,s,{configurable:!0,get:function(){return this}})}},function(e,t,n){var i=n(11),o=n(24),r=n(7)("species");e.exports=function(e,t){var n,a=i(e).constructor;return void 0===a||void 0==(n=i(a)[r])?t:o(n)}},function(e,t,n){var i=n(29),o=n(25);e.exports=function(e){return function(t,n){var r,a,s=String(o(t)),l=i(n),c=s.length;return l<0||l>=c?e?"":void 0:(r=s.charCodeAt(l),r<55296||r>56319||l+1===c||(a=s.charCodeAt(l+1))<56320||a>57343?e?s.charAt(l):r:e?s.slice(l,l+2):(r-55296<<10)+(a-56320)+65536)}}},function(e,t,n){var i=n(29),o=Math.max,r=Math.min;e.exports=function(e,t){return e=i(e),e<0?o(e+t,0):r(e,t)}},function(e,t,n){var i=n(25);e.exports=function(e){return Object(i(e))}},function(e,t,n){var i=n(22);e.exports=function(e,t){if(!i(e))return e;var n,o;if(t&&"function"==typeof(n=e.toString)&&!i(o=n.call(e)))return o;if("function"==typeof(n=e.valueOf)&&!i(o=n.call(e)))return o;if(!t&&"function"==typeof(n=e.toString)&&!i(o=n.call(e)))return o;throw TypeError("Can't convert object to primitive value")}},function(e,t,n){var i=n(32),o=n(7)("iterator"),r=n(18);e.exports=n(16).getIteratorMethod=function(e){if(void 0!=e)return e[o]||e["@@iterator"]||r[i(e)]}},function(e,t,n){"use strict";var i=n(116),o=n(127),r=n(18),a=n(30);e.exports=n(37)(Array,"Array",function(e,t){this._t=a(e),this._i=0,this._k=t},function(){var e=this._t,t=this._k,n=this._i++;return!e||n>=e.length?(this._t=void 0,o(1)):"keys"==t?o(0,n):"values"==t?o(0,e[n]):o(0,[n,e[n]])},"values"),r.Arguments=r.Array,i("keys"),i("values"),i("entries")},function(e,t){},function(e,t,n){"use strict";var i,o,r,a=n(38),s=n(9),l=n(20),c=n(32),u=n(34),d=n(22),h=n(24),f=n(117),p=n(119),g=n(137),v=n(41).set,m=n(128)(),b="Promise",y=s.TypeError,_=s.process,k=s[b],_=s.process,w="process"==c(_),x=function(){},E=!!function(){try{var e=k.resolve(1),t=(e.constructor={})[n(7)("species")]=function(e){e(x,x)};return(w||"function"==typeof PromiseRejectionEvent)&&e.then(x)instanceof t}catch(e){}}(),C=function(e,t){return e===t||e===k&&t===r},O=function(e){var t;return!(!d(e)||"function"!=typeof(t=e.then))&&t},S=function(e){return C(k,e)?new M(e):new o(e)},M=o=function(e){var t,n;this.promise=new e(function(e,i){if(void 0!==t||void 0!==n)throw y("Bad Promise constructor");t=e,n=i}),this.resolve=h(t),this.reject=h(n)},j=function(e){try{e()}catch(e){return{error:e}}},T=function(e,t){if(!e._n){e._n=!0;var n=e._c;m(function(){for(var i=e._v,o=1==e._s,r=0,a=function(t){var n,r,a=o?t.ok:t.fail,s=t.resolve,l=t.reject,c=t.domain;try{a?(o||(2==e._h&&I(e),e._h=1),a===!0?n=i:(c&&c.enter(),n=a(i),c&&c.exit()),n===t.promise?l(y("Promise-chain cycle")):(r=O(n))?r.call(n,s,l):s(n)):l(i)}catch(e){l(e)}};n.length>r;)a(n[r++]);e._c=[],e._n=!1,t&&!e._h&&P(e)})}},P=function(e){v.call(s,function(){var t,n,i,o=e._v;if(A(e)&&(t=j(function(){w?_.emit("unhandledRejection",o,e):(n=s.onunhandledrejection)?n({promise:e,reason:o}):(i=s.console)&&i.error&&i.error("Unhandled promise rejection",o)}),e._h=w||A(e)?2:1),e._a=void 0,t)throw t.error})},A=function(e){if(1==e._h)return!1;for(var t,n=e._a||e._c,i=0;n.length>i;)if(t=n[i++],t.fail||!A(t.promise))return!1;return!0},I=function(e){v.call(s,function(){var t;w?_.emit("rejectionHandled",e):(t=s.onrejectionhandled)&&t({promise:e,reason:e._v})})},D=function(e){var t=this;t._d||(t._d=!0,t=t._w||t,t._v=e,t._s=2,t._a||(t._a=t._c.slice()),T(t,!0))},R=function(e){var t,n=this;if(!n._d){n._d=!0,n=n._w||n;try{if(n===e)throw y("Promise can't be resolved itself");(t=O(e))?m(function(){var i={_w:n,_d:!1};try{t.call(e,l(R,i,1),l(D,i,1))}catch(e){D.call(i,e)}}):(n._v=e,n._s=1,T(n,!1))}catch(e){D.call({_w:n,_d:!1},e)}}};E||(k=function(e){f(this,k,b,"_h"),h(e),i.call(this);try{e(l(R,this,1),l(D,this,1))}catch(e){D.call(this,e)}},i=function(e){this._c=[],this._a=void 0,this._s=0,this._d=!1,this._v=void 0,this._h=0,this._n=!1},i.prototype=n(134)(k.prototype,{then:function(e,t){var n=S(g(this,k));return n.ok="function"!=typeof e||e,n.fail="function"==typeof t&&t,n.domain=w?_.domain:void 0,this._c.push(n),this._a&&this._a.push(n),this._s&&T(this,!1),n.promise},catch:function(e){return this.then(void 0,e)}}),M=function(){var e=new i;this.promise=e,this.resolve=l(R,e,1),this.reject=l(D,e,1)}),u(u.G+u.W+u.F*!E,{Promise:k}),n(27)(k,b),n(136)(b),r=n(16)[b],u(u.S+u.F*!E,b,{reject:function(e){var t=S(this),n=t.reject;return n(e),t.promise}}),u(u.S+u.F*(a||!E),b,{resolve:function(e){if(e instanceof k&&C(e.constructor,this))return e;var t=S(this),n=t.resolve;return n(e),t.promise}}),u(u.S+u.F*!(E&&n(126)(function(e){k.all(e).catch(x)})),b,{all:function(e){var t=this,n=S(t),i=n.resolve,o=n.reject,r=j(function(){var n=[],r=0,a=1;p(e,!1,function(e){var s=r++,l=!1;n.push(void 0),a++,t.resolve(e).then(function(e){l||(l=!0,n[s]=e,--a||i(n))},o)}),--a||i(n)});return r&&o(r.error),n.promise},race:function(e){var t=this,n=S(t),i=n.reject,o=j(function(){p(e,!1,function(e){t.resolve(e).then(n.resolve,i)})});return o&&i(o.error),n.promise}})},function(e,t,n){"use strict";var i=n(138)(!0);n(37)(String,"String",function(e){this._t=String(e),this._i=0},function(){var e,t=this._t,n=this._i;return n>=t.length?{value:void 0,done:!0}:(e=i(t,n),this._i+=e.length,{value:e,done:!1})})},function(e,t,n){n(143);for(var i=n(9),o=n(12),r=n(18),a=n(7)("toStringTag"),s=["NodeList","DOMTokenList","MediaList","StyleSheetList","CSSRuleList"],l=0;l<5;l++){var c=s[l],u=i[c],d=u&&u.prototype;d&&!d[a]&&o(d,a,c),r[c]=r.Array}},function(e,t){},function(e,t,n){/*! + * Toast UI Colorpicker + * @version 2.2.0 + * @author NHNEnt FE Development Team + * @license MIT + */ +!function(t,i){e.exports=i(n(3))}(this,function(e){return function(e){function t(i){if(n[i])return n[i].exports;var o=n[i]={exports:{},id:i,loaded:!1};return e[i].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var n={};return t.m=e,t.c=n,t.p="dist",t(0)}([function(e,t,n){n(1),e.exports=n(6)},function(e,t){},,,,,function(e,t,n){"use strict";var i=n(7),o=n(9),r=n(10),a=n(11),s=n(12),l=n(13),c=n(16),u=n(18),d=n(14),h=n(19),f={domutil:i,domevent:o,Collection:r,View:a,Drag:s,create:l,Palette:c,Slider:u,colorutil:d,svgvml:h};e.exports=f},function(e,t,n){"use strict";function i(e){return e.replace(/^\s\s*/,"").replace(/\s\s*$/,"")}var o,r,a=n(8),s=n(9),l=n(10),c=a,u="_pos",d="onselectstart"in document,h="",f=/^auto$|^$|%/;o={appendHTMLElement:function(e,t,n){var i;return n=n||"",i=document.createElement(e),i.className=n,t?t.appendChild(i):document.body.appendChild(i),i},remove:function(e){e&&e.parentNode&&e.parentNode.removeChild(e)},get:function(e){return document.getElementById(e)},_matcher:function(e,t){var n=/^\./,i=/^#/;return n.test(t)?o.hasClass(e,t.replace(".","")):i.test(t)?e.id===t.replace("#",""):e.nodeName.toLowerCase()===t.toLowerCase()},find:function(e,t,n){function i(e,t){for(var c,u=e.childNodes,d=0,h=u.length;d0&&(i(c,t),a))break}var r=[],a=!1,s=c.isUndefined(n)||n===!1,l=c.isFunction(n);return c.isString(t)&&(t=o.get(t)),t=t||window.document.body,i(t,e),s?r[0]||null:r},closest:function(e,t){var n=e.parentNode;if(o._matcher(e,t))return e;for(;n&&n!==window.document.body;){if(o._matcher(n,t))return n;n=n.parentNode}},text:function(e){var t="",n=0,i=e.nodeType;if(i){if(1===i||9===i||11===i){if("string"==typeof e.textContent)return e.textContent;for(e=e.firstChild;e;e=e.nextSibling)t+=o.text(e)}else if(3===i||4===i)return e.nodeValue}else for(;e[n];n+=1)t+=o.text(e[n]);return t},setData:function(e,t,n){return"dataset"in e?void(e.dataset[t]=n):void e.setAttribute("data-"+t,n)},getData:function(e,t){return"dataset"in e?e.dataset[t]:e.getAttribute("data-"+t)},hasClass:function(e,t){var n;return c.isUndefined(e.classList)?(n=o.getClass(e),n.length>0&&new RegExp("(^|\\s)"+t+"(\\s|$)").test(n)):e.classList.contains(t)},addClass:function(e,t){var n;c.isUndefined(e.classList)?o.hasClass(e,t)||(n=o.getClass(e),o.setClass(e,(n?n+" ":"")+t)):c.forEachArray(t.split(" "),function(t){e.classList.add(t)})},setClass:function(e,t){c.isUndefined(e.className.baseVal)?e.className=t:e.className.baseVal=t},removeClass:function(e,t){var n="";c.isUndefined(e.classList)?(n=(" "+o.getClass(e)+" ").replace(" "+t+" "," "),o.setClass(e,i(n))):e.classList.remove(t)},getClass:function(e){return e&&e.className?c.isUndefined(e.className.baseVal)?e.className:e.className.baseVal:""},getStyle:function(e,t){var n,i=e.style[t]||e.currentStyle&&e.currentStyle[t];return i&&"auto"!==i||!document.defaultView||(n=document.defaultView.getComputedStyle(e,null),i=n?n[t]:null),"auto"===i?null:i},getComputedStyle:function(e){var t=document.defaultView;return t&&t.getComputedStyle?document.defaultView.getComputedStyle(e):{getPropertyValue:function(t){var n=/(\-([a-z]){1})/g;return"float"===t&&(t="styleFloat"),n.test(t)&&(t=t.replace(n,function(){return arguments[2].toUpperCase()})),e.currentStyle[t]?e.currentStyle[t]:null}}},setPosition:function(e,t,n){t=c.isUndefined(t)?0:t,n=c.isUndefined(n)?0:n,e[u]=[t,n],e.style.left=t+"px",e.style.top=n+"px"},getPosition:function(e,t){var n,i,o;return t&&(e[u]=null),e[u]?e[u]:(n=0,i=0,(f.test(e.style.left)||f.test(e.style.top))&&"getBoundingClientRect"in e?(o=e.getBoundingClientRect(),n=o.left,i=o.top):(n=parseFloat(e.style.left||0),i=parseFloat(e.style.top||0)),[n,i])},getSize:function(e){var t,n=o.getStyle(e,"width"),i=o.getStyle(e,"height");return(f.test(n)||f.test(i))&&"getBoundingClientRect"in e?(t=e.getBoundingClientRect(),n=t.width,i=t.height):(n=parseFloat(n||0),i=parseFloat(i||0)),[n,i]},testProp:function(e){for(var t=document.documentElement.style,n=0,i=e.length;n1?void s(u.call(arguments),function(e){this.add(e)},this):(t=this.getItemID(e),n=this.items,n[t]||(this.length+=1),void(n[t]=e))},i.prototype.remove=function(e){var t,n,i=[];return this.length?arguments.length>1?i=r.map(u.call(arguments),function(e){return this.remove(e)},this):(t=this.items,c(e)&&(e=this.getItemID(e)),t[e]?(this.length-=1,n=t[e],delete t[e],n):i):i},i.prototype.clear=function(){this.items={},this.length=0},i.prototype.has=function(e){var t,n;return!!this.length&&(t=l(e),n=!1,t?this.each(function(t){return e(t)!==!0||(n=!0,!1)}):(e=c(e)?this.getItemID(e):e,n=r.isExisty(this.items[e])),n)},i.prototype.doWhenHas=function(e,t,n){var i=this.items[e];r.isExisty(i)&&t.call(n||this,i)},i.prototype.find=function(e){var t=new i;return this.hasOwnProperty("getItemID")&&(t.getItemID=this.getItemID),this.each(function(n){e(n)===!0&&t.add(n)}),t},i.prototype.groupBy=function(e,t){var n,o,a={},s=l(e),c=this.getItemID;if(r.isArray(e)){if(r.forEachArray(e,function(e){a[e+""]=new i(c)}),!t)return a;e=t,s=!0}return this.each(function(t){s?o=e(t):(o=t[e],l(o)&&(o=o.apply(t))),n=a[o],n||(n=a[o]=new i(c)),n.add(t)}),a},i.prototype.single=function(){var e;return this.each(function(t){return e=t,!1},this),e},i.prototype.sort=function(e){var t=[];return this.each(function(e){t.push(e)}),l(e)&&(t=t.sort(e)),t},i.prototype.each=function(e,t){a(this.items,e,t||this)},i.prototype.toArray=function(){return this.length?r.map(this.items,function(e){return e}):[]},e.exports=i},function(e,t,n){"use strict";function i(e,t){var n=o.stamp(this);e=e||{},o.isUndefined(t)&&(t=r.appendHTMLElement("div")),r.addClass(t,"tui-view-"+n),this.id=n,this.container=t,this.childs=new a(function(e){return o.stamp(e)}),this.parent=null}var o=n(8),r=n(7),a=n(10);i.prototype.addChild=function(e,t){t&&t.call(e,this),e.parent=this,this.childs.add(e)},i.prototype.removeChild=function(e,t){var n=o.isNumber(e)?this.childs.items[e]:e;e=o.stamp(n),t&&t.call(n,this),this.childs.remove(e)},i.prototype.render=function(){this.childs.each(function(e){e.render()})},i.prototype.recursive=function(e,t){o.isFunction(e)&&(t||e(this),this.childs.each(function(t){t.recursive(e)}))},i.prototype.resize=function(){for(var e=Array.prototype.slice.call(arguments),t=this.parent;t;)o.isFunction(t._onResize)&&t._onResize.apply(t,e),t=t.parent},i.prototype._beforeDestroy=function(){},i.prototype._destroy=function(){this._beforeDestroy(),this.childs.clear(),this.container.innerHTML="",this.id=this.parent=this.childs=this.container=null},i.prototype.destroy=function(e){this.childs.each(function(e){e.destroy(!0),e._destroy()}),e||this._destroy()},i.prototype.getViewBound=function(){var e=this.container,t=r.getPosition(e),n=r.getSize(e);return{x:t[0],y:t[1],width:n[0],height:n[1]}},e.exports=i},function(e,t,n){(function(t){"use strict";function i(e,t){a.on(t,"mousedown",this._onMouseDown,this),this.options=o.extend({distance:10},e),this.container=t,this._isMoved=!1,this._distance=0,this._dragStartFired=!1,this._dragStartEventData=null}var o=n(8),r=n(7),a=n(9);i.prototype.destroy=function(){a.off(this.container,"mousedown",this._onMouseDown,this),this.options=this.container=this._isMoved=this._distance=this._dragStartFired=this._dragStartEventData=null},i.prototype._toggleDragEvent=function(e){var n,i,o=this.container;e?(n="on",i="disable"):(n="off",i="enable"),r[i+"TextSelection"](o),r[i+"ImageDrag"](o),a[n](t.document,{mousemove:this._onMouseMove,mouseup:this._onMouseUp},this)},i.prototype._getEventData=function(e){return{target:e.target||e.srcElement,originEvent:e}},i.prototype._onMouseDown=function(e){0===a.getMouseButton(e)&&(this._distance=0,this._dragStartFired=!1,this._dragStartEventData=this._getEventData(e),this._toggleDragEvent(!0))},i.prototype._onMouseMove=function(e){var t=this.options.distance;return a.preventDefault(e),this._isMoved=!0,this._distancet)return e+"";for(;i HSV conversion utilities based off of http://www.cs.rit.edu/~ncs/color/t_convert.html +hexToRGB:function(e){var t,n,o;return!!i.isValidRGB(e)&&(e=e.substring(1),t=parseInt(e.substr(0,2),16),n=parseInt(e.substr(2,2),16),o=parseInt(e.substr(4,2),16),[t,n,o])},rgbToHEX:function(e,t,n){var o="#"+i.leadingZero(e.toString(16),2)+i.leadingZero(t.toString(16),2)+i.leadingZero(n.toString(16),2);return!!i.isValidRGB(o)&&o},rgbToHSV:function(e,t,n){var i,o,r,a,s,l;if(e/=255,t/=255,n/=255,i=Math.max(e,t,n),o=Math.min(e,t,n),s=i,l=i-o,a=0===i?0:l/i,i===o)r=0;else{switch(i){case e:r=(t-n)/l+(t{{colorList}}','
    ','','','{{color}}',"
    "].join("\n"),i='
    • ',o="background-color:{{color}};color:{{color}}";e.exports={layout:n,item:i,itemStyle:o}},function(e,t,n){"use strict";function i(e,t){t=r.appendHTMLElement("div",t,e.cssPrefix+"slider-container"),t.style.display="none",c.call(this,e,t),this.options=o.extend({color:"#f8f8f8",cssPrefix:"tui-colorpicker-"},e),this._dragDataCache={},this.sliderHandleElement=null,this.huebarHandleElement=null,this.baseColorElement=null,this.drag=new u({distance:0},t),this.drag.on({dragStart:this._onDragStart,drag:this._onDrag,dragEnd:this._onDragEnd,click:this._onClick},this)}var o=n(8),r=n(7),a=n(9),s=n(19),l=n(14),c=n(11),u=n(12),d=n(20),h=[-7,112],f=[-3,115],p=359.99;o.inherit(i,c),i.prototype._beforeDestroy=function(){this.drag.off(),this.drag=this.options=this._dragDataCache=this.sliderHandleElement=this.huebarHandleElement=this.baseColorElement=null},i.prototype.toggle=function(e){this.container.style.display=e?"block":"none"},i.prototype.isVisible=function(){return"block"===this.container.style.display},i.prototype.render=function(e){var t,n,i=this,o=i.container,a=i.options,s=d.layout;l.isValidRGB(e)&&(s=s.replace(/{{slider}}/,d.slider),s=s.replace(/{{huebar}}/,d.huebar),s=s.replace(/{{cssPrefix}}/g,a.cssPrefix),i.container.innerHTML=s,i.sliderHandleElement=r.find("."+a.cssPrefix+"slider-handle",o),i.huebarHandleElement=r.find("."+a.cssPrefix+"huebar-handle",o),i.baseColorElement=r.find("."+a.cssPrefix+"slider-basecolor",o),t=l.hexToRGB(e),n=l.rgbToHSV.apply(null,t),this.moveHue(n[0],!0),this.moveSaturationAndValue(n[1],n[2],!0))},i.prototype._moveColorSliderHandle=function(e,t,n){var i,o=this.sliderHandleElement;t=Math.max(h[0],t),t=Math.min(h[1],t),e=Math.max(h[0],e),e=Math.min(h[1],e),s.setTranslateXY(o,e,t),i=t>50?"white":"black",s.setStrokeColor(o,i),n||this.fire("_selectColor",{color:l.rgbToHEX.apply(null,this.getRGB())})},i.prototype.moveSaturationAndValue=function(e,t,n){var i,o,r,a;e=e||0,t=t||0,i=Math.abs(h[0]),o=h[1],r=e*o/100-i,a=o-t*o/100-i,this._moveColorSliderHandle(r,a,n)},i.prototype._moveColorSliderByPosition=function(e,t){var n=h[0];this._moveColorSliderHandle(e+n,t+n)},i.prototype.getSaturationAndValue=function(){var e,t,n=Math.abs(h[0]),i=n+h[1],o=s.getTranslateXY(this.sliderHandleElement);return e=(o[1]+n)/i*100,t=100-(o[0]+n)/i*100,[e,t]},i.prototype._moveHueHandle=function(e,t){var n,i,o=this.huebarHandleElement,r=this.baseColorElement;e=Math.max(f[0],e),e=Math.min(f[1],e),s.setTranslateY(o,e),n=l.hsvToRGB(this.getHue(),100,100),i=l.rgbToHEX.apply(null,n),s.setGradientColorStop(r,i),t||this.fire("_selectColor",{color:l.rgbToHEX.apply(null,this.getRGB())})},i.prototype.moveHue=function(e,t){var n,i,o=0;n=Math.abs(f[0]),i=n+f[1],e=e||0,o=i*e/p-n,this._moveHueHandle(o,t)},i.prototype._moveHueByPosition=function(e){var t=f[0];this._moveHueHandle(e+t)},i.prototype.getHue=function(){var e,t,n=this.huebarHandleElement,i=s.getTranslateXY(n);return e=Math.abs(f[0]),t=e+f[1],(i[0]+e)*p/t},i.prototype.getHSV=function(){var e=this.getSaturationAndValue(),t=this.getHue();return[t].concat(e)},i.prototype.getRGB=function(){return l.hsvToRGB.apply(null,this.getHSV())},i.prototype._prepareColorSliderForMouseEvent=function(e){var t,n=this.options,i=r.closest(e.target,"."+n.cssPrefix+"slider-part");return t=this._dragDataCache={isColorSlider:r.hasClass(i,n.cssPrefix+"slider-left"),parentElement:i}},i.prototype._onClick=function(e){var t=this._prepareColorSliderForMouseEvent(e),n=a.getMousePosition(e.originEvent,t.parentElement);t.isColorSlider?this._moveColorSliderByPosition(n[0],n[1]):this._moveHueByPosition(n[1]),this._dragDataCache=null},i.prototype._onDragStart=function(e){this._prepareColorSliderForMouseEvent(e)},i.prototype._onDrag=function(e){var t=this._dragDataCache,n=a.getMousePosition(e.originEvent,t.parentElement);t.isColorSlider?this._moveColorSliderByPosition(n[0],n[1]):this._moveHueByPosition(n[1])},i.prototype._onDragEnd=function(){this._dragDataCache=null},o.CustomEvents.mixin(i),e.exports=i},function(e,t,n){"use strict";var i=n(8),o=/[\.\-0-9]+/g,r=-6,a={isOldBrowser:function(){var e=a._isOldBrowser;return i.isExisty(e)||(a._isOldBrowser=e=i.browser.msie&&i.browser.version<9),e},getTranslateXY:function(e){var t;return a.isOldBrowser()?(t=e.style,[parseFloat(t.top),parseFloat(t.left)]):(t=e.getAttribute("transform"))?(t=t.match(o),[parseFloat(t[1]),parseFloat(t[0])]):[0,0]},setTranslateXY:function(e,t,n){a.isOldBrowser()?(e.style.left=t+"px",e.style.top=n+"px"):e.setAttribute("transform","translate("+t+","+n+")")},setTranslateY:function(e,t){a.isOldBrowser()?e.style.top=t+"px":e.setAttribute("transform","translate("+r+","+t+")")},setStrokeColor:function(e,t){a.isOldBrowser()?e.strokecolor=t:e.setAttribute("stroke",t)},setGradientColorStop:function(e,t){a.isOldBrowser()?e.color=t:e.setAttribute("stop-color",t)}};e.exports=a},function(e,t,n){(function(t){"use strict";var i=n(8),o=['
    {{slider}}
    ','
    {{huebar}}
    '].join("\n"),r=['',"",'','','',"",'','','',"","",'','','',""].join("\n"),a=['
    ','','',"",'','',"",'',"
    "].join("\n"),s=['',"",'','','','','','','','',"","",'','',""].join("\n"),l=['
    ','','',"",'',"
    "].join("\n"),c=i.browser.msie&&i.browser.version<9;c&&t.document.namespaces.add("v","urn:schemas-microsoft-com:vml"),e.exports={layout:o,slider:c?a:r,huebar:c?l:s}}).call(t,function(){return this}())}])})}])}); \ No newline at end of file From 0f80a82bec8d38d3a1f88fd266da25b9189c4e03 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B9=80=EC=A7=84=EC=9A=B0?= Date: Thu, 4 Oct 2018 17:06:10 +0900 Subject: [PATCH 06/10] chore: version up 3.2.1 --- dist/svg/icon-a.svg | 140 +++++---- dist/svg/icon-b.svg | 32 +- dist/svg/icon-c.svg | 142 +++++---- dist/svg/icon-d.svg | 142 +++++---- dist/tui-image-editor.css | 196 ++++++++---- dist/tui-image-editor.js | 542 ++++++++++++++++++++++------------ dist/tui-image-editor.min.css | 4 +- dist/tui-image-editor.min.js | 18 +- 8 files changed, 723 insertions(+), 493 deletions(-) diff --git a/dist/svg/icon-a.svg b/dist/svg/icon-a.svg index edd7b06ba..7e1efb817 100644 --- a/dist/svg/icon-a.svg +++ b/dist/svg/icon-a.svg @@ -1,19 +1,14 @@ - - - - - - + - + @@ -27,201 +22,202 @@ - - + + - + - + - + - + - - + + - - + + - - + + - + - + - - - - + + + + - + - + - + - + - + - - - - + + + + - + - + - + - + - + - - - + + + - - + + - - + + - - + + - - + + + - - + + + - - - - + + + - + - + - + - - + + - + - + - + - - + + - + - - + + - + @@ -229,8 +225,8 @@ - - + + diff --git a/dist/svg/icon-b.svg b/dist/svg/icon-b.svg index dc077e527..c1ea6256a 100644 --- a/dist/svg/icon-b.svg +++ b/dist/svg/icon-b.svg @@ -1,9 +1,4 @@ - - - - - - + @@ -64,10 +59,10 @@ - - - - + + + + @@ -145,20 +140,21 @@ - - + + + - - + + + - - - - + + + diff --git a/dist/svg/icon-c.svg b/dist/svg/icon-c.svg index 2c818c43f..8074cf08d 100644 --- a/dist/svg/icon-c.svg +++ b/dist/svg/icon-c.svg @@ -1,216 +1,212 @@ - - - - - - + - + - + - - + + - + - + - + - + - - + + - - + + - - + + - + - + - - - - + + + + - + - + - + - + - + - - - - + + + + - + - + - + - + - + - - - + + + - - + + - - + + - - + + - - + + + - - + + + - - - - + + + - + - + - + - - + + - + - + - + - - + + - + - - + + - + @@ -218,8 +214,8 @@ - - + + diff --git a/dist/svg/icon-d.svg b/dist/svg/icon-d.svg index aaf4bda0d..52e6ffa30 100644 --- a/dist/svg/icon-d.svg +++ b/dist/svg/icon-d.svg @@ -1,216 +1,212 @@ - - - - - - + - + - + - - + + - + - + - + - + - - + + - - + + - - + + - + - + - - - - + + + + - + - + - + - + - + - - - - + + + + - + - + - + - + - + - - - + + + - - + + - - + + - - + + - - + + + - - + + + - - - - + + + - + - + - + - - + + - + - + - + - - + + - + - - + + - + @@ -218,8 +214,8 @@ - - + + diff --git a/dist/tui-image-editor.css b/dist/tui-image-editor.css index e662918b2..88205318d 100644 --- a/dist/tui-image-editor.css +++ b/dist/tui-image-editor.css @@ -1,6 +1,6 @@ /*! * tui-image-editor.js - * @version 3.2.0 + * @version 3.2.1 * @author NHNEnt FE Development Lab * @license MIT */ @@ -16,6 +16,7 @@ body > textarea { position: relative; background-color: #282828; overflow: hidden; + letter-spacing: 0.3px; } .tui-image-editor-container div, .tui-image-editor-container ul, @@ -61,14 +62,17 @@ body > textarea { position: relative; width: 120px; height: 40px; + padding: 0; + line-height: 40px; outline: none; border-radius: 20px; border: 1px solid #ddd; - padding-top: 5px; - font-family: NotoSans, sans-serif; + font-family: 'Noto Sans', sans-serif; font-size: 12px; font-weight: bold; cursor: pointer; + vertical-align: middle; + letter-spacing: 0.3px; } .tui-image-editor-container .tui-image-editor-download-btn { background-color: #fdba3b; @@ -102,7 +106,7 @@ body > textarea { } .tui-image-editor-container .tui-image-editor-wrap { position: absolute; - bottom: 150px; + bottom: 0; width: 100%; overflow: auto; } @@ -116,7 +120,7 @@ body > textarea { vertical-align: middle; } .tui-image-editor-container .tui-image-editor { - position: static; + position: relative; display: inline-block; } .tui-image-editor-container .tui-image-editor-menu { @@ -178,6 +182,7 @@ body > textarea { position: absolute; width: 100%; height: 100%; + border: 1px solid rgba(255,255,255,0.7); } .tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor, .tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor { @@ -191,36 +196,36 @@ body > textarea { width: 100%; height: 100%; border-collapse: collapse; - box-shadow: 0 0 1px 0 rgba(0,0,0,0.3); } .tui-image-editor-container .tui-image-editor-grid-visual table td { - border: 1px solid #fff; - box-shadow: 0 0 1px 0 rgba(0,0,0,0.3); + border: 1px solid rgba(255,255,255,0.3); } .tui-image-editor-container .tui-image-editor-grid-visual table td.dot:before { content: ''; position: absolute; - width: 8px; - height: 8px; - border: 1px solid #cdcdcd; + box-sizing: border-box; + width: 10px; + height: 10px; + border: 0; + box-shadow: 0 0 1px 0 rgba(0,0,0,0.3); border-radius: 100%; background-color: #fff; } .tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-top:before { - top: -4px; - left: -4px; + top: -5px; + left: -5px; } .tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-top:before { - top: -4px; - right: -4px; + top: -5px; + right: -5px; } .tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-bottom:before { - bottom: -4px; - left: -4px; + bottom: -5px; + left: -5px; } .tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-bottom:before { - bottom: -4px; - right: -4px; + bottom: -5px; + right: -5px; } .tui-image-editor-container .tui-image-editor-submenu { display: none; @@ -229,6 +234,7 @@ body > textarea { width: 100%; height: 150px; white-space: nowrap; + z-index: 2; } .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover svg > use.active { display: block; @@ -239,7 +245,7 @@ body > textarea { } .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-newline { display: block; - margin-top: 14px; + margin-top: 0; } .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button { position: relative; @@ -247,15 +253,14 @@ body > textarea { display: inline-block; font-weight: normal; font-size: 11px; - margin: 0 7px 0 7px; + margin: 0 9px 0 9px; } .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item label { display: inline-block; cursor: pointer; padding-top: 5px; - font-family: NotoSans, sans-serif; + font-family: "Noto Sans", sans-serif; font-size: 11px; - letter-spacing: 0.7px; } .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.apply label, .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.cancel label { @@ -265,11 +270,21 @@ body > textarea { display: none; vertical-align: bottom; } +.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-style { + opacity: 0.95; + z-index: -1; + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + display: block; +} .tui-image-editor-container .tui-image-editor-partition > div { width: 1px; height: 52px; border-left: 1px solid #3c3c3c; - margin: 0 12px 0 14px; + margin: 0 8px 0 8px; } .tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-partition > div { height: 108px; @@ -345,7 +360,7 @@ body > textarea { width: 14px; height: 14px; background-color: #fff; - top: 4px; + top: 6px; left: -19px; display: inline-block; margin: 0; @@ -365,8 +380,8 @@ body > textarea { } .tui-image-editor-container .tui-image-editor-selectlist-wrap select { width: 100%; - height: 25px; - margin-top: 9px; + height: 28px; + margin-top: 4px; border: 0; outline: 0; border-radius: 0; @@ -375,25 +390,48 @@ body > textarea { -webkit-appearance: none; -moz-appearance: none; appearance: none; - padding: 0 7px 0 7px; + padding: 0 7px 0 10px; +} +.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist { + display: none; + position: relative; + top: -1px; + border: 1px solid #ccc; + background-color: #fff; + border-top: 0px; + padding: 4px 0; +} +.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist li { + display: block; + text-align: left; + padding: 7px 10px; + font-family: 'Noto Sans', sans-serif; +} +.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist li:hover { + background-color: rgba(81,92,230,0.05); } -.tui-image-editor-container .tui-image-editor-selectlist-wrap:after { +.tui-image-editor-container .tui-image-editor-selectlist-wrap:before { content: ''; position: absolute; display: inline-block; width: 14px; height: 14px; right: 5px; - bottom: 5px; + top: 10px; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAHlJREFUKBVjYBgFOEOAEVkmPDxc89+/f6eAYjzI4kD2FyYmJrOVK1deh4kzwRggGiQBVJCELAZig8SQNYHEmEEEMrh69eo1HR0dfqCYJUickZGxf9WqVf3IakBsFBthklpaWmVA9mEQhrJhUoTp0NBQCRAmrHL4qgAAuu4cWZOZIGsAAAAASUVORK5CYII="); background-size: cover; } .tui-image-editor-container .tui-image-editor-selectlist-wrap select::-ms-expand { display: none; } +.tui-image-editor-container .tui-image-editor-virtual-range-bar .tui-image-editor-disabled, +.tui-image-editor-container .tui-image-editor-virtual-range-subbar .tui-image-editor-disabled, +.tui-image-editor-container .tui-image-editor-virtual-range-pointer .tui-image-editor-disabled { + backbround-color: #f00; +} .tui-image-editor-container .tui-image-editor-range { position: relative; - top: 7px; + top: 5px; width: 166px; height: 17px; display: inline-block; @@ -424,12 +462,14 @@ body > textarea { } .tui-image-editor-container .tui-image-editor-range-wrap { display: inline-block; + margin-left: 4px; } .tui-image-editor-container .tui-image-editor-range-wrap.short .tui-image-editor-range { width: 100px; } .tui-image-editor-container .color-picker-control .tui-image-editor-range { width: 108px; + margin-left: 10px; } .tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-pointer { background-color: #333; @@ -441,8 +481,8 @@ body > textarea { background-color: #606060; } .tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short { - margin-top: 0; - margin-left: 17px; + margin-top: -2px; + margin-left: 19px; } .tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label { color: #8e8e8e; @@ -467,8 +507,9 @@ body > textarea { color: #fff; font-weight: lighter; vertical-align: baseline; - font-family: NotoSans, sans-serif; - padding-top: 2px; + font-family: 'Noto Sans', sans-serif; + margin-top: 21px; + margin-left: 4px; } .tui-image-editor-container .tui-image-editor-controls { position: absolute; @@ -477,7 +518,7 @@ body > textarea { height: 64px; display: table; bottom: 0; - z-index: 1; + z-index: 2; } .tui-image-editor-container .tui-image-editor-icpartition { display: inline-block; @@ -514,7 +555,7 @@ body > textarea { } .tui-image-editor-container.left .tui-image-editor-menu, .tui-image-editor-container.right .tui-image-editor-menu { - white-space: initial; + white-space: inherit; } .tui-image-editor-container.left .tui-image-editor-submenu, .tui-image-editor-container.right .tui-image-editor-submenu { @@ -578,10 +619,6 @@ body > textarea { .tui-image-editor-container.right .tui-image-editor-range { width: 136px; } -.tui-image-editor-container.left #tie-icon-add-button .tui-image-editor-button, -.tui-image-editor-container.right #tie-icon-add-button .tui-image-editor-button { - width: 45px; -} .tui-image-editor-container.right .tui-image-editor-menu > .tui-image-editor-item[title]:before { left: -3px; top: 11px; @@ -618,14 +655,14 @@ body > textarea { padding-bottom: 24px; } .tui-image-editor-container.top .color-picker-control .triangle { - top: -11px; - border-right: 12px solid transparent; + top: -8px; + border-right: 7px solid transparent; border-top: 0px; - border-left: 12px solid transparent; - border-bottom: 12px solid #fff; + border-left: 7px solid transparent; + border-bottom: 8px solid #fff; } .tui-image-editor-container.top .tui-image-editor-size-wrap { - height: calc(100% - 64px); + height: 100%; } .tui-image-editor-container.top .tui-image-editor-main-container { bottom: 0; @@ -655,12 +692,15 @@ body > textarea { } .tui-image-editor-container.top .tui-image-editor-main { top: 64px; - height: 100%; + height: calc(100% - 64px); } .tui-image-editor-container.top .tui-image-editor-controls { top: 0; bottom: inherit; } +.tui-image-editor-container #tie-icon-add-button .tui-image-editor-button { + min-width: 42px; +} .tui-image-editor-container .svg_ic-menu { width: 24px; height: 24px; @@ -676,6 +716,13 @@ body > textarea { .tui-image-editor-container .tui-image-editor-controls svg > use { display: none; } +.tui-image-editor-container .tui-image-editor-controls .enabled svg:hover > use.hover, +.tui-image-editor-container .tui-image-editor-controls .normal svg:hover > use.hover { + display: block; +} +.tui-image-editor-container .tui-image-editor-controls .active svg:hover > use.hover { + display: none; +} .tui-image-editor-container .tui-image-editor-controls svg > use.normal { display: block; } @@ -689,6 +736,9 @@ body > textarea { .tui-image-editor-container .tui-image-editor-controls .enabled svg > use.normal { display: none; } +.tui-image-editor-container .tui-image-editor-controls:hover { + z-index: 3; +} .tui-image-editor-container div.tui-colorpicker-clearfix { width: 159px; height: 28px; @@ -704,40 +754,58 @@ body > textarea { border: 0; font-size: 11px; margin-top: 2px; + font-family: 'Noto Sans', sans-serif; +} +.tui-image-editor-container .tui-colorpicker-palette-hex[value='#ffffff'] + .tui-colorpicker-palette-preview, +.tui-image-editor-container .tui-colorpicker-palette-hex[value=''] + .tui-colorpicker-palette-preview { + border: 1px solid #ccc; +} +.tui-image-editor-container .tui-colorpicker-palette-hex[value=''] + .tui-colorpicker-palette-preview { + background-size: cover; + background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAdBJREFUWAnFl0FuwjAQRZ0ukiugHqFSOQNdseuKW3ALzkA4BateICvUGyCxrtRFd4WuunH/TzykaYJrnLEYaTJJsP2+x8GZZCbQrLU5mj7Bn+EP8HvnCObd+R7xBV5lWfaNON4AnsA38E94qLEt+0yiFaBzAV/Bv+Cxxr4co7hKCDpw1q9wLeNYYdlAwyn8TYt8Hme3+8D5ozcTaMCZ68PXa2tnM2sbEcOZAJhrrpl2DAcTOGNjZPSfCdzkw6JrfbiMv+osBe4y9WOedhm4jZfhbENWuxS44H9Wz/xw4WzqLOAqh1+zycgAwzEMzr5k5gaHOa9ULBwuuDkFlHI1Kl4PJ66kgIpnoywOTmRFAYcbwYk9UMApWkD8zAV5ihcwHk4Rx7gl0IFTQL0EFc+CTQ9OZHWH3YhlVJiVpTHbrTGLhTHLZVgff6s9lyBsI9KduSS83oj+34rTwJutmBmCnMsvozRwZqB5GTkBw6/jdPDu69iJ6BYk6eCcfbcgcQIK/MByaaiMqm8rHcjol2TnpWDhyAKSGdA3FrxtJUToX0ODqatetfGE+8tyEUOV8GY5dGRwLP/MBS4RHQr4bT7NRAQjlcOTfZxmv2G+c4hI8nn+Ax5PG/zhI393AAAAAElFTkSuQmCC"); } .tui-image-editor-container .tui-colorpicker-palette-preview { border-radius: 100%; float: left; - width: 16px; - height: 16px; + width: 17px; + height: 17px; + border: 0; } .tui-image-editor-container .color-picker-control { position: absolute; display: none; z-index: 99; - width: 188px; - height: 112px; + width: 192px; background-color: #fff; - box-shadow: 0 3px 22px 0px #000; - padding: 14px; + box-shadow: 0 3px 22px 6px rgba(0,0,0,0.15); + padding: 16px; border-radius: 2px; } .tui-image-editor-container .color-picker-control .tui-colorpicker-palette-toggle-slider { display: none; } .tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button { + border: 0; border-radius: 100%; margin: 2px; + background-size: cover; + font-size: 1px; +} +.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button[title='#ffffff'] { + border: 1px solid #ccc; +} +.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button[title=''] { + border: 1px solid #ccc; } .tui-image-editor-container .color-picker-control .triangle { width: 0; height: 0; - border-right: 12px solid transparent; - border-top: 12px solid #fff; - border-left: 12px solid transparent; + border-right: 7px solid transparent; + border-top: 8px solid #fff; + border-left: 7px solid transparent; position: absolute; - bottom: -11px; - left: 77px; + bottom: -8px; + left: 84px; } .tui-image-editor-container .color-picker-control .tui-colorpicker-container, .tui-image-editor-container .color-picker-control .tui-colorpicker-palette-container ul, @@ -750,17 +818,23 @@ body > textarea { font-weight: normal; margin-right: 7pxleft; } +.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox { + margin-top: 0; +} +.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox input + label:before { + left: -16px; +} .tui-image-editor-container .color-picker { width: 100%; height: auto; } .tui-image-editor-container .color-picker-value { - width: 30px; - height: 30px; + width: 32px; + height: 32px; border: 0px; border-radius: 100%; margin: auto; - margin-bottom: 4px; + margin-bottom: 1px; } .tui-image-editor-container .color-picker-value.transparent { border: 1px solid #cbcbcb; diff --git a/dist/tui-image-editor.js b/dist/tui-image-editor.js index ee8459b5a..337c506b3 100644 --- a/dist/tui-image-editor.js +++ b/dist/tui-image-editor.js @@ -1,6 +1,6 @@ /*! * tui-image-editor.js - * @version 3.2.0 + * @version 3.2.1 * @author NHNEnt FE Development Lab * @license MIT */ @@ -939,6 +939,10 @@ return /******/ (function(modules) { // webpackBootstrap }, { key: '_onKeyDown', value: function _onKeyDown(e) { + var activeObject = this._graphics.getActiveObject(); + var activeObjectGroup = this._graphics.getActiveGroupObject(); + var existRemoveObject = activeObject || activeObjectGroup; + if ((e.ctrlKey || e.metaKey) && e.keyCode === keyCodes.Z) { // There is no error message on shortcut when it's empty this.undo()['catch'](function () {}); @@ -949,7 +953,7 @@ return /******/ (function(modules) { // webpackBootstrap this.redo()['catch'](function () {}); } - if (e.keyCode === keyCodes.BACKSPACE || e.keyCode === keyCodes.DEL) { + if ((e.keyCode === keyCodes.BACKSPACE || e.keyCode === keyCodes.DEL) && existRemoveObject) { e.preventDefault(); this.removeActiveObject(); } @@ -2040,7 +2044,14 @@ return /******/ (function(modules) { // webpackBootstrap /** * Get data url - * @param {string} type - A DOMString indicating the image format. The default type is image/png. + * @param {Object} options - options for toDataURL + * @param {String} [options.format=png] The format of the output image. Either "jpeg" or "png" + * @param {Number} [options.quality=1] Quality level (0..1). Only used for jpeg. + * @param {Number} [options.multiplier=1] Multiplier to scale by + * @param {Number} [options.left] Cropping left offset. Introduced in fabric v1.2.14 + * @param {Number} [options.top] Cropping top offset. Introduced in fabric v1.2.14 + * @param {Number} [options.width] Cropping width. Introduced in fabric v1.2.14 + * @param {Number} [options.height] Cropping height. Introduced in fabric v1.2.14 * @returns {string} A DOMString containing the requested data URI * @example * imgEl.src = imageEditor.toDataURL(); @@ -2052,8 +2063,8 @@ return /******/ (function(modules) { // webpackBootstrap }, { key: 'toDataURL', - value: function toDataURL(type) { - return this._graphics.toDataURL(type); + value: function toDataURL(options) { + return this._graphics.toDataURL(options); } /** @@ -4997,9 +5008,9 @@ return /******/ (function(modules) { // webpackBootstrap applyGroupSelectionStyle: true, selectionStyle: { cornerStyle: 'circle', - cornerSize: 20, + cornerSize: 16, cornerColor: '#fff', - cornerStrokeColor: '#000', + cornerStrokeColor: '#fff', transparentCorners: false, lineWidth: 2, borderColor: '#fff' @@ -5046,16 +5057,13 @@ return /******/ (function(modules) { // webpackBootstrap editorElementStyle.height = height + 'px'; editorElementStyle.width = width + 'px'; - var _getEditorPosition2 = this._getEditorPosition(menuBarPosition), - top = _getEditorPosition2.top, - bottom = _getEditorPosition2.bottom, - left = _getEditorPosition2.left, - right = _getEditorPosition2.right; + this._setEditorPosition(menuBarPosition); + + this._editorElementWrap.style.bottom = '0px'; + this._editorElementWrap.style.top = '0px'; + this._editorElementWrap.style.left = '0px'; + this._editorElementWrap.style.width = '100%'; - this._editorElementWrap.style.bottom = bottom + 'px'; - this._editorElementWrap.style.top = top + 'px'; - this._editorElementWrap.style.left = left + 'px'; - this._editorElementWrap.style.width = 'calc(100% - ' + right + 'px)'; var selectElementClassList = this._selectedElement.classList; if (menuBarPosition === 'top' && this._selectedElement.offsetWidth < BI_EXPRESSION_MINSIZE_WHEN_TOP_POSITION) { @@ -5277,13 +5285,16 @@ return /******/ (function(modules) { // webpackBootstrap var _theme$getStyle = this.theme.getStyle('menu.icon'), normal = _theme$getStyle.normal, - active = _theme$getStyle.active; + active = _theme$getStyle.active, + hover = _theme$getStyle.hover; - var menuItemHtml = '\n \n \n \n \n '; + var menuItemHtml = '\n \n \n \n \n \n '; btnElement.id = 'tie-btn-' + menuName; - btnElement.className = 'tui-image-editor-item'; - btnElement.title = menuName; + btnElement.className = 'tui-image-editor-item normal'; + btnElement.title = menuName.replace(/^[a-z]/g, function ($0) { + return $0.toUpperCase(); + }); btnElement.innerHTML = menuItemHtml; this._menuElement.appendChild(btnElement); @@ -5520,46 +5531,51 @@ return /******/ (function(modules) { // webpackBootstrap } /** - * Get editor position + * Set editor position * @param {string} menuBarPosition - top or right or bottom or left - * @returns {Object} - positions (top, right, bottom, left) * @private */ }, { - key: '_getEditorPosition', - value: function _getEditorPosition(menuBarPosition) { - var bottom = 0; + key: '_setEditorPosition', + value: function _setEditorPosition(menuBarPosition) { + var _getEditorDimension3 = this._getEditorDimension(), + width = _getEditorDimension3.width, + height = _getEditorDimension3.height; + + var editorElementStyle = this._editorElement.style; var top = 0; var left = 0; - var right = 0; if (this.submenu) { - switch (menuBarPosition) { - case 'bottom': - bottom += 150; - break; - case 'top': - top += 150; - break; - case 'left': - left += 248; - right += 248; - break; - case 'right': - right += 248; - break; - default: - break; + if (menuBarPosition === 'bottom') { + if (height > this._editorElementWrap.scrollHeight - 150) { + top = (height - this._editorElementWrap.scrollHeight) / 2; + } else { + top = 150 / 2 * -1; + } + } else if (menuBarPosition === 'top') { + if (height > this._editorElementWrap.offsetHeight - 150) { + top = 150 / 2 - (height - (this._editorElementWrap.offsetHeight - 150)) / 2; + } else { + top = 150 / 2; + } + } else if (menuBarPosition === 'left') { + if (width > this._editorElementWrap.offsetWidth - 248) { + left = 248 / 2 - (width - (this._editorElementWrap.offsetWidth - 248)) / 2; + } else { + left = 248 / 2; + } + } else if (menuBarPosition === 'right') { + if (width > this._editorElementWrap.scrollWidth - 248) { + left = (width - this._editorElementWrap.scrollWidth) / 2; + } else { + left = 248 / 2 * -1; + } } } - - return { - top: top, - bottom: bottom, - left: left, - right: right - }; + editorElementStyle.top = top + 'px'; + editorElementStyle.left = left + 'px'; } }]); @@ -5585,7 +5601,7 @@ return /******/ (function(modules) { // webpackBootstrap loadButtonStyle = _ref.loadButtonStyle, downloadButtonStyle = _ref.downloadButtonStyle, submenuStyle = _ref.submenuStyle; - return "\n
    \n
    \n
    \n \n
    \n
    \n \n \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n"; + return "\n
    \n
    \n
    \n \n
    \n
    \n \n \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n"; }; /***/ }), @@ -5602,10 +5618,11 @@ return /******/ (function(modules) { // webpackBootstrap var biImage = _ref.biImage, _ref$iconStyle = _ref.iconStyle, normal = _ref$iconStyle.normal, - active = _ref$iconStyle.active, + hover = _ref$iconStyle.hover, + disabled = _ref$iconStyle.disabled, loadButtonStyle = _ref.loadButtonStyle, downloadButtonStyle = _ref.downloadButtonStyle; - return "\n
    \n
    \n \n
    \n
      \n
    • \n \n \n \n \n
      • \n
    • \n \n \n \n \n
      • \n
    • \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    • \n \n \n \n \n
      • \n
    • \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    \n\n
    \n \n \n
    \n
    \n"; + return "\n
    \n
    \n \n
    \n
      \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    \n\n
    \n \n \n
    \n
    \n"; }; /***/ }), @@ -5672,7 +5689,9 @@ return /******/ (function(modules) { // webpackBootstrap case 'submenu.icon': result = { active: this.styles[firstProperty + '.activeIcon'], - normal: this.styles[firstProperty + '.normalIcon'] + normal: this.styles[firstProperty + '.normalIcon'], + hover: this.styles[firstProperty + '.hoverIcon'], + disabled: this.styles[firstProperty + '.disabledIcon'] }; break; case 'submenu.label': @@ -5687,6 +5706,10 @@ return /******/ (function(modules) { // webpackBootstrap horizontal: this._makeCssText((0, _tuiCodeSnippet.extend)({}, option, { borderBottom: '1px solid ' + option.color })) }; break; + + case 'range.disabledPointer': + case 'range.disabledBar': + case 'range.disabledSubbar': case 'range.pointer': case 'range.bar': case 'range.subbar': @@ -5723,6 +5746,11 @@ return /******/ (function(modules) { // webpackBootstrap submenuRangePointer: this.getStyle('range.pointer'), submenuRangeBar: this.getStyle('range.bar'), submenuRangeSubbar: this.getStyle('range.subbar'), + + submenuDisabledRangePointer: this.getStyle('range.disabledPointer'), + submenuDisabledRangeBar: this.getStyle('range.disabledBar'), + submenuDisabledRangeSubbar: this.getStyle('range.disabledSubbar'), + submenuRangeValue: this.getStyle('range.value'), submenuColorpickerTitle: this.getStyle('colorpicker.title'), submenuColorpickerButton: this.getStyle('colorpicker.button'), @@ -5776,6 +5804,7 @@ return /******/ (function(modules) { // webpackBootstrap if (['backgroundImage'].indexOf(key) > -1 && value !== 'none') { value = 'url(' + value + ')'; } + converterStack.push(_this._toUnderScore(key) + ': ' + value); }); @@ -5826,10 +5855,13 @@ return /******/ (function(modules) { // webpackBootstrap submenuColorpickerButton = _ref.submenuColorpickerButton, submenuRangeBar = _ref.submenuRangeBar, submenuRangeSubbar = _ref.submenuRangeSubbar, + submenuDisabledRangePointer = _ref.submenuDisabledRangePointer, + submenuDisabledRangeBar = _ref.submenuDisabledRangeBar, + submenuDisabledRangeSubbar = _ref.submenuDisabledRangeSubbar, submenuIconSize = _ref.submenuIconSize, menuIconSize = _ref.menuIconSize, biSize = _ref.biSize; - return "\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype=\"icon-bubble\"] label,\n #tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype=\"icon-heart\"] label,\n #tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype=\"icon-location\"] label,\n #tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype=\"icon-polygon\"] label,\n #tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype=\"icon-star\"] label,\n #tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype=\"icon-arrow-3\"] label,\n #tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype=\"icon-arrow-2\"] label,\n #tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype=\"icon-arrow\"] label,\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype=\"icon-bubble\"] label,\n #tie-draw-line-select-button.line .tui-image-editor-button.line label,\n #tie-draw-line-select-button.free .tui-image-editor-button.free label,\n #tie-flip-button.flipX .tui-image-editor-button.flipX label,\n #tie-flip-button.flipY .tui-image-editor-button.flipY label,\n #tie-flip-button.resetFlip .tui-image-editor-button.resetFlip label,\n #tie-crop-button .tui-image-editor-button.apply.active label,\n #tie-shape-button.rect .tui-image-editor-button.rect label,\n #tie-shape-button.circle .tui-image-editor-button.circle label,\n #tie-shape-button.triangle .tui-image-editor-button.triangle label,\n #tie-text-effect-button .tui-image-editor-button.active label,\n #tie-text-align-button.left .tui-image-editor-button.left label,\n #tie-text-align-button.center .tui-image-editor-button.center label,\n #tie-text-align-button.right .tui-image-editor-button.right label,\n #tie-mask-apply.apply.active .tui-image-editor-button.apply label,\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover > label,\n .tui-image-editor-container .tui-image-editor-checkbox input + label {\n " + subMenuLabelActive + "\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button > label,\n .tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label {\n " + subMenuLabelNormal + "\n }\n .tui-image-editor-container .tui-image-editor-range-wrap label {\n " + subMenuRangeTitle + "\n }\n .tui-image-editor-container .tui-image-editor-partition > div {\n " + submenuPartitionVertical + "\n }\n .tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition > div,\n .tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition > div {\n " + submenuPartitionHorizontal + "\n }\n .tui-image-editor-container .tui-image-editor-checkbox input + label:before {\n " + submenuCheckbox + "\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-pointer {\n " + submenuRangePointer + "\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-bar {\n " + submenuRangeBar + "\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-subbar {\n " + submenuRangeSubbar + "\n }\n .tui-image-editor-container .tui-image-editor-range-value {\n " + submenuRangeValue + "\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value + label {\n " + submenuColorpickerTitle + "\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value {\n " + submenuColorpickerButton + "\n }\n .tui-image-editor-container .svg_ic-menu {\n " + menuIconSize + "\n }\n .tui-image-editor-container .svg_ic-submenu {\n " + submenuIconSize + "\n }\n .tui-image-editor-container .tui-image-editor-controls-logo > img,\n .tui-image-editor-container .tui-image-editor-header-logo > img {\n " + biSize + "\n }\n\n"; + return "\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype=\"icon-bubble\"] label,\n #tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype=\"icon-heart\"] label,\n #tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype=\"icon-location\"] label,\n #tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype=\"icon-polygon\"] label,\n #tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype=\"icon-star\"] label,\n #tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype=\"icon-arrow-3\"] label,\n #tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype=\"icon-arrow-2\"] label,\n #tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype=\"icon-arrow\"] label,\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype=\"icon-bubble\"] label,\n #tie-draw-line-select-button.line .tui-image-editor-button.line label,\n #tie-draw-line-select-button.free .tui-image-editor-button.free label,\n #tie-flip-button.flipX .tui-image-editor-button.flipX label,\n #tie-flip-button.flipY .tui-image-editor-button.flipY label,\n #tie-flip-button.resetFlip .tui-image-editor-button.resetFlip label,\n #tie-crop-button .tui-image-editor-button.apply.active label,\n #tie-shape-button.rect .tui-image-editor-button.rect label,\n #tie-shape-button.circle .tui-image-editor-button.circle label,\n #tie-shape-button.triangle .tui-image-editor-button.triangle label,\n #tie-text-effect-button .tui-image-editor-button.active label,\n #tie-text-align-button.left .tui-image-editor-button.left label,\n #tie-text-align-button.center .tui-image-editor-button.center label,\n #tie-text-align-button.right .tui-image-editor-button.right label,\n #tie-mask-apply.apply.active .tui-image-editor-button.apply label,\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover > label,\n .tui-image-editor-container .tui-image-editor-checkbox input + label {\n " + subMenuLabelActive + "\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button > label,\n .tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label {\n " + subMenuLabelNormal + "\n }\n .tui-image-editor-container .tui-image-editor-range-wrap label {\n " + subMenuRangeTitle + "\n }\n .tui-image-editor-container .tui-image-editor-partition > div {\n " + submenuPartitionVertical + "\n }\n .tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition > div,\n .tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition > div {\n " + submenuPartitionHorizontal + "\n }\n .tui-image-editor-container .tui-image-editor-checkbox input + label:before {\n " + submenuCheckbox + "\n }\n .tui-image-editor-container .tui-image-editor-checkbox input:checked + label:before {\n border: 0;\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-pointer {\n " + submenuRangePointer + "\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-bar {\n " + submenuRangeBar + "\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-subbar {\n " + submenuRangeSubbar + "\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-pointer {\n " + submenuDisabledRangePointer + "\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-subbar {\n " + submenuDisabledRangeSubbar + "\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-bar {\n " + submenuDisabledRangeBar + "\n }\n .tui-image-editor-container .tui-image-editor-range-value {\n " + submenuRangeValue + "\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value + label {\n " + submenuColorpickerTitle + "\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value {\n " + submenuColorpickerButton + "\n }\n .tui-image-editor-container .svg_ic-menu {\n " + menuIconSize + "\n }\n .tui-image-editor-container .svg_ic-submenu {\n " + submenuIconSize + "\n }\n .tui-image-editor-container .tui-image-editor-controls-logo > img,\n .tui-image-editor-container .tui-image-editor-header-logo > img {\n " + biSize + "\n }\n\n"; }; /***/ }), @@ -5993,21 +6025,25 @@ return /******/ (function(modules) { // webpackBootstrap 'loadButton.backgroundColor': '#fff', 'loadButton.border': '1px solid #ddd', 'loadButton.color': '#222', - 'loadButton.fontFamily': 'NotoSans, sans-serif', + 'loadButton.fontFamily': '"Noto Sans", sans-serif', 'loadButton.fontSize': '12px', // download button 'downloadButton.backgroundColor': '#fdba3b', 'downloadButton.border': '1px solid #fdba3b', 'downloadButton.color': '#fff', - 'downloadButton.fontFamily': 'NotoSans, sans-serif', + 'downloadButton.fontFamily': '"Noto Sans", sans-serif', 'downloadButton.fontSize': '12px', // main icons - 'menu.normalIcon.path': 'icon-b.svg', - 'menu.normalIcon.name': 'icon-b', - 'menu.activeIcon.path': 'icon-a.svg', - 'menu.activeIcon.name': 'icon-a', + 'menu.normalIcon.path': 'icon-d.svg', + 'menu.normalIcon.name': 'icon-d', + 'menu.activeIcon.path': 'icon-b.svg', + 'menu.activeIcon.name': 'icon-b', + 'menu.disabledIcon.path': 'icon-a.svg', + 'menu.disabledIcon.name': 'icon-a', + 'menu.hoverIcon.path': 'icon-c.svg', + 'menu.hoverIcon.name': 'icon-c', 'menu.iconSize.width': '24px', 'menu.iconSize.height': '24px', @@ -6037,6 +6073,9 @@ return /******/ (function(modules) { // webpackBootstrap 'range.pointer.color': '#fff', 'range.bar.color': '#666', 'range.subbar.color': '#d1d1d1', + 'range.disabledPointer.color': 'red', + 'range.disabledBar.color': 'blue', + 'range.disabledSubbar.color': 'red', 'range.value.color': '#fff', 'range.value.fontWeight': 'lighter', 'range.value.fontSize': '11px', @@ -6129,6 +6168,9 @@ return /******/ (function(modules) { // webpackBootstrap fillColorpicker: new _colorpicker2.default(_this.selector('#tie-color-fill'), '', _this.toggleDirection), strokeColorpicker: new _colorpicker2.default(_this.selector('#tie-color-stroke'), '#ffbb3b', _this.toggleDirection) }; + + _this.colorPickerControls.push(_this._els.fillColorpicker); + _this.colorPickerControls.push(_this._els.strokeColorpicker); return _this; } @@ -6149,6 +6191,8 @@ return /******/ (function(modules) { // webpackBootstrap this._els.strokeRange.on('change', this._changeStrokeRangeHandler.bind(this)); this._els.fillColorpicker.on('change', this._changeFillColorHandler.bind(this)); this._els.strokeColorpicker.on('change', this._changeStrokeColorHandler.bind(this)); + this._els.fillColorpicker.on('changeShow', this.colorPickerChangeShow.bind(this)); + this._els.strokeColorpicker.on('changeShow', this.colorPickerChangeShow.bind(this)); this._els.strokeRangeValue.value = this._els.strokeRange.value; this._els.strokeRangeValue.setAttribute('readonly', true); } @@ -6341,8 +6385,6 @@ return /******/ (function(modules) { // webpackBootstrap var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); - var _util = __webpack_require__(72); - var _tuiColorPicker = __webpack_require__(82); var _tuiColorPicker2 = _interopRequireDefault(_tuiColorPicker); @@ -6370,6 +6412,7 @@ return /******/ (function(modules) { // webpackBootstrap this._show = false; + this._colorpickerElement = colorpickerElement; this._toggleDirection = toggleDirection; this._makePickerButtonElement(colorpickerElement, defaultColor); this._makePickerLayerElement(colorpickerElement, title); @@ -6457,8 +6500,6 @@ return /******/ (function(modules) { // webpackBootstrap colorpickerElement.appendChild(this.pickerControl); colorpickerElement.appendChild(this.colorElement); colorpickerElement.appendChild(label); - - this._setPickerControlPosition(); } /** @@ -6480,13 +6521,20 @@ return /******/ (function(modules) { // webpackBootstrap colorpickerElement.addEventListener('click', function (event) { _this._show = !_this._show; _this.pickerControl.style.display = _this._show ? 'block' : 'none'; + _this._setPickerControlPosition(); + _this.fire('changeShow', _this); event.stopPropagation(); }); document.body.addEventListener('click', function () { - _this._show = false; - _this.pickerControl.style.display = 'none'; + _this.hide(); }); } + }, { + key: 'hide', + value: function hide() { + this._show = false; + this.pickerControl.style.display = 'none'; + } /** * Set picker control position @@ -6497,8 +6545,9 @@ return /******/ (function(modules) { // webpackBootstrap key: '_setPickerControlPosition', value: function _setPickerControlPosition() { var controlStyle = this.pickerControl.style; - var left = (0, _util.toInteger)(window.getComputedStyle(this.pickerControl, null).width) / 2 - 20; - var top = ((0, _util.toInteger)(window.getComputedStyle(this.pickerControl, null).height) + 12) * -1; + var halfPickerWidth = this._colorpickerElement.clientWidth / 2 + 2; + var left = this.pickerControl.offsetWidth / 2 - halfPickerWidth; + var top = (this.pickerControl.offsetHeight + 10) * -1; if (this._toggleDirection === 'down') { top = 30; @@ -9982,7 +10031,7 @@ return /******/ (function(modules) { // webpackBootstrap 'use strict'; Object.defineProperty(exports, "__esModule", { - value: true + value: true }); var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); @@ -9995,95 +10044,105 @@ return /******/ (function(modules) { // webpackBootstrap * @ignore */ var Submenu = function () { - function Submenu(subMenuElement, _ref) { - var name = _ref.name, - iconStyle = _ref.iconStyle, - menuBarPosition = _ref.menuBarPosition, - templateHtml = _ref.templateHtml; + function Submenu(subMenuElement, _ref) { + var name = _ref.name, + iconStyle = _ref.iconStyle, + menuBarPosition = _ref.menuBarPosition, + templateHtml = _ref.templateHtml; - _classCallCheck(this, Submenu); + _classCallCheck(this, Submenu); - this.selector = function (str) { - return subMenuElement.querySelector(str); - }; - this.menuBarPosition = menuBarPosition; - this.toggleDirection = menuBarPosition === 'top' ? 'down' : 'up'; - this._makeSubMenuElement(subMenuElement, { - name: name, - iconStyle: iconStyle, - templateHtml: templateHtml - }); - } + this.selector = function (str) { + return subMenuElement.querySelector(str); + }; + this.menuBarPosition = menuBarPosition; + this.toggleDirection = menuBarPosition === 'top' ? 'down' : 'up'; + this.colorPickerControls = []; + this._makeSubMenuElement(subMenuElement, { + name: name, + iconStyle: iconStyle, + templateHtml: templateHtml + }); + } - /** - * Get butten type - * @param {HTMLElement} button - event target element - * @param {array} buttonNames - Array of button names - * @returns {string} - button type - */ + _createClass(Submenu, [{ + key: 'colorPickerChangeShow', + value: function colorPickerChangeShow(occurredControl) { + this.colorPickerControls.forEach(function (pickerControl) { + if (occurredControl !== pickerControl) { + pickerControl.hide(); + } + }); + } + /** + * Get butten type + * @param {HTMLElement} button - event target element + * @param {array} buttonNames - Array of button names + * @returns {string} - button type + */ - _createClass(Submenu, [{ - key: 'getButtonType', - value: function getButtonType(button, buttonNames) { - return button.className.match(RegExp('(' + buttonNames.join('|') + ')'))[0]; - } + }, { + key: 'getButtonType', + value: function getButtonType(button, buttonNames) { + return button.className.match(RegExp('(' + buttonNames.join('|') + ')'))[0]; + } - /** - * Get butten type - * @param {HTMLElement} target - event target element - * @param {string} removeClass - remove class name - * @param {string} addClass - add class name - */ + /** + * Get butten type + * @param {HTMLElement} target - event target element + * @param {string} removeClass - remove class name + * @param {string} addClass - add class name + */ - }, { - key: 'changeClass', - value: function changeClass(target, removeClass, addClass) { - target.classList.remove(removeClass); - target.classList.add(addClass); - } + }, { + key: 'changeClass', + value: function changeClass(target, removeClass, addClass) { + target.classList.remove(removeClass); + target.classList.add(addClass); + } - /** - * Interface method whose implementation is optional. - * Returns the menu to its default state. - */ + /** + * Interface method whose implementation is optional. + * Returns the menu to its default state. + */ - }, { - key: 'changeStandbyMode', - value: function changeStandbyMode() {} + }, { + key: 'changeStandbyMode', + value: function changeStandbyMode() {} - /** - * Interface method whose implementation is optional. - * Executed when the menu starts. - */ + /** + * Interface method whose implementation is optional. + * Executed when the menu starts. + */ - }, { - key: 'changeStartMode', - value: function changeStartMode() {} + }, { + key: 'changeStartMode', + value: function changeStartMode() {} - /** - * Make submenu dom element - * @param {HTMLElement} subMenuElement - subment dom element - * @param {Object} iconStyle - icon style - * @private - */ + /** + * Make submenu dom element + * @param {HTMLElement} subMenuElement - subment dom element + * @param {Object} iconStyle - icon style + * @private + */ - }, { - key: '_makeSubMenuElement', - value: function _makeSubMenuElement(subMenuElement, _ref2) { - var name = _ref2.name, - iconStyle = _ref2.iconStyle, - templateHtml = _ref2.templateHtml; + }, { + key: '_makeSubMenuElement', + value: function _makeSubMenuElement(subMenuElement, _ref2) { + var name = _ref2.name, + iconStyle = _ref2.iconStyle, + templateHtml = _ref2.templateHtml; - var iconSubMenu = document.createElement('div'); - iconSubMenu.className = 'tui-image-editor-menu-' + name; - iconSubMenu.innerHTML = templateHtml({ iconStyle: iconStyle }); + var iconSubMenu = document.createElement('div'); + iconSubMenu.className = 'tui-image-editor-menu-' + name; + iconSubMenu.innerHTML = templateHtml({ iconStyle: iconStyle }); - subMenuElement.appendChild(iconSubMenu); - } - }]); + subMenuElement.appendChild(iconSubMenu); + } + }]); - return Submenu; + return Submenu; }(); exports.default = Submenu; @@ -10102,7 +10161,7 @@ return /******/ (function(modules) { // webpackBootstrap var _ref$iconStyle = _ref.iconStyle, normal = _ref$iconStyle.normal, active = _ref$iconStyle.active; - return "\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n"; + return "\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n"; }; /***/ }), @@ -10771,7 +10830,7 @@ return /******/ (function(modules) { // webpackBootstrap var _ref$iconStyle = _ref.iconStyle, normal = _ref$iconStyle.normal, active = _ref$iconStyle.active; - return "\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n"; + return "\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n"; }; /***/ }), @@ -10908,7 +10967,7 @@ return /******/ (function(modules) { // webpackBootstrap var _ref$iconStyle = _ref.iconStyle, normal = _ref$iconStyle.normal, active = _ref$iconStyle.active; - return "\n
      \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n \n \n \n \n \n
      \n
      • \n
    \n"; + return "\n
      \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n \n \n \n \n \n
      \n
      • \n
    \n"; }; /***/ }), @@ -11135,7 +11194,7 @@ return /******/ (function(modules) { // webpackBootstrap var _ref$iconStyle = _ref.iconStyle, normal = _ref$iconStyle.normal, active = _ref$iconStyle.active; - return "\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    \n"; + return "\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    \n"; }; /***/ }), @@ -11431,6 +11490,8 @@ return /******/ (function(modules) { // webpackBootstrap templateHtml: _filter2.default })); + _this.selectBoxShow = false; + _this.checkedMap = {}; _this._makeControlElement(); return _this; @@ -11450,12 +11511,7 @@ return /******/ (function(modules) { // webpackBootstrap var applyFilter = _ref2.applyFilter; - var changeRangeValue = function changeRangeValue(filterName) { - var apply = _this2.checkedMap[filterName].checked; - var type = filterName; - - applyFilter(apply, type, _this2._getFilterOption(type)); - }; + var changeRangeValue = this._changeRangeValue.bind(this, applyFilter); _tuiCodeSnippet2.default.forEach(FILTER_OPTIONS, function (filterName) { var filterCheckElement = _this2.selector('#tie-' + filterName); @@ -11506,6 +11562,32 @@ return /******/ (function(modules) { // webpackBootstrap this._els.blendType.addEventListener('click', function (event) { return event.stopPropagation(); }); + this._els.filterMultiplyColor.on('changeShow', this.colorPickerChangeShow.bind(this)); + this._els.filterTintColor.on('changeShow', this.colorPickerChangeShow.bind(this)); + this._els.filterBlendColor.on('changeShow', this.colorPickerChangeShow.bind(this)); + } + + /** + * Add event for filter + * @param {Function} applyFilter - actions for firter + * @param {string} filterName - filter name + */ + + }, { + key: '_changeRangeValue', + value: function _changeRangeValue(applyFilter, filterName) { + var apply = this.checkedMap[filterName].checked; + var type = filterName; + + var checkboxGroup = this.checkedMap[filterName].closest('.tui-image-editor-checkbox-group'); + if (checkboxGroup) { + if (apply) { + checkboxGroup.classList.remove('tui-image-editor-disabled'); + } else { + checkboxGroup.classList.add('tui-image-editor-disabled'); + } + } + applyFilter(apply, type, this._getFilterOption(type)); } /** @@ -11581,8 +11663,13 @@ return /******/ (function(modules) { // webpackBootstrap filterMultiplyColor: new _colorpicker2.default(selector('#tie-filter-multiply-color'), '#515ce6', this.toggleDirection), filterBlendColor: new _colorpicker2.default(selector('#tie-filter-blend-color'), '#ffbb3b', this.toggleDirection) }; + this._els.tintOpacity = this._pickerWithRange(this._els.filterTintColor.pickerControl); this._els.blendType = this._pickerWithSelectbox(this._els.filterBlendColor.pickerControl); + + this.colorPickerControls.push(this._els.filterTintColor); + this.colorPickerControls.push(this._els.filterMultiplyColor); + this.colorPickerControls.push(this._els.filterBlendColor); } /** @@ -11621,20 +11708,80 @@ return /******/ (function(modules) { // webpackBootstrap value: function _pickerWithSelectbox(pickerControl) { var selectlistWrap = document.createElement('div'); var selectlist = document.createElement('select'); + var optionlist = document.createElement('ul'); selectlistWrap.className = 'tui-image-editor-selectlist-wrap'; + optionlist.className = 'tui-image-editor-selectlist'; + selectlistWrap.appendChild(selectlist); + selectlistWrap.appendChild(optionlist); this._makeSelectOptionList(selectlist); pickerControl.appendChild(selectlistWrap); pickerControl.style.height = PICKER_CONTROL_HEIGHT; + this._drawSelectOptionList(selectlist, optionlist); + this._pickerWithSelectboxForAddEvent(selectlist, optionlist); + return selectlist; } /** - * Make blend select option + * Make selectbox option list custom style + * @param {HTMLElement} selectlist - selectbox element + * @param {HTMLElement} optionlist - custom option list item element + * @private + */ + + }, { + key: '_drawSelectOptionList', + value: function _drawSelectOptionList(selectlist, optionlist) { + var options = selectlist.querySelectorAll('option'); + _tuiCodeSnippet2.default.forEach(options, function (option) { + var optionElement = document.createElement('li'); + optionElement.innerHTML = option.innerHTML; + optionElement.setAttribute('data-item', option.value); + optionlist.appendChild(optionElement); + }); + } + + /** + * custome selectbox custom event + * @param {HTMLElement} selectlist - selectbox element + * @param {HTMLElement} optionlist - custom option list item element + * @private + */ + + }, { + key: '_pickerWithSelectboxForAddEvent', + value: function _pickerWithSelectboxForAddEvent(selectlist, optionlist) { + var _this3 = this; + + optionlist.addEventListener('click', function (event) { + var optionValue = event.target.getAttribute('data-item'); + var fireEvent = document.createEvent('HTMLEvents'); + + selectlist.querySelector('[value="' + optionValue + '"]').selected = true; + fireEvent.initEvent('change', true, true); + + selectlist.dispatchEvent(fireEvent); + + _this3.selectBoxShow = false; + optionlist.style.display = 'none'; + }); + + selectlist.addEventListener('mousedown', function (event) { + event.preventDefault(); + _this3.selectBoxShow = !_this3.selectBoxShow; + optionlist.style.display = _this3.selectBoxShow ? 'block' : 'none'; + optionlist.setAttribute('data-selectitem', selectlist.value); + optionlist.querySelector('[data-item=\'' + selectlist.value + '\']').classList.add('active'); + }); + } + + /** + * Make option list for select control * @param {HTMLElement} selectlist - blend option select list element * @private */ @@ -11669,7 +11816,7 @@ return /******/ (function(modules) { // webpackBootstrap }); exports.default = function () { - return "\n
      \n
    • \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n\n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      • \n
    \n"; + return "\n
      \n
    • \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n\n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      • \n
    \n"; }; /***/ }), @@ -12148,7 +12295,8 @@ return /******/ (function(modules) { // webpackBootstrap position: pos.originPosition, styles: { fill: _this11.ui.text.textColor, - fontSize: _util2.default.toInteger(_this11.ui.text.fontSize) + fontSize: _util2.default.toInteger(_this11.ui.text.fontSize), + fontFamily: 'Noto Sans' } }).then(function () { _this11.changeCursor('default'); @@ -13922,14 +14070,21 @@ return /******/ (function(modules) { // webpackBootstrap /** * To data url from canvas - * @param {string} type - A DOMString indicating the image format. The default type is image/png. + * @param {Object} options - options for toDataURL + * @param {String} [options.format=png] The format of the output image. Either "jpeg" or "png" + * @param {Number} [options.quality=1] Quality level (0..1). Only used for jpeg. + * @param {Number} [options.multiplier=1] Multiplier to scale by + * @param {Number} [options.left] Cropping left offset. Introduced in fabric v1.2.14 + * @param {Number} [options.top] Cropping top offset. Introduced in fabric v1.2.14 + * @param {Number} [options.width] Cropping width. Introduced in fabric v1.2.14 + * @param {Number} [options.height] Cropping height. Introduced in fabric v1.2.14 * @returns {string} A DOMString containing the requested data URI. */ }, { key: 'toDataURL', - value: function toDataURL(type) { - return this._canvas && this._canvas.toDataURL(type); + value: function toDataURL(options) { + return this._canvas && this._canvas.toDataURL(options); } /** @@ -15555,6 +15710,9 @@ return /******/ (function(modules) { // webpackBootstrap if (this.options.lineWidth) { this._fillInnerRect(ctx); + this._strokeBorder(ctx, 'rgb(255, 255, 255)', { + lineWidth: this.options.lineWidth + }); } else { // Black dash line this._strokeBorder(ctx, 'rgb(0, 0, 0)', { @@ -17516,47 +17674,61 @@ return /******/ (function(modules) { // webpackBootstrap var canvas = _this2.getCanvas(); var path = _this2._pathMap[type]; var selectionStyle = _consts2.default.fObjectOptions.SELECTION_STYLE; + var registerdIcon = Object.keys(_consts2.default.defaultIconPath).indexOf(type) >= 0; + var useDragAddIcon = _this2.useDragAddIcon && registerdIcon; + var icon = path ? _this2._createIcon(path) : null; - if (!path) { + if (!icon) { reject(rejectMessages.invalidParameters); } - var icon = _this2._createIcon(path); - icon.set(_tuiCodeSnippet2.default.extend({ type: 'icon', fill: _this2._oColor }, selectionStyle, options, _this2.graphics.controlStyle)); - if (_this2.useDragAddIcon) { - canvas.add(icon).setActiveObject(icon); - canvas.on({ - 'mouse:move': function mouseMove(fEvent) { - canvas.selection = false; - - _this2.fire(events.ICON_CREATE_RESIZE, { - moveOriginPointer: canvas.getPointer(fEvent.e) - }); - }, - 'mouse:up': function mouseUp(fEvent) { - _this2.fire(events.ICON_CREATE_END, { - moveOriginPointer: canvas.getPointer(fEvent.e) - }); + canvas.add(icon).setActiveObject(icon); - canvas.defaultCursor = 'default'; - canvas.off('mouse:up'); - canvas.off('mouse:move'); - canvas.selection = true; - } - }); - } else { - canvas.add(icon).setActiveObject(icon); + if (useDragAddIcon) { + _this2._addWithDragEvent(canvas); } resolve(_this2.graphics.createObjectProperties(icon)); }); } + /** + * Added icon drag event + * @param {fabric.Canvas} canvas - Canvas instance + * @private + */ + + }, { + key: '_addWithDragEvent', + value: function _addWithDragEvent(canvas) { + var _this3 = this; + + canvas.on({ + 'mouse:move': function mouseMove(fEvent) { + canvas.selection = false; + + _this3.fire(events.ICON_CREATE_RESIZE, { + moveOriginPointer: canvas.getPointer(fEvent.e) + }); + }, + 'mouse:up': function mouseUp(fEvent) { + _this3.fire(events.ICON_CREATE_END, { + moveOriginPointer: canvas.getPointer(fEvent.e) + }); + + canvas.defaultCursor = 'default'; + canvas.off('mouse:up'); + canvas.off('mouse:move'); + canvas.selection = true; + } + }); + } + /** * Register icon paths * @param {{key: string, value: string}} pathInfos - Path infos @@ -17565,10 +17737,10 @@ return /******/ (function(modules) { // webpackBootstrap }, { key: 'registerPaths', value: function registerPaths(pathInfos) { - var _this3 = this; + var _this4 = this; _tuiCodeSnippet2.default.forEach(pathInfos, function (path, type) { - _this3._pathMap[type] = path; + _this4._pathMap[type] = path; }, this); } diff --git a/dist/tui-image-editor.min.css b/dist/tui-image-editor.min.css index 35d0a5d0e..9fd50b180 100644 --- a/dist/tui-image-editor.min.css +++ b/dist/tui-image-editor.min.css @@ -1,7 +1,7 @@ /*! * tui-image-editor.min.js - * @version 3.2.0 + * @version 3.2.1 * @author NHNEnt FE Development Lab * @license MIT */ -body>textarea{position:fixed!important}.tui-image-editor-container{marign:0;padding:0;box-sizing:border-box;min-height:300px;height:100%;position:relative;background-color:#282828;overflow:hidden}.tui-image-editor-container div,.tui-image-editor-container input,.tui-image-editor-container label,.tui-image-editor-container li,.tui-image-editor-container ul{box-sizing:border-box;margin:0;padding:0;-ms-user-select:none;-moz-user-select:-moz-none;-khtml-user-select:none;-webkit-user-select:none;user-select:none}.tui-image-editor-container .tui-image-editor-header{min-width:533px;position:absolute;background-color:#151515;top:0;width:100%}.tui-image-editor-container .tui-image-editor-controls-buttons,.tui-image-editor-container .tui-image-editor-header-buttons{float:right;margin:8px}.tui-image-editor-container .tui-image-editor-controls-logo,.tui-image-editor-container .tui-image-editor-header-logo{float:left;width:30%;padding:17px}.tui-image-editor-container .tui-image-editor-controls-buttons,.tui-image-editor-container .tui-image-editor-controls-logo{width:270px;height:100%;display:none}.tui-image-editor-container .tui-image-editor-controls-buttons button,.tui-image-editor-container .tui-image-editor-header-buttons button{position:relative;width:120px;height:40px;outline:none;border-radius:20px;border:1px solid #ddd;padding-top:5px;font-family:NotoSans,sans-serif;font-size:12px;font-weight:700;cursor:pointer}.tui-image-editor-container .tui-image-editor-download-btn{background-color:#fdba3b;border-color:#fdba3b;color:#fff}.tui-image-editor-container .tui-image-editor-load-btn{position:absolute;left:0;right:0;display:inline-block;top:0;bottom:0;width:100%;cursor:pointer;opacity:0}.tui-image-editor-container .tui-image-editor-main-container{position:absolute;width:100%;top:0;bottom:64px}.tui-image-editor-container .tui-image-editor-main{position:absolute;text-align:center;top:64px;bottom:0;right:0;left:0}.tui-image-editor-container .tui-image-editor-wrap{bottom:150px;width:100%;overflow:auto}.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap{display:table;width:100%;height:100%}.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap .tui-image-editor-align-wrap{display:table-cell;vertical-align:middle}.tui-image-editor-container .tui-image-editor{position:static;display:inline-block}.tui-image-editor-container .tui-image-editor-menu{width:auto;list-style:none;padding:0;margin:0 auto;display:table-cell;text-align:center;vertical-align:middle;white-space:nowrap}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item{position:relative;display:inline-block;border-radius:2px;padding:7px 8px 3px;cursor:pointer;margin:0 4px}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item[title]:hover:before{content:"";display:inline-block;margin:0 auto;width:0;height:0;border-right:7px solid transparent;border-top:7px solid #2f2f2f;border-left:7px solid transparent;position:absolute;left:13px;top:-2px}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item[title]:hover:after{content:attr(title);position:absolute;display:inline-block;background-color:#2f2f2f;color:#fff;padding:5px 8px;font-size:11px;font-weight:lighter;border-radius:3px;max-height:23px;top:-22px;left:0;min-width:24px}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item.active{background-color:#fff;transition:all .3s ease}.tui-image-editor-container .tui-image-editor-wrap{position:absolute}.tui-image-editor-container .tui-image-editor-grid-visual{display:none;position:absolute;width:100%;height:100%}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor{transition:none}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-grid-visual,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-grid-visual{display:block}.tui-image-editor-container .tui-image-editor-grid-visual table{width:100%;height:100%;border-collapse:collapse;box-shadow:0 0 1px 0 rgba(0,0,0,.3)}.tui-image-editor-container .tui-image-editor-grid-visual table td{border:1px solid #fff;box-shadow:0 0 1px 0 rgba(0,0,0,.3)}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot:before{content:"";position:absolute;width:8px;height:8px;border:1px solid #cdcdcd;border-radius:100%;background-color:#fff}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-top:before{top:-4px;left:-4px}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-top:before{top:-4px;right:-4px}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-bottom:before{bottom:-4px;left:-4px}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-bottom:before{bottom:-4px;right:-4px}.tui-image-editor-container .tui-image-editor-submenu{display:none;position:absolute;bottom:0;width:100%;height:150px;white-space:nowrap}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover svg>use.active{display:block}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item li{display:inline-block;vertical-align:top}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-newline{display:block;margin-top:14px}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button{position:relative;cursor:pointer;display:inline-block;font-weight:400;font-size:11px;margin:0 7px}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item label{display:inline-block;cursor:pointer;padding-top:5px;font-family:NotoSans,sans-serif;font-size:11px;letter-spacing:.7px}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.apply label,.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.cancel label{vertical-align:7px}.tui-image-editor-container .tui-image-editor-submenu>div{display:none;vertical-align:bottom}.tui-image-editor-container .tui-image-editor-partition>div{width:1px;height:52px;border-left:1px solid #3c3c3c;margin:0 12px 0 14px}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-partition>div{height:108px;margin:0 29px 0 0}.tui-image-editor-container .tui-image-editor-submenu-align{text-align:left;margin-right:30px}.tui-image-editor-container .tui-image-editor-submenu-align label{width:55px;white-space:nowrap}.tui-image-editor-container .tui-image-editor-submenu-align:first-child{margin-right:0}.tui-image-editor-container .tui-image-editor-submenu-align:first-child label{width:70px}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-crop .tui-image-editor-submenu>div.tui-image-editor-menu-crop,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-draw .tui-image-editor-submenu>div.tui-image-editor-menu-draw,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-submenu>div.tui-image-editor-menu-filter,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-submenu>div.tui-image-editor-menu-flip,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-icon .tui-image-editor-submenu>div.tui-image-editor-menu-icon,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-mask .tui-image-editor-submenu>div.tui-image-editor-menu-mask,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-submenu>div.tui-image-editor-menu-rotate,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-shape .tui-image-editor-submenu>div.tui-image-editor-menu-shape,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-text .tui-image-editor-submenu>div.tui-image-editor-menu-text{display:table-cell}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-crop .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-draw .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-icon .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-mask .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-shape .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-text .tui-image-editor-submenu{display:table}.tui-image-editor-container .filter-color-item{display:inline-block}.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox{display:block}.tui-image-editor-container .tui-image-editor-checkbox-wrap{display:inline-block!important;text-align:left}.tui-image-editor-container .tui-image-editor-checkbox-wrap.fixed-width{width:187px;white-space:normal}.tui-image-editor-container .tui-image-editor-checkbox{display:inline-block;margin:1px 0}.tui-image-editor-container .tui-image-editor-checkbox input{width:14px;height:14px;opacity:0}.tui-image-editor-container .tui-image-editor-checkbox input+label{color:#fff;height:14px;position:relative}.tui-image-editor-container .tui-image-editor-checkbox input+label:before{content:"";position:absolute;width:14px;height:14px;background-color:#fff;top:4px;left:-19px;display:inline-block;margin:0;text-align:center;font-size:11px;border:0;border-radius:2px;padding-top:1px;box-sizing:border-box}.tui-image-editor-container .tui-image-editor-checkbox input[type=checkbox]:checked+label:before{background-size:cover;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAMBJREFUKBWVkjEOwjAMRe2WgZW7IIHEDdhghhuwcQ42rlJugAQS54Cxa5cq1QM5TUpByZfS2j9+dlJVt/tX5ZxbS4ZU9VLkQvSHKTIGRaVJYFmKrBbTCJxE2UgCdDzMZDkHrOV6b95V0US6UmgKodujEZbJg0B0ZgEModO5lrY1TMQf1TpyJGBEjD+E2NPN7ukIUDiF/BfEXgRiGEw8NgkffYGYwCi808fpn/6OvfUfsDr/Vc1IfRf8sKnFVqeiVQfDu0tf/nWH9gAAAABJRU5ErkJggg==")}.tui-image-editor-container .tui-image-editor-selectlist-wrap{position:relative}.tui-image-editor-container .tui-image-editor-selectlist-wrap select{width:100%;height:25px;margin-top:9px;border:0;outline:0;border-radius:0;border:1px solid #cbdbdb;background-color:#fff;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0 7px}.tui-image-editor-container .tui-image-editor-selectlist-wrap:after{content:"";position:absolute;display:inline-block;width:14px;height:14px;right:5px;bottom:5px;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAHlJREFUKBVjYBgFOEOAEVkmPDxc89+/f6eAYjzI4kD2FyYmJrOVK1deh4kzwRggGiQBVJCELAZig8SQNYHEmEEEMrh69eo1HR0dfqCYJUickZGxf9WqVf3IakBsFBthklpaWmVA9mEQhrJhUoTp0NBQCRAmrHL4qgAAuu4cWZOZIGsAAAAASUVORK5CYII=");background-size:cover}.tui-image-editor-container .tui-image-editor-selectlist-wrap select::-ms-expand{display:none}.tui-image-editor-container .tui-image-editor-range{position:relative;top:7px;width:166px;height:17px;display:inline-block}.tui-image-editor-container .tui-image-editor-virtual-range-bar{top:7px;position:absolute;width:100%;height:2px;background-color:#666}.tui-image-editor-container .tui-image-editor-virtual-range-subbar{position:absolute;height:100%;left:0;right:0;background-color:#d1d1d1}.tui-image-editor-container .tui-image-editor-virtual-range-pointer{position:absolute;cursor:pointer;top:-5px;left:0;width:12px;height:12px;background-color:#fff;border-radius:100%}.tui-image-editor-container .tui-image-editor-range-wrap{display:inline-block}.tui-image-editor-container .tui-image-editor-range-wrap.short .tui-image-editor-range{width:100px}.tui-image-editor-container .color-picker-control .tui-image-editor-range{width:108px}.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-pointer{background-color:#333}.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-bar{background-color:#ccc}.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-subbar{background-color:#606060}.tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short{margin-top:0;margin-left:17px}.tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label{color:#8e8e8e;font-weight:400}.tui-image-editor-container .tui-image-editor-range-wrap label{vertical-align:baseline;font-size:11px;margin-right:7px;color:#fff}.tui-image-editor-container .tui-image-editor-range-value{cursor:default;width:40px;height:24px;outline:none;border-radius:2px;box-shadow:none;border:1px solid #d5d5d5;text-align:center;background-color:#1c1c1c;color:#fff;font-weight:lighter;vertical-align:baseline;font-family:NotoSans,sans-serif;padding-top:2px}.tui-image-editor-container .tui-image-editor-controls{position:absolute;background-color:#151515;width:100%;height:64px;display:table;bottom:0;z-index:1}.tui-image-editor-container .tui-image-editor-icpartition{display:inline-block;background-color:#282828;width:1px;height:24px}.tui-image-editor-container.left .tui-image-editor-menu>.tui-image-editor-item[title]:before{left:28px;top:11px;border-right:7px solid #2f2f2f;border-top:7px solid transparent;border-bottom:7px solid transparent}.tui-image-editor-container.left .tui-image-editor-menu>.tui-image-editor-item[title]:after{top:7px;left:39px;width:27px}.tui-image-editor-container.left .tui-image-editor-submenu{left:0;height:100%;width:248px}.tui-image-editor-container.left .tui-image-editor-main-container{left:64px;width:calc(100% - 64px);height:100%}.tui-image-editor-container.left .tui-image-editor-controls{width:64px;height:100%;display:table}.tui-image-editor-container.left .tui-image-editor-menu,.tui-image-editor-container.left .tui-image-editor-submenu,.tui-image-editor-container.right .tui-image-editor-menu,.tui-image-editor-container.right .tui-image-editor-submenu{white-space:normal}.tui-image-editor-container.left .tui-image-editor-submenu>div,.tui-image-editor-container.right .tui-image-editor-submenu>div{vertical-align:middle}.tui-image-editor-container.left .tui-image-editor-controls li,.tui-image-editor-container.right .tui-image-editor-controls li{display:inline-block;margin:4px auto}.tui-image-editor-container.left .tui-image-editor-icpartition,.tui-image-editor-container.right .tui-image-editor-icpartition{position:relative;top:-7px;width:24px;height:1px}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition{display:block;width:75%;margin:auto}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition>div,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition>div{border-left:0;height:10px;border-bottom:1px solid #3c3c3c;width:100%;margin:0}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-align,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-align{margin-right:0}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-item li,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-item li{margin-top:15px}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-colorpicker-clearfix li,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-colorpicker-clearfix li{margin-top:0}.tui-image-editor-container.left .tui-image-editor-checkbox-wrap.fixed-width,.tui-image-editor-container.right .tui-image-editor-checkbox-wrap.fixed-width{width:182px;white-space:normal}.tui-image-editor-container.left .tui-image-editor-range-wrap.tui-image-editor-newline label.range,.tui-image-editor-container.right .tui-image-editor-range-wrap.tui-image-editor-newline label.range{display:block;text-align:left;width:75%;margin:auto}.tui-image-editor-container.left .tui-image-editor-range,.tui-image-editor-container.right .tui-image-editor-range{width:136px}.tui-image-editor-container.left #tie-icon-add-button .tui-image-editor-button,.tui-image-editor-container.right #tie-icon-add-button .tui-image-editor-button{width:45px}.tui-image-editor-container.right .tui-image-editor-menu>.tui-image-editor-item[title]:before{left:-3px;top:11px;border-left:7px solid #2f2f2f;border-top:7px solid transparent;border-bottom:7px solid transparent}.tui-image-editor-container.right .tui-image-editor-menu>.tui-image-editor-item[title]:after{top:7px;left:-44px;width:27px}.tui-image-editor-container.right .tui-image-editor-submenu{right:0;height:100%;width:248px}.tui-image-editor-container.right .tui-image-editor-main-container{right:64px;width:calc(100% - 64px);height:100%}.tui-image-editor-container.right .tui-image-editor-controls{right:0;width:64px;height:100%;display:table}.tui-image-editor-container.bottom .tui-image-editor-submenu .tui-image-editor-partition.only-left-right,.tui-image-editor-container.top .tui-image-editor-submenu .tui-image-editor-partition.only-left-right{display:none}.tui-image-editor-container.bottom .tui-image-editor-submenu>div{padding-bottom:24px}.tui-image-editor-container.top .color-picker-control .triangle{top:-11px;border-right:12px solid transparent;border-top:0;border-left:12px solid transparent;border-bottom:12px solid #fff}.tui-image-editor-container.top .tui-image-editor-size-wrap{height:calc(100% - 64px)}.tui-image-editor-container.top .tui-image-editor-main-container{bottom:0}.tui-image-editor-container.top .tui-image-editor-menu>.tui-image-editor-item[title]:before{left:13px;border-top:0;border-bottom:7px solid #2f2f2f;top:33px}.tui-image-editor-container.top .tui-image-editor-menu>.tui-image-editor-item[title]:after{top:38px}.tui-image-editor-container.top .tui-image-editor-submenu{top:0;bottom:inherit}.tui-image-editor-container.top .tui-image-editor-submenu>div{padding-top:24px;vertical-align:top}.tui-image-editor-container.top .tui-image-editor-controls-buttons,.tui-image-editor-container.top .tui-image-editor-controls-logo{display:table-cell}.tui-image-editor-container.top .tui-image-editor-main{top:64px;height:100%}.tui-image-editor-container.top .tui-image-editor-controls{top:0;bottom:inherit}.tui-image-editor-container .svg_ic-menu{width:24px;height:24px}.tui-image-editor-container .svg_ic-submenu{width:32px;height:32px}.tui-image-editor-container .svg_img-bi{width:257px;height:26px}.tui-image-editor-container .tui-image-editor-controls svg>use{display:none}.tui-image-editor-container .tui-image-editor-controls .active svg>use.active,.tui-image-editor-container .tui-image-editor-controls .enabled svg>use.enabled,.tui-image-editor-container .tui-image-editor-controls svg>use.normal{display:block}.tui-image-editor-container .tui-image-editor-controls .active svg>use.normal,.tui-image-editor-container .tui-image-editor-controls .enabled svg>use.normal{display:none}.tui-image-editor-container div.tui-colorpicker-clearfix{width:159px;height:28px;border:1px solid #d5d5d5;border-radius:2px;background-color:#f5f5f5;margin-top:6px;padding:4px 7px}.tui-image-editor-container .tui-colorpicker-palette-hex{width:114px;background-color:#f5f5f5;border:0;font-size:11px;margin-top:2px}.tui-image-editor-container .tui-colorpicker-palette-preview{border-radius:100%;float:left;width:16px;height:16px}.tui-image-editor-container .color-picker-control{position:absolute;display:none;z-index:99;width:188px;height:112px;background-color:#fff;box-shadow:0 3px 22px 0 #000;padding:14px;border-radius:2px}.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-toggle-slider{display:none}.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button{border-radius:100%;margin:2px}.tui-image-editor-container .color-picker-control .triangle{width:0;height:0;border-right:12px solid transparent;border-top:12px solid #fff;border-left:12px solid transparent;position:absolute;bottom:-11px;left:77px}.tui-image-editor-container .color-picker-control .tui-colorpicker-container,.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-container,.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-container ul{width:100%;height:auto}.tui-image-editor-container .filter-color-item .color-picker-control label{font-color:#333;font-weight:400;margin-right:7pxleft}.tui-image-editor-container .color-picker{width:100%;height:auto}.tui-image-editor-container .color-picker-value{width:30px;height:30px;border:0;border-radius:100%;margin:auto;margin-bottom:4px}.tui-image-editor-container .color-picker-value.transparent{border:1px solid #cbcbcb;background-size:cover;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAdBJREFUWAnFl0FuwjAQRZ0ukiugHqFSOQNdseuKW3ALzkA4BateICvUGyCxrtRFd4WuunH/TzykaYJrnLEYaTJJsP2+x8GZZCbQrLU5mj7Bn+EP8HvnCObd+R7xBV5lWfaNON4AnsA38E94qLEt+0yiFaBzAV/Bv+Cxxr4co7hKCDpw1q9wLeNYYdlAwyn8TYt8Hme3+8D5ozcTaMCZ68PXa2tnM2sbEcOZAJhrrpl2DAcTOGNjZPSfCdzkw6JrfbiMv+osBe4y9WOedhm4jZfhbENWuxS44H9Wz/xw4WzqLOAqh1+zycgAwzEMzr5k5gaHOa9ULBwuuDkFlHI1Kl4PJ66kgIpnoywOTmRFAYcbwYk9UMApWkD8zAV5ihcwHk4Rx7gl0IFTQL0EFc+CTQ9OZHWH3YhlVJiVpTHbrTGLhTHLZVgff6s9lyBsI9KduSS83oj+34rTwJutmBmCnMsvozRwZqB5GTkBw6/jdPDu69iJ6BYk6eCcfbcgcQIK/MByaaiMqm8rHcjol2TnpWDhyAKSGdA3FrxtJUToX0ODqatetfGE+8tyEUOV8GY5dGRwLP/MBS4RHQr4bT7NRAQjlcOTfZxmv2G+c4hI8nn+Ax5PG/zhI393AAAAAElFTkSuQmCC")}.tui-image-editor-container .color-picker-value+label{color:#fff}.tui-image-editor-container .tui-image-editor-submenu svg>use{display:none}#tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype=icon-arrow-2] svg>use.active,#tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype=icon-arrow-3] svg>use.active,#tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype=icon-arrow] svg>use.active,#tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype=icon-bubble] svg>use.active,#tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype=icon-heart] svg>use.active,#tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype=icon-location] svg>use.active,#tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype=icon-polygon] svg>use.active,#tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype=icon-star] svg>use.active,.tui-image-editor-container .tui-image-editor-submenu svg>use.normal{display:block}#tie-draw-line-select-button.free .tui-image-editor-button.free svg>use.normal,#tie-draw-line-select-button.line .tui-image-editor-button.line svg>use.normal{display:none}#tie-draw-line-select-button.free .tui-image-editor-button.free svg>use.active,#tie-draw-line-select-button.line .tui-image-editor-button.line svg>use.active{display:block}#tie-flip-button.flipX .tui-image-editor-button.flipX svg>use.normal,#tie-flip-button.flipY .tui-image-editor-button.flipY svg>use.normal,#tie-flip-button.resetFlip .tui-image-editor-button.resetFlip svg>use.normal{display:none}#tie-flip-button.flipX .tui-image-editor-button.flipX svg>use.active,#tie-flip-button.flipY .tui-image-editor-button.flipY svg>use.active,#tie-flip-button.resetFlip .tui-image-editor-button.resetFlip svg>use.active{display:block}#tie-mask-apply.apply.active .tui-image-editor-button.apply label{color:#fff}#tie-mask-apply.apply.active .tui-image-editor-button.apply svg>use.active{display:block}#tie-crop-button .tui-image-editor-button.apply{margin-right:24px}#tie-crop-button .tui-image-editor-button.apply.active svg>use.active{display:block}#tie-shape-button.circle .tui-image-editor-button.circle svg>use.normal,#tie-shape-button.rect .tui-image-editor-button.rect svg>use.normal,#tie-shape-button.triangle .tui-image-editor-button.triangle svg>use.normal{display:none}#tie-shape-button.circle .tui-image-editor-button.circle svg>use.active,#tie-shape-button.rect .tui-image-editor-button.rect svg>use.active,#tie-shape-button.triangle .tui-image-editor-button.triangle svg>use.active,#tie-text-align-button.center .tui-image-editor-button.center svg>use.active,#tie-text-align-button.left .tui-image-editor-button.left svg>use.active,#tie-text-align-button.right .tui-image-editor-button.right svg>use.active,#tie-text-effect-button .tui-image-editor-button.active svg>use.active{display:block}#tie-icon-image-file,#tie-mask-image-file{opacity:0;position:absolute;width:100%;height:100%;border:1px solid green;cursor:inherit;left:0;top:0}.tui-image-editor-container.top.tui-image-editor-top-optimization .tui-image-editor-controls ul{text-align:right}.tui-image-editor-container.top.tui-image-editor-top-optimization .tui-image-editor-controls-logo{display:none} \ No newline at end of file +body>textarea{position:fixed!important}.tui-image-editor-container{marign:0;padding:0;box-sizing:border-box;min-height:300px;height:100%;position:relative;background-color:#282828;overflow:hidden;letter-spacing:.3px}.tui-image-editor-container div,.tui-image-editor-container input,.tui-image-editor-container label,.tui-image-editor-container li,.tui-image-editor-container ul{box-sizing:border-box;margin:0;padding:0;-ms-user-select:none;-moz-user-select:-moz-none;-khtml-user-select:none;-webkit-user-select:none;user-select:none}.tui-image-editor-container .tui-image-editor-header{min-width:533px;position:absolute;background-color:#151515;top:0;width:100%}.tui-image-editor-container .tui-image-editor-controls-buttons,.tui-image-editor-container .tui-image-editor-header-buttons{float:right;margin:8px}.tui-image-editor-container .tui-image-editor-controls-logo,.tui-image-editor-container .tui-image-editor-header-logo{float:left;width:30%;padding:17px}.tui-image-editor-container .tui-image-editor-controls-buttons,.tui-image-editor-container .tui-image-editor-controls-logo{width:270px;height:100%;display:none}.tui-image-editor-container .tui-image-editor-controls-buttons button,.tui-image-editor-container .tui-image-editor-header-buttons button{position:relative;width:120px;height:40px;padding:0;line-height:40px;outline:none;border-radius:20px;border:1px solid #ddd;font-family:Noto Sans,sans-serif;font-size:12px;font-weight:700;cursor:pointer;vertical-align:middle;letter-spacing:.3px}.tui-image-editor-container .tui-image-editor-download-btn{background-color:#fdba3b;border-color:#fdba3b;color:#fff}.tui-image-editor-container .tui-image-editor-load-btn{position:absolute;left:0;right:0;display:inline-block;top:0;bottom:0;width:100%;cursor:pointer;opacity:0}.tui-image-editor-container .tui-image-editor-main-container{position:absolute;width:100%;top:0;bottom:64px}.tui-image-editor-container .tui-image-editor-main{position:absolute;text-align:center;top:64px;bottom:0;right:0;left:0}.tui-image-editor-container .tui-image-editor-wrap{bottom:0;width:100%;overflow:auto}.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap{display:table;width:100%;height:100%}.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap .tui-image-editor-align-wrap{display:table-cell;vertical-align:middle}.tui-image-editor-container .tui-image-editor{position:relative;display:inline-block}.tui-image-editor-container .tui-image-editor-menu{width:auto;list-style:none;padding:0;margin:0 auto;display:table-cell;text-align:center;vertical-align:middle;white-space:nowrap}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item{position:relative;display:inline-block;border-radius:2px;padding:7px 8px 3px;cursor:pointer;margin:0 4px}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item[title]:hover:before{content:"";display:inline-block;margin:0 auto;width:0;height:0;border-right:7px solid transparent;border-top:7px solid #2f2f2f;border-left:7px solid transparent;position:absolute;left:13px;top:-2px}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item[title]:hover:after{content:attr(title);position:absolute;display:inline-block;background-color:#2f2f2f;color:#fff;padding:5px 8px;font-size:11px;font-weight:lighter;border-radius:3px;max-height:23px;top:-22px;left:0;min-width:24px}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item.active{background-color:#fff;transition:all .3s ease}.tui-image-editor-container .tui-image-editor-wrap{position:absolute}.tui-image-editor-container .tui-image-editor-grid-visual{display:none;position:absolute;width:100%;height:100%;border:1px solid hsla(0,0%,100%,.7)}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor{transition:none}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-grid-visual,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-grid-visual{display:block}.tui-image-editor-container .tui-image-editor-grid-visual table{width:100%;height:100%;border-collapse:collapse}.tui-image-editor-container .tui-image-editor-grid-visual table td{border:1px solid hsla(0,0%,100%,.3)}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot:before{content:"";position:absolute;box-sizing:border-box;width:10px;height:10px;border:0;box-shadow:0 0 1px 0 rgba(0,0,0,.3);border-radius:100%;background-color:#fff}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-top:before{top:-5px;left:-5px}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-top:before{top:-5px;right:-5px}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-bottom:before{bottom:-5px;left:-5px}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-bottom:before{bottom:-5px;right:-5px}.tui-image-editor-container .tui-image-editor-submenu{display:none;position:absolute;bottom:0;width:100%;height:150px;white-space:nowrap;z-index:2}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover svg>use.active{display:block}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item li{display:inline-block;vertical-align:top}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-newline{display:block;margin-top:0}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button{position:relative;cursor:pointer;display:inline-block;font-weight:400;font-size:11px;margin:0 9px}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item label{display:inline-block;cursor:pointer;padding-top:5px;font-family:Noto Sans,sans-serif;font-size:11px}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.apply label,.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.cancel label{vertical-align:7px}.tui-image-editor-container .tui-image-editor-submenu>div{display:none;vertical-align:bottom}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-style{opacity:.95;z-index:-1;position:absolute;top:0;bottom:0;left:0;right:0;display:block}.tui-image-editor-container .tui-image-editor-partition>div{width:1px;height:52px;border-left:1px solid #3c3c3c;margin:0 8px}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-partition>div{height:108px;margin:0 29px 0 0}.tui-image-editor-container .tui-image-editor-submenu-align{text-align:left;margin-right:30px}.tui-image-editor-container .tui-image-editor-submenu-align label{width:55px;white-space:nowrap}.tui-image-editor-container .tui-image-editor-submenu-align:first-child{margin-right:0}.tui-image-editor-container .tui-image-editor-submenu-align:first-child label{width:70px}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-crop .tui-image-editor-submenu>div.tui-image-editor-menu-crop,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-draw .tui-image-editor-submenu>div.tui-image-editor-menu-draw,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-submenu>div.tui-image-editor-menu-filter,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-submenu>div.tui-image-editor-menu-flip,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-icon .tui-image-editor-submenu>div.tui-image-editor-menu-icon,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-mask .tui-image-editor-submenu>div.tui-image-editor-menu-mask,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-submenu>div.tui-image-editor-menu-rotate,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-shape .tui-image-editor-submenu>div.tui-image-editor-menu-shape,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-text .tui-image-editor-submenu>div.tui-image-editor-menu-text{display:table-cell}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-crop .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-draw .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-icon .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-mask .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-shape .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-text .tui-image-editor-submenu{display:table}.tui-image-editor-container .filter-color-item{display:inline-block}.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox{display:block}.tui-image-editor-container .tui-image-editor-checkbox-wrap{display:inline-block!important;text-align:left}.tui-image-editor-container .tui-image-editor-checkbox-wrap.fixed-width{width:187px;white-space:normal}.tui-image-editor-container .tui-image-editor-checkbox{display:inline-block;margin:1px 0}.tui-image-editor-container .tui-image-editor-checkbox input{width:14px;height:14px;opacity:0}.tui-image-editor-container .tui-image-editor-checkbox input+label{color:#fff;height:14px;position:relative}.tui-image-editor-container .tui-image-editor-checkbox input+label:before{content:"";position:absolute;width:14px;height:14px;background-color:#fff;top:6px;left:-19px;display:inline-block;margin:0;text-align:center;font-size:11px;border:0;border-radius:2px;padding-top:1px;box-sizing:border-box}.tui-image-editor-container .tui-image-editor-checkbox input[type=checkbox]:checked+label:before{background-size:cover;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAMBJREFUKBWVkjEOwjAMRe2WgZW7IIHEDdhghhuwcQ42rlJugAQS54Cxa5cq1QM5TUpByZfS2j9+dlJVt/tX5ZxbS4ZU9VLkQvSHKTIGRaVJYFmKrBbTCJxE2UgCdDzMZDkHrOV6b95V0US6UmgKodujEZbJg0B0ZgEModO5lrY1TMQf1TpyJGBEjD+E2NPN7ukIUDiF/BfEXgRiGEw8NgkffYGYwCi808fpn/6OvfUfsDr/Vc1IfRf8sKnFVqeiVQfDu0tf/nWH9gAAAABJRU5ErkJggg==")}.tui-image-editor-container .tui-image-editor-selectlist-wrap{position:relative}.tui-image-editor-container .tui-image-editor-selectlist-wrap select{width:100%;height:28px;margin-top:4px;border:0;outline:0;border-radius:0;border:1px solid #cbdbdb;background-color:#fff;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0 7px 0 10px}.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist{display:none;position:relative;top:-1px;border:1px solid #ccc;background-color:#fff;border-top:0;padding:4px 0}.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist li{display:block;text-align:left;padding:7px 10px;font-family:Noto Sans,sans-serif}.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist li:hover{background-color:rgba(81,92,230,.05)}.tui-image-editor-container .tui-image-editor-selectlist-wrap:before{content:"";position:absolute;display:inline-block;width:14px;height:14px;right:5px;top:10px;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAHlJREFUKBVjYBgFOEOAEVkmPDxc89+/f6eAYjzI4kD2FyYmJrOVK1deh4kzwRggGiQBVJCELAZig8SQNYHEmEEEMrh69eo1HR0dfqCYJUickZGxf9WqVf3IakBsFBthklpaWmVA9mEQhrJhUoTp0NBQCRAmrHL4qgAAuu4cWZOZIGsAAAAASUVORK5CYII=");background-size:cover}.tui-image-editor-container .tui-image-editor-selectlist-wrap select::-ms-expand{display:none}.tui-image-editor-container .tui-image-editor-virtual-range-bar .tui-image-editor-disabled,.tui-image-editor-container .tui-image-editor-virtual-range-pointer .tui-image-editor-disabled,.tui-image-editor-container .tui-image-editor-virtual-range-subbar .tui-image-editor-disabled{backbround-color:red}.tui-image-editor-container .tui-image-editor-range{position:relative;top:5px;width:166px;height:17px;display:inline-block}.tui-image-editor-container .tui-image-editor-virtual-range-bar{top:7px;position:absolute;width:100%;height:2px;background-color:#666}.tui-image-editor-container .tui-image-editor-virtual-range-subbar{position:absolute;height:100%;left:0;right:0;background-color:#d1d1d1}.tui-image-editor-container .tui-image-editor-virtual-range-pointer{position:absolute;cursor:pointer;top:-5px;left:0;width:12px;height:12px;background-color:#fff;border-radius:100%}.tui-image-editor-container .tui-image-editor-range-wrap{display:inline-block;margin-left:4px}.tui-image-editor-container .tui-image-editor-range-wrap.short .tui-image-editor-range{width:100px}.tui-image-editor-container .color-picker-control .tui-image-editor-range{width:108px;margin-left:10px}.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-pointer{background-color:#333}.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-bar{background-color:#ccc}.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-subbar{background-color:#606060}.tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short{margin-top:-2px;margin-left:19px}.tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label{color:#8e8e8e;font-weight:400}.tui-image-editor-container .tui-image-editor-range-wrap label{vertical-align:baseline;font-size:11px;margin-right:7px;color:#fff}.tui-image-editor-container .tui-image-editor-range-value{cursor:default;width:40px;height:24px;outline:none;border-radius:2px;box-shadow:none;border:1px solid #d5d5d5;text-align:center;background-color:#1c1c1c;color:#fff;font-weight:lighter;vertical-align:baseline;font-family:Noto Sans,sans-serif;margin-top:21px;margin-left:4px}.tui-image-editor-container .tui-image-editor-controls{position:absolute;background-color:#151515;width:100%;height:64px;display:table;bottom:0;z-index:2}.tui-image-editor-container .tui-image-editor-icpartition{display:inline-block;background-color:#282828;width:1px;height:24px}.tui-image-editor-container.left .tui-image-editor-menu>.tui-image-editor-item[title]:before{left:28px;top:11px;border-right:7px solid #2f2f2f;border-top:7px solid transparent;border-bottom:7px solid transparent}.tui-image-editor-container.left .tui-image-editor-menu>.tui-image-editor-item[title]:after{top:7px;left:39px;width:27px}.tui-image-editor-container.left .tui-image-editor-submenu{left:0;height:100%;width:248px}.tui-image-editor-container.left .tui-image-editor-main-container{left:64px;width:calc(100% - 64px);height:100%}.tui-image-editor-container.left .tui-image-editor-controls{width:64px;height:100%;display:table}.tui-image-editor-container.left .tui-image-editor-menu,.tui-image-editor-container.right .tui-image-editor-menu{white-space:inherit}.tui-image-editor-container.left .tui-image-editor-submenu,.tui-image-editor-container.right .tui-image-editor-submenu{white-space:normal}.tui-image-editor-container.left .tui-image-editor-submenu>div,.tui-image-editor-container.right .tui-image-editor-submenu>div{vertical-align:middle}.tui-image-editor-container.left .tui-image-editor-controls li,.tui-image-editor-container.right .tui-image-editor-controls li{display:inline-block;margin:4px auto}.tui-image-editor-container.left .tui-image-editor-icpartition,.tui-image-editor-container.right .tui-image-editor-icpartition{position:relative;top:-7px;width:24px;height:1px}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition{display:block;width:75%;margin:auto}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition>div,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition>div{border-left:0;height:10px;border-bottom:1px solid #3c3c3c;width:100%;margin:0}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-align,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-align{margin-right:0}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-item li,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-item li{margin-top:15px}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-colorpicker-clearfix li,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-colorpicker-clearfix li{margin-top:0}.tui-image-editor-container.left .tui-image-editor-checkbox-wrap.fixed-width,.tui-image-editor-container.right .tui-image-editor-checkbox-wrap.fixed-width{width:182px;white-space:normal}.tui-image-editor-container.left .tui-image-editor-range-wrap.tui-image-editor-newline label.range,.tui-image-editor-container.right .tui-image-editor-range-wrap.tui-image-editor-newline label.range{display:block;text-align:left;width:75%;margin:auto}.tui-image-editor-container.left .tui-image-editor-range,.tui-image-editor-container.right .tui-image-editor-range{width:136px}.tui-image-editor-container.right .tui-image-editor-menu>.tui-image-editor-item[title]:before{left:-3px;top:11px;border-left:7px solid #2f2f2f;border-top:7px solid transparent;border-bottom:7px solid transparent}.tui-image-editor-container.right .tui-image-editor-menu>.tui-image-editor-item[title]:after{top:7px;left:-44px;width:27px}.tui-image-editor-container.right .tui-image-editor-submenu{right:0;height:100%;width:248px}.tui-image-editor-container.right .tui-image-editor-main-container{right:64px;width:calc(100% - 64px);height:100%}.tui-image-editor-container.right .tui-image-editor-controls{right:0;width:64px;height:100%;display:table}.tui-image-editor-container.bottom .tui-image-editor-submenu .tui-image-editor-partition.only-left-right,.tui-image-editor-container.top .tui-image-editor-submenu .tui-image-editor-partition.only-left-right{display:none}.tui-image-editor-container.bottom .tui-image-editor-submenu>div{padding-bottom:24px}.tui-image-editor-container.top .color-picker-control .triangle{top:-8px;border-right:7px solid transparent;border-top:0;border-left:7px solid transparent;border-bottom:8px solid #fff}.tui-image-editor-container.top .tui-image-editor-size-wrap{height:100%}.tui-image-editor-container.top .tui-image-editor-main-container{bottom:0}.tui-image-editor-container.top .tui-image-editor-menu>.tui-image-editor-item[title]:before{left:13px;border-top:0;border-bottom:7px solid #2f2f2f;top:33px}.tui-image-editor-container.top .tui-image-editor-menu>.tui-image-editor-item[title]:after{top:38px}.tui-image-editor-container.top .tui-image-editor-submenu{top:0;bottom:inherit}.tui-image-editor-container.top .tui-image-editor-submenu>div{padding-top:24px;vertical-align:top}.tui-image-editor-container.top .tui-image-editor-controls-buttons,.tui-image-editor-container.top .tui-image-editor-controls-logo{display:table-cell}.tui-image-editor-container.top .tui-image-editor-main{top:64px;height:calc(100% - 64px)}.tui-image-editor-container.top .tui-image-editor-controls{top:0;bottom:inherit}.tui-image-editor-container #tie-icon-add-button .tui-image-editor-button{min-width:42px}.tui-image-editor-container .svg_ic-menu{width:24px;height:24px}.tui-image-editor-container .svg_ic-submenu{width:32px;height:32px}.tui-image-editor-container .svg_img-bi{width:257px;height:26px}.tui-image-editor-container .tui-image-editor-controls svg>use{display:none}.tui-image-editor-container .tui-image-editor-controls .enabled svg:hover>use.hover,.tui-image-editor-container .tui-image-editor-controls .normal svg:hover>use.hover{display:block}.tui-image-editor-container .tui-image-editor-controls .active svg:hover>use.hover{display:none}.tui-image-editor-container .tui-image-editor-controls .active svg>use.active,.tui-image-editor-container .tui-image-editor-controls .enabled svg>use.enabled,.tui-image-editor-container .tui-image-editor-controls svg>use.normal{display:block}.tui-image-editor-container .tui-image-editor-controls .active svg>use.normal,.tui-image-editor-container .tui-image-editor-controls .enabled svg>use.normal{display:none}.tui-image-editor-container .tui-image-editor-controls:hover{z-index:3}.tui-image-editor-container div.tui-colorpicker-clearfix{width:159px;height:28px;border:1px solid #d5d5d5;border-radius:2px;background-color:#f5f5f5;margin-top:6px;padding:4px 7px}.tui-image-editor-container .tui-colorpicker-palette-hex{width:114px;background-color:#f5f5f5;border:0;font-size:11px;margin-top:2px;font-family:Noto Sans,sans-serif}.tui-image-editor-container .tui-colorpicker-palette-hex[value=""]+.tui-colorpicker-palette-preview,.tui-image-editor-container .tui-colorpicker-palette-hex[value="#ffffff"]+.tui-colorpicker-palette-preview{border:1px solid #ccc}.tui-image-editor-container .tui-colorpicker-palette-hex[value=""]+.tui-colorpicker-palette-preview{background-size:cover;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAdBJREFUWAnFl0FuwjAQRZ0ukiugHqFSOQNdseuKW3ALzkA4BateICvUGyCxrtRFd4WuunH/TzykaYJrnLEYaTJJsP2+x8GZZCbQrLU5mj7Bn+EP8HvnCObd+R7xBV5lWfaNON4AnsA38E94qLEt+0yiFaBzAV/Bv+Cxxr4co7hKCDpw1q9wLeNYYdlAwyn8TYt8Hme3+8D5ozcTaMCZ68PXa2tnM2sbEcOZAJhrrpl2DAcTOGNjZPSfCdzkw6JrfbiMv+osBe4y9WOedhm4jZfhbENWuxS44H9Wz/xw4WzqLOAqh1+zycgAwzEMzr5k5gaHOa9ULBwuuDkFlHI1Kl4PJ66kgIpnoywOTmRFAYcbwYk9UMApWkD8zAV5ihcwHk4Rx7gl0IFTQL0EFc+CTQ9OZHWH3YhlVJiVpTHbrTGLhTHLZVgff6s9lyBsI9KduSS83oj+34rTwJutmBmCnMsvozRwZqB5GTkBw6/jdPDu69iJ6BYk6eCcfbcgcQIK/MByaaiMqm8rHcjol2TnpWDhyAKSGdA3FrxtJUToX0ODqatetfGE+8tyEUOV8GY5dGRwLP/MBS4RHQr4bT7NRAQjlcOTfZxmv2G+c4hI8nn+Ax5PG/zhI393AAAAAElFTkSuQmCC")}.tui-image-editor-container .tui-colorpicker-palette-preview{border-radius:100%;float:left;width:17px;height:17px;border:0}.tui-image-editor-container .color-picker-control{position:absolute;display:none;z-index:99;width:192px;background-color:#fff;box-shadow:0 3px 22px 6px rgba(0,0,0,.15);padding:16px;border-radius:2px}.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-toggle-slider{display:none}.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button{border:0;border-radius:100%;margin:2px;background-size:cover;font-size:1px}.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button[title=""],.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button[title="#ffffff"]{border:1px solid #ccc}.tui-image-editor-container .color-picker-control .triangle{width:0;height:0;border-right:7px solid transparent;border-top:8px solid #fff;border-left:7px solid transparent;position:absolute;bottom:-8px;left:84px}.tui-image-editor-container .color-picker-control .tui-colorpicker-container,.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-container,.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-container ul{width:100%;height:auto}.tui-image-editor-container .filter-color-item .color-picker-control label{font-color:#333;font-weight:400;margin-right:7pxleft}.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox{margin-top:0}.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox input+label:before{left:-16px}.tui-image-editor-container .color-picker{width:100%;height:auto}.tui-image-editor-container .color-picker-value{width:32px;height:32px;border:0;border-radius:100%;margin:auto;margin-bottom:1px}.tui-image-editor-container .color-picker-value.transparent{border:1px solid #cbcbcb;background-size:cover;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAdBJREFUWAnFl0FuwjAQRZ0ukiugHqFSOQNdseuKW3ALzkA4BateICvUGyCxrtRFd4WuunH/TzykaYJrnLEYaTJJsP2+x8GZZCbQrLU5mj7Bn+EP8HvnCObd+R7xBV5lWfaNON4AnsA38E94qLEt+0yiFaBzAV/Bv+Cxxr4co7hKCDpw1q9wLeNYYdlAwyn8TYt8Hme3+8D5ozcTaMCZ68PXa2tnM2sbEcOZAJhrrpl2DAcTOGNjZPSfCdzkw6JrfbiMv+osBe4y9WOedhm4jZfhbENWuxS44H9Wz/xw4WzqLOAqh1+zycgAwzEMzr5k5gaHOa9ULBwuuDkFlHI1Kl4PJ66kgIpnoywOTmRFAYcbwYk9UMApWkD8zAV5ihcwHk4Rx7gl0IFTQL0EFc+CTQ9OZHWH3YhlVJiVpTHbrTGLhTHLZVgff6s9lyBsI9KduSS83oj+34rTwJutmBmCnMsvozRwZqB5GTkBw6/jdPDu69iJ6BYk6eCcfbcgcQIK/MByaaiMqm8rHcjol2TnpWDhyAKSGdA3FrxtJUToX0ODqatetfGE+8tyEUOV8GY5dGRwLP/MBS4RHQr4bT7NRAQjlcOTfZxmv2G+c4hI8nn+Ax5PG/zhI393AAAAAElFTkSuQmCC")}.tui-image-editor-container .color-picker-value+label{color:#fff}.tui-image-editor-container .tui-image-editor-submenu svg>use{display:none}#tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype=icon-arrow-2] svg>use.active,#tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype=icon-arrow-3] svg>use.active,#tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype=icon-arrow] svg>use.active,#tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype=icon-bubble] svg>use.active,#tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype=icon-heart] svg>use.active,#tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype=icon-location] svg>use.active,#tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype=icon-polygon] svg>use.active,#tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype=icon-star] svg>use.active,.tui-image-editor-container .tui-image-editor-submenu svg>use.normal{display:block}#tie-draw-line-select-button.free .tui-image-editor-button.free svg>use.normal,#tie-draw-line-select-button.line .tui-image-editor-button.line svg>use.normal{display:none}#tie-draw-line-select-button.free .tui-image-editor-button.free svg>use.active,#tie-draw-line-select-button.line .tui-image-editor-button.line svg>use.active{display:block}#tie-flip-button.flipX .tui-image-editor-button.flipX svg>use.normal,#tie-flip-button.flipY .tui-image-editor-button.flipY svg>use.normal,#tie-flip-button.resetFlip .tui-image-editor-button.resetFlip svg>use.normal{display:none}#tie-flip-button.flipX .tui-image-editor-button.flipX svg>use.active,#tie-flip-button.flipY .tui-image-editor-button.flipY svg>use.active,#tie-flip-button.resetFlip .tui-image-editor-button.resetFlip svg>use.active{display:block}#tie-mask-apply.apply.active .tui-image-editor-button.apply label{color:#fff}#tie-mask-apply.apply.active .tui-image-editor-button.apply svg>use.active{display:block}#tie-crop-button .tui-image-editor-button.apply{margin-right:24px}#tie-crop-button .tui-image-editor-button.apply.active svg>use.active{display:block}#tie-shape-button.circle .tui-image-editor-button.circle svg>use.normal,#tie-shape-button.rect .tui-image-editor-button.rect svg>use.normal,#tie-shape-button.triangle .tui-image-editor-button.triangle svg>use.normal{display:none}#tie-shape-button.circle .tui-image-editor-button.circle svg>use.active,#tie-shape-button.rect .tui-image-editor-button.rect svg>use.active,#tie-shape-button.triangle .tui-image-editor-button.triangle svg>use.active,#tie-text-align-button.center .tui-image-editor-button.center svg>use.active,#tie-text-align-button.left .tui-image-editor-button.left svg>use.active,#tie-text-align-button.right .tui-image-editor-button.right svg>use.active,#tie-text-effect-button .tui-image-editor-button.active svg>use.active{display:block}#tie-icon-image-file,#tie-mask-image-file{opacity:0;position:absolute;width:100%;height:100%;border:1px solid green;cursor:inherit;left:0;top:0}.tui-image-editor-container.top.tui-image-editor-top-optimization .tui-image-editor-controls ul{text-align:right}.tui-image-editor-container.top.tui-image-editor-top-optimization .tui-image-editor-controls-logo{display:none} \ No newline at end of file diff --git a/dist/tui-image-editor.min.js b/dist/tui-image-editor.min.js index 6c8f89e8a..fcec29d2e 100644 --- a/dist/tui-image-editor.min.js +++ b/dist/tui-image-editor.min.js @@ -1,23 +1,23 @@ /*! * tui-image-editor.min.js - * @version 3.2.0 + * @version 3.2.1 * @author NHNEnt FE Development Lab * @license MIT */ -!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("tui-code-snippet"),require("fabric/dist/fabric.require")):"function"==typeof define&&define.amd?define(["tui-code-snippet","fabric/dist/fabric.require"],t):"object"==typeof exports?exports.ImageEditor=t(require("tui-code-snippet"),require("fabric/dist/fabric.require")):(e.tui=e.tui||{},e.tui.ImageEditor=t(e.tui&&e.tui.util,e.fabric))}(this,function(e,t){return function(e){function t(i){if(n[i])return n[i].exports;var o=n[i]={exports:{},id:i,loaded:!1};return e[i].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var n={};return t.m=e,t.c=n,t.p="dist",t(0)}([function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}n(91);var o=n(88),r=i(o);n(148),n(45),n(46),n(47),n(48),n(49),n(50),n(51),n(52),n(53),n(54),n(55),n(56),n(57),n(58),n(59),n(60),n(61),n(63),n(62),e.exports=r.default},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(5),r=i(o);e.exports={componentNames:r.default.keyMirror("IMAGE_LOADER","CROPPER","FLIP","ROTATION","FREE_DRAWING","LINE","TEXT","ICON","FILTER","SHAPE"),commandNames:{CLEAR_OBJECTS:"clearObjects",LOAD_IMAGE:"loadImage",FLIP_IMAGE:"flip",ROTATE_IMAGE:"rotate",ADD_OBJECT:"addObject",REMOVE_OBJECT:"removeObject",APPLY_FILTER:"applyFilter",REMOVE_FILTER:"removeFilter",ADD_ICON:"addIcon",CHANGE_ICON_COLOR:"changeIconColor",ADD_SHAPE:"addShape",CHANGE_SHAPE:"changeShape",ADD_TEXT:"addText",CHANGE_TEXT:"changeText",CHANGE_TEXT_STYLE:"changeTextStyle",ADD_IMAGE_OBJECT:"addImageObject",RESIZE_CANVAS_DIMENSION:"resizeCanvasDimension",SET_OBJECT_PROPERTIES:"setObjectProperties",SET_OBJECT_POSITION:"setObjectPosition"},eventNames:{OBJECT_ACTIVATED:"objectActivated",OBJECT_MOVED:"objectMoved",OBJECT_SCALED:"objectScaled",OBJECT_CREATED:"objectCreated",TEXT_EDITING:"textEditing",TEXT_CHANGED:"textChanged",ICON_CREATE_RESIZE:"iconCreateResize",ICON_CREATE_END:"iconCreateEnd",ADD_TEXT:"addText",ADD_OBJECT:"addObject",ADD_OBJECT_AFTER:"addObjectAfter",MOUSE_DOWN:"mousedown",MOUSE_UP:"mouseup",MOUSE_MOVE:"mousemove",REDO_STACK_CHANGED:"redoStackChanged",UNDO_STACK_CHANGED:"undoStackChanged",SELECTION_CLEARED:"selectionCleared",SELECTION_CREATED:"selectionCreated"},drawingModes:r.default.keyMirror("NORMAL","CROPPER","FREE_DRAWING","LINE_DRAWING","TEXT","SHAPE"),keyCodes:{Z:90,Y:89,SHIFT:16,BACKSPACE:8,DEL:46},fObjectOptions:{SELECTION_STYLE:{borderColor:"red",cornerColor:"green",cornerSize:10,originX:"center",originY:"center",transparentCorners:!1}},rejectMessages:{flip:"The flipX and flipY setting values are not changed.",rotation:"The current angle is same the old angle.",loadImage:"The background image is empty.",isLock:"The executing command state is locked.",undo:"The promise of undo command is reject.",redo:"The promise of redo command is reject.",invalidDrawingMode:"This operation is not supported in the drawing mode",invalidParameters:"Invalid parameters",noActiveObject:"There is no active object.",unsupportedType:"Unsupported object type",noObject:"The object is not in canvas.",addedObject:"The object is already added."},defaultIconPath:{"icon-arrow":"M40 12V0l24 24-24 24V36H0V12h40z","icon-arrow-2":"M49,32 H3 V22 h46 l-18,-18 h12 l23,23 L43,50 h-12 l18,-18 z ","icon-arrow-3":"M43.349998,27 L17.354,53 H1.949999 l25.996,-26 L1.949999,1 h15.404 L43.349998,27 z ","icon-star":"M35,54.557999 l-19.912001,10.468 l3.804,-22.172001 l-16.108,-15.7 l22.26,-3.236 L35,3.746 l9.956,20.172001 l22.26,3.236 l-16.108,15.7 l3.804,22.172001 z ","icon-star-2":"M17,31.212 l-7.194,4.08 l-4.728,-6.83 l-8.234,0.524 l-1.328,-8.226 l-7.644,-3.14 l2.338,-7.992 l-5.54,-6.18 l5.54,-6.176 l-2.338,-7.994 l7.644,-3.138 l1.328,-8.226 l8.234,0.522 l4.728,-6.83 L17,-24.312 l7.194,-4.08 l4.728,6.83 l8.234,-0.522 l1.328,8.226 l7.644,3.14 l-2.338,7.992 l5.54,6.178 l-5.54,6.178 l2.338,7.992 l-7.644,3.14 l-1.328,8.226 l-8.234,-0.524 l-4.728,6.83 z ","icon-polygon":"M3,31 L19,3 h32 l16,28 l-16,28 H19 z ","icon-location":"M24 62C8 45.503 0 32.837 0 24 0 10.745 10.745 0 24 0s24 10.745 24 24c0 8.837-8 21.503-24 38zm0-28c5.523 0 10-4.477 10-10s-4.477-10-10-10-10 4.477-10 10 4.477 10 10 10z","icon-heart":"M49.994999,91.349998 l-6.96,-6.333 C18.324001,62.606995 2.01,47.829002 2.01,29.690998 C2.01,14.912998 13.619999,3.299999 28.401001,3.299999 c8.349,0 16.362,5.859 21.594,12 c5.229,-6.141 13.242001,-12 21.591,-12 c14.778,0 26.390999,11.61 26.390999,26.390999 c0,18.138 -16.314001,32.916 -41.025002,55.374001 l-6.96,6.285 z ","icon-bubble":"M44 48L34 58V48H12C5.373 48 0 42.627 0 36V12C0 5.373 5.373 0 12 0h40c6.627 0 12 5.373 12 12v24c0 6.627-5.373 12-12 12h-8z"},defaultRotateRangeValus:{realTimeEvent:!0,min:-360,max:360,value:0},defaultDrawRangeValus:{min:5,max:30,value:12},defaultShapeStrokeValus:{realTimeEvent:!1,min:2,max:300,value:3},defaultTextRangeValus:{realTimeEvent:!0,min:10,max:100,value:50},defaultFilterRangeValus:{tintOpacityRange:{min:0,max:1,value:.7},removewhiteThresholdRange:{min:0,max:255,value:60},removewhiteDistanceRange:{min:0,max:255,value:10},gradientTransparencyRange:{min:0,max:255,value:100},brightnessRange:{min:-255,max:255,value:100},noiseRange:{min:0,max:1e3,value:100},pixelateRange:{min:2,max:20,value:4},colorfilterThresholeRange:{min:0,max:255,value:45}}}},function(e,t,n){n(144),n(146),n(147),n(145),e.exports=n(16).Promise},function(t,n){t.exports=e},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e){var t=l[e];if(t){for(var n=arguments.length,i=Array(n>1?n-1:0),o=1;on&&(i=t,t=n,n=i),r(t,o(e,n))},keyMirror:function(){for(var e={},t=arguments.length,n=Array(t),o=0;o1&&void 0!==arguments[1]?arguments[1]:"#7e7e7e",i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"up";o(this,e);var r=t.getAttribute("title");this._show=!1,this._toggleDirection=i,this._makePickerButtonElement(t,n),this._makePickerLayerElement(t,r),this._color=n,this.picker=u.default.create({container:this.pickerElement,preset:d,color:n}),this._addEvent(t)}return r(e,[{key:"_changeColorElement",value:function(e){e?(this.colorElement.classList.remove("transparent"),this.colorElement.style.backgroundColor=e):(this.colorElement.style.backgroundColor="#fff",this.colorElement.classList.add("transparent"))}},{key:"_makePickerButtonElement",value:function(e,t){e.classList.add("tui-image-editor-button"),this.colorElement=document.createElement("div"),this.colorElement.className="color-picker-value",t?this.colorElement.style.backgroundColor=t:this.colorElement.classList.add("transparent")}},{key:"_makePickerLayerElement",value:function(e,t){var n=document.createElement("label"),i=document.createElement("div");this.pickerControl=document.createElement("div"),this.pickerControl.className="color-picker-control",this.pickerElement=document.createElement("div"),this.pickerElement.className="color-picker",n.innerHTML=t,i.className="triangle",this.pickerControl.appendChild(this.pickerElement),this.pickerControl.appendChild(i),e.appendChild(this.pickerControl),e.appendChild(this.colorElement),e.appendChild(n),this._setPickerControlPosition()}},{key:"_addEvent",value:function(e){var t=this;this.picker.on("selectColor",function(e){t._changeColorElement(e.color),t._color=e.color,t.fire("change",e.color)}),e.addEventListener("click",function(e){t._show=!t._show,t.pickerControl.style.display=t._show?"block":"none",e.stopPropagation()}),document.body.addEventListener("click",function(){t._show=!1,t.pickerControl.style.display="none"})}},{key:"_setPickerControlPosition",value:function(){var e=this.pickerControl.style,t=(0,l.toInteger)(window.getComputedStyle(this.pickerControl,null).width)/2-20,n=((0,l.toInteger)(window.getComputedStyle(this.pickerControl,null).height)+12)*-1;"down"===this._toggleDirection&&(n=30),e.top=n+"px",e.left="-"+t+"px"}},{key:"color",get:function(){return this._color},set:function(e){this._color=e,this._changeColorElement(e)}}]),e}();s.default.CustomEvents.mixin(h),t.default=h},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var r=function(){function e(e,t){for(var n=0;n1&&void 0!==arguments[1]?arguments[1]:{};o(this,e),this._value=n.value||0,this.rangeElement=t,this._drawRangeElement(),this.rangeWidth=(0,l.toInteger)(window.getComputedStyle(t,null).width)-12,this._min=n.min||0,this._max=n.max||100,this._absMax=this._min*-1+this._max,this.realTimeEvent=n.realTimeEvent||!1,this._addClickEvent(),this._addDragEvent(),this.value=n.value,this.trigger("change")}return r(e,[{key:"trigger",value:function(e){this.fire(e,this._value)}},{key:"_drawRangeElement",value:function(){this.rangeElement.classList.add("tui-image-editor-range"),this.bar=document.createElement("div"),this.bar.className="tui-image-editor-virtual-range-bar",this.subbar=document.createElement("div"),this.subbar.className="tui-image-editor-virtual-range-subbar",this.pointer=document.createElement("div"),this.pointer.className="tui-image-editor-virtual-range-pointer",this.bar.appendChild(this.subbar),this.bar.appendChild(this.pointer),this.rangeElement.appendChild(this.bar)}},{key:"_addClickEvent",value:function(){var e=this;this.rangeElement.addEventListener("click",function(t){if(t.stopPropagation(),"tui-image-editor-range"===t.target.className){var n=t.offsetX,i=n/e.rangeWidth,o=e._absMax*i+e._min;e.pointer.style.left=i*e.rangeWidth+"px",e.subbar.style.right=(1-i)*e.rangeWidth+"px",e._value=o,e.fire("change",o)}})}},{key:"_addDragEvent",value:function(){var e=this;this.pointer.addEventListener("mousedown",function(t){e.firstPosition=t.screenX,e.firstLeft=(0,l.toInteger)(e.pointer.style.left)||0,e.dragEventHandler={changeAngle:e._changeAngle.bind(e),stopChangingAngle:e._stopChangingAngle.bind(e)},document.addEventListener("mousemove",e.dragEventHandler.changeAngle),document.addEventListener("mouseup",e.dragEventHandler.stopChangingAngle)})}},{key:"_changeAngle",value:function(e){var t=e.screenX,n=t-this.firstPosition,i=this.firstLeft+n;i=i>this.rangeWidth?this.rangeWidth:i,i=i<0?0:i,this.pointer.style.left=i+"px",this.subbar.style.right=this.rangeWidth-i+"px";var o=i/this.rangeWidth,r=this._absMax*o+this._min;this._value=r,this.realTimeEvent&&this.fire("change",r)}},{key:"_stopChangingAngle",value:function(){this.fire("change",this._value),document.removeEventListener("mousemove",this.dragEventHandler.changeAngle),document.removeEventListener("mouseup",this.dragEventHandler.stopChangingAngle)}},{key:"max",set:function(e){this._max=e,this._absMax=this._min*-1+this._max,this.value=this._value},get:function(){return this._max}},{key:"value",get:function(){return this._value},set:function(e){var t=e-this._min,n=t*this.rangeWidth/this._absMax;this.rangeWidth0?i:n)(e)}},function(e,t,n){var i=n(122),o=n(25);e.exports=function(e){return i(o(e))}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(3),r=i(o),a=n(5),s=(0,a.keyMirror)("UN_IMPLEMENTATION","NO_COMPONENT_NAME"),l={UN_IMPLEMENTATION:"Should implement a method: ",NO_COMPONENT_NAME:"Should set a component name"},c={UN_IMPLEMENTATION:function(e){return l.UN_IMPLEMENTATION+e},NO_COMPONENT_NAME:function(){return l.NO_COMPONENT_NAME}};e.exports={types:r.default.extend({},s),create:function(e){e=e.toLowerCase();for(var t=c[e],n=arguments.length,i=Array(n>1?n-1:0),o=1;on;)t.push(arguments[n++]);return v[++g]=function(){s("function"==typeof e?e:Function(e),t)},i(g),g},f=function(e){delete v[e]},"process"==n(19)(d)?i=function(e){d.nextTick(a(b,e,1))}:p?(o=new p,r=o.port2,o.port1.onmessage=y,i=a(r.postMessage,r,1)):u.addEventListener&&"function"==typeof postMessage&&!u.importScripts?(i=function(e){u.postMessage(e+"","*")},u.addEventListener("message",y,!1)):i=m in c("script")?function(e){l.appendChild(c("script"))[m]=function(){l.removeChild(this),b.call(e)}}:function(e){setTimeout(a(b,e,1),0)}),e.exports={set:h,clear:f}},function(e,t,n){var i=n(29),o=Math.min;e.exports=function(e){return e>0?o(i(e),9007199254740991):0}},function(e,t){var n=0,i=Math.random();e.exports=function(e){return"Symbol(".concat(void 0===e?"":e,")_",(++n+i).toString(36))}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0});var o=n(3),r=n(5),a=i(r),s=n(86),l=i(s);t.default={getActions:function(){return{main:this._mainAction(),shape:this._shapeAction(),crop:this._cropAction(),flip:this._flipAction(),rotate:this._rotateAction(),text:this._textAction(),mask:this._maskAction(),draw:this._drawAction(),icon:this._iconAction(),filter:this._filterAction()}},_mainAction:function(){var e=this,t=function(){"crop"===e.ui.submenu&&(e.stopDrawingMode(),e.ui.changeMenu("crop"))};return(0,o.extend)({initLoadImage:function(n,i){return e.loadImageFromURL(n,i).then(function(i){t(),e.ui.initializeImgUrl=n,e.ui.resizeEditor({imageSize:i}),e.clearUndoStack()})},undo:function(){e.isEmptyUndoStack()||(t(),e.undo())},redo:function(){e.isEmptyRedoStack()||(t(),e.redo())},reset:function(){t(),e.loadImageFromURL(e.ui.initializeImgUrl,"resetImage").then(function(n){t(),e.ui.resizeEditor({imageSize:n}),e.clearUndoStack()})},delete:function(){e.ui.changeDeleteButtonEnabled(!1),t(),e.removeActiveObject(),e.activeObjectId=null},deleteAll:function(){t(),e.clearObjects(),e.ui.changeDeleteButtonEnabled(!1),e.ui.changeDeleteAllButtonEnabled(!1)},load:function(n){a.default.isSupportFileApi()||alert("This browser does not support file-api"),e.ui.initializeImgUrl=URL.createObjectURL(n),e.loadImageFromFile(n).then(function(){t(),e.clearUndoStack(),e.ui.resizeEditor()}).catch(function(e){return Promise.reject(e)})},download:function(){var t=e.toDataURL(),n=e.getImageName(),i=void 0,o=void 0,r=void 0;a.default.isSupportFileApi()&&window.saveAs?(i=a.default.base64ToBlob(t),o=i.type.split("/")[1],n.split(".").pop()!==o&&(n+="."+o),saveAs(i,n)):(r=window.open(),r.document.body.innerHTML="")}},this._commonAction())},_iconAction:function(){var e=this,t=void 0,n=void 0,i=void 0,r=void 0,a=void 0,s=void 0,c=void 0;this.on({iconCreateResize:function(t){var n=t.moveOriginPointer,o=(n.x-i)/a,l=(n.y-r)/s;e.setObjectPropertiesQuietly(c,{scaleX:Math.abs(2*o),scaleY:Math.abs(2*l)})},iconCreateEnd:function(){e.ui.icon.clearIconType(),e.changeSelectableAll(!0)}});var u=function(o,l){i=l.x,r=l.y,e.addIcon(t,{left:l.x,top:l.y,fill:n}).then(function(e){c=e.id,a=e.width,s=e.height})};return(0,o.extend)({changeColor:function(t){e.activeObjectId&&e.changeIconColor(e.activeObjectId,t)},addIcon:function(i,o){t=i,n=o,e.changeCursor("crosshair"),e.off("mousedown"),e.once("mousedown",u.bind(e))},cancelAddIcon:function(){e.off("mousedown"),e.ui.icon.clearIconType(),e.changeSelectableAll(!0),e.changeCursor("default")},registDefalutIcons:function(t,n){var i={};i[t]=n,e.registerIcons(i)},registCustomIcon:function(t,n){var i=new l.default;i.imageToSVG(t,function(t){var i=t.match(/path[^>]*d="([^"]*)"/),o=i[1],r={};r[n.name]=o,e.registerIcons(r),e.addIcon(n.name,{left:100,top:100})},l.default.tracerDefaultOption())}},this._commonAction())},_drawAction:function(){var e=this;return(0,o.extend)({setDrawMode:function(t,n){e.stopDrawingMode(),"free"===t?e.startDrawingMode("FREE_DRAWING",n):e.startDrawingMode("LINE_DRAWING",n)},setColor:function(t){e.setBrush({color:t})}},this._commonAction())},_maskAction:function(){var e=this;return(0,o.extend)({loadImageFromURL:function(t,n){return e.loadImageFromURL(e.toDataURL(),"FilterImage").then(function(){e.addImageObject(t).then(function(){URL.revokeObjectURL(n)})})},applyFilter:function(){e.applyFilter("mask",{maskObjId:e.activeObjectId})}},this._commonAction())},_textAction:function(){var e=this;return(0,o.extend)({changeTextStyle:function(t){e.activeObjectId&&e.changeTextStyle(e.activeObjectId,t)}},this._commonAction())},_rotateAction:function(){var e=this;return(0,o.extend)({rotate:function(t){e.rotate(t),e.ui.resizeEditor()},setAngle:function(t){e.setAngle(t),e.ui.resizeEditor()}},this._commonAction())},_shapeAction:function(){var e=this;return(0,o.extend)({changeShape:function(t){e.activeObjectId&&e.changeShape(e.activeObjectId,t)},setDrawingShape:function(t){e.setDrawingShape(t)}},this._commonAction())},_cropAction:function(){var e=this;return(0,o.extend)({crop:function(){var t=e.getCropzoneRect();t&&e.crop(t).then(function(){e.stopDrawingMode(),e.ui.resizeEditor(),e.ui.changeMenu("crop")}).catch(function(e){return Promise.reject(e)})},cancel:function(){e.stopDrawingMode(),e.ui.changeMenu("crop")}},this._commonAction())},_flipAction:function(){var e=this;return(0,o.extend)({flip:function(t){return e[t]()}},this._commonAction())},_filterAction:function(){var e=this;return(0,o.extend)({applyFilter:function(t,n,i){t?e.applyFilter(n,i):e.hasFilter(n)&&e.removeFilter(n)}},this._commonAction())},setReAction:function(){var e=this;this.on({undoStackChanged:function(t){t?(e.ui.changeUndoButtonStatus(!0),e.ui.changeResetButtonStatus(!0)):(e.ui.changeUndoButtonStatus(!1),e.ui.changeResetButtonStatus(!1)),e.ui.resizeEditor()},redoStackChanged:function(t){t?e.ui.changeRedoButtonStatus(!0):e.ui.changeRedoButtonStatus(!1),e.ui.resizeEditor()},objectActivated:function(t){e.activeObjectId=t.id,e.ui.changeDeleteButtonEnabled(!0),e.ui.changeDeleteAllButtonEnabled(!0),"cropzone"===t.type?e.ui.crop.changeApplyButtonStatus(!0):["rect","circle","triangle"].indexOf(t.type)>-1?(e.stopDrawingMode(),"shape"!==e.ui.submenu&&e.ui.changeMenu("shape",!1,!1),e.ui.shape.setShapeStatus({strokeColor:t.stroke,strokeWidth:t.strokeWidth,fillColor:t.fill}),e.ui.shape.setMaxStrokeValue(Math.min(t.width,t.height))):"path"===t.type||"line"===t.type?"draw"!==e.ui.submenu&&(e.ui.changeMenu("draw",!1,!1),e.ui.draw.changeStandbyMode()):["i-text","text"].indexOf(t.type)>-1?"text"!==e.ui.submenu&&e.ui.changeMenu("text",!1,!1):"icon"===t.type&&(e.stopDrawingMode(),"icon"!==e.ui.submenu&&e.ui.changeMenu("icon",!1,!1),e.ui.icon.setIconPickerColor(t.fill))},addText:function(t){e.addText("Double Click",{position:t.originPosition,styles:{fill:e.ui.text.textColor,fontSize:a.default.toInteger(e.ui.text.fontSize)}}).then(function(){e.changeCursor("default")})},addObjectAfter:function(t){["rect","circle","triangle"].indexOf(t.type)>-1&&(e.ui.shape.setMaxStrokeValue(Math.min(t.width,t.height)),e.ui.shape.changeStandbyMode())},objectScaled:function(t){if(["i-text","text"].indexOf(t.type)>-1)e.ui.text.fontSize=a.default.toInteger(t.fontSize);else if(["rect","circle","triangle"].indexOf(t.type)>=0){var n=t.width,i=t.height,o=e.ui.shape.getStrokeValue();nv&&(r.remove(),r.set(this._calcRectDimensionFromPoint(i,o)),t.add(r))}},{key:"_calcRectDimensionFromPoint",value:function(e,t){var n=this.getCanvas(),i=n.getWidth(),o=n.getHeight(),r=this._startX,a=this._startY,s=(0,g.clamp)(e,0,r),l=(0,g.clamp)(t,0,a),c=(0,g.clamp)(e,r,i)-s,u=(0,g.clamp)(t,a,o)-l;return this._withShiftKey&&(c>u?u=c:u>c&&(c=u),r>=e&&(s=r-c),a>=t&&(l=a-u)),{left:s,top:l,width:c,height:u}}},{key:"_onFabricMouseUp",value:function(){var e=this._cropzone,t=this._listeners,n=this.getCanvas();n.setActiveObject(e),n.off({"mouse:move":t.mousemove,"mouse:up":t.mouseup})}},{key:"getCroppedImageData",value:function(e){var t=this.getCanvas(),n=t.contains(this._cropzone);if(!e)return null;n&&this._cropzone.remove();var i={imageName:this.getImageName(),url:t.toDataURL(e)};return n&&t.add(this._cropzone),i}},{key:"getCropzoneRect",value:function(){var e=this._cropzone;return e.isValid()?{left:e.getLeft(),top:e.getTop(),width:e.getWidth(),height:e.getHeight()}:null}},{key:"_onKeyDown",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!0)}},{key:"_onKeyUp",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!1)}}]),t}(d.default);e.exports=m},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;nn},_getColor:function(e,t,n){var i=[0,0,0,0],o=e.data,r=e.width,a=4,s=(r*n+t)*a;return i[0]=o[s],i[1]=o[s+1],i[2]=o[s+2],i[3]=o[s+3],i}});e.exports=a},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(3),r=i(o),a=n(6),s=i(a),l=n(5),c="tl",u="tr",d="mt",h="ml",f="mr",p="mb",g="bl",v="br",m=s.default.util.createClass(s.default.Rect,{initialize:function(e,t){e=r.default.extend(e,t),e.type="cropzone",this.callSuper("initialize",e),this.options=e,this.on({moving:this._onMoving,scaling:this._onScaling})},_render:function(e){var t=7,n=7;this.callSuper("_render",e);var i=this.flipX?-1:1,o=this.flipY?-1:1,r=i/this.scaleX,a=o/this.scaleY;e.scale(r,a),this._fillOuterRect(e,"rgba(0, 0, 0, 0.55)"),this.options.lineWidth?this._fillInnerRect(e):(this._strokeBorder(e,"rgb(0, 0, 0)",{lineDashWidth:t}),this._strokeBorder(e,"rgb(255, 255, 255)",{lineDashWidth:t,lineDashOffset:n})),e.scale(1/r,1/a)},_fillOuterRect:function(e,t){var n=this._getCoordinates(e),i=n.x,o=n.y;e.save(),e.fillStyle=t,e.beginPath(),e.moveTo(i[0]-1,o[0]-1),e.lineTo(i[3]+1,o[0]-1),e.lineTo(i[3]+1,o[3]+1),e.lineTo(i[0]-1,o[3]+1),e.lineTo(i[0]-1,o[0]-1),e.closePath(),e.moveTo(i[1],o[1]),e.lineTo(i[1],o[2]),e.lineTo(i[2],o[2]),e.lineTo(i[2],o[1]),e.lineTo(i[1],o[1]),e.closePath(),e.fill(),e.restore()},_fillInnerRect:function(e){var t=this._getCoordinates(e),n=t.x,i=t.y,o=this._caculateInnerPosition(n,(n[2]-n[1])/3),r=this._caculateInnerPosition(i,(i[2]-i[1])/3);e.save(),e.strokeStyle="rgba(255, 255, 255, 0.7)",e.lineWidth=this.options.lineWidth,e.beginPath(),e.moveTo(o[0],r[1]),e.lineTo(o[3],r[1]),e.moveTo(o[0],r[2]),e.lineTo(o[3],r[2]),e.moveTo(o[1],r[0]),e.lineTo(o[1],r[3]),e.moveTo(o[2],r[0]),e.lineTo(o[2],r[3]),e.stroke(),e.closePath(),e.restore()},_caculateInnerPosition:function(e,t){var n=[];return n[0]=e[1],n[1]=e[1]+t,n[2]=e[1]+2*t,n[3]=e[2],n},_getCoordinates:function(e){var t=this.getWidth(),n=this.getHeight(),i=t/2,o=n/2,a=this.getLeft(),s=this.getTop(),l=e.canvas;return{x:r.default.map([-(i+a),-i,i,i+(l.width-a-t)],Math.ceil),y:r.default.map([-(o+s),-o,o,o+(l.height-s-n)],Math.ceil)}},_strokeBorder:function(e,t,n){var i=n.lineDashWidth,o=n.lineDashOffset,r=n.lineWidth,a=this.getWidth()/2,s=this.getHeight()/2;e.save(),e.strokeStyle=t,e.setLineDash&&e.setLineDash([i,i]),o&&(e.lineDashOffset=o),r&&(e.lineWidth=r),e.beginPath(),e.moveTo(-a,-s),e.lineTo(a,-s),e.lineTo(a,s),e.lineTo(-a,s),e.lineTo(-a,-s),e.stroke(),e.restore()},_onMoving:function(){var e=this.getLeft(),t=this.getTop(),n=this.getWidth(),i=this.getHeight(),o=this.canvas.getWidth()-n,r=this.canvas.getHeight()-i;this.setLeft((0,l.clamp)(e,0,o)),this.setTop((0,l.clamp)(t,0,r))},_onScaling:function(e){var t=this.canvas.getPointer(e.e),n=this._calcScalingSizeFromPointer(t);this.scale(1).set(n)},_calcScalingSizeFromPointer:function(e){var t=e.x,n=e.y,i=this._calcTopLeftScalingSizeFromPointer(t,n),o=this._calcBottomRightScalingSizeFromPointer(t,n);return this._makeScalingSettings(i,o)},_calcTopLeftScalingSizeFromPointer:function(e,t){var n=this.getHeight()+this.top,i=this.getWidth()+this.left,o=(0,l.clamp)(t,0,n-1),r=(0,l.clamp)(e,0,i-1);return{top:o,left:r,width:i-r,height:n-o}},_calcBottomRightScalingSizeFromPointer:function(e,t){var n=this.canvas,i=n.width,o=n.height,r=this.left,a=this.top;return{width:(0,l.clamp)(e,r+1,i)-r,height:(0,l.clamp)(t,a+1,o)-a}},_makeScalingSettings:function(e,t){var n=e.width,i=e.height,o=t.height,r=t.width,a=e.left,s=e.top,l=void 0;switch(this.__corner){case c:l=e;break;case u:l={width:r,height:i,top:s};break;case g:l={width:n,height:o,left:a};break;case v:l=t;break;case h:l={width:n,left:a};break;case d:l={height:i,top:s};break;case f:l={width:r};break;case p:l={height:o}}return l},isValid:function(){return this.left>=0&&this.top>=0&&this.width>0&&this.height>0}});e.exports=m},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(6),r=i(o),a=r.default.util.createClass(r.default.Image.filters.Convolute,{type:"Emboss",initialize:function(){var e=[1,1,1,1,.7,-1,-1,-1,-1];this.matrix=e}});e.exports=a},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(6),r=i(o),a=r.default.util.createClass(r.default.Image.filters.Mask,{applyTo:function(e){if(this.mask){var t=e.width,n=e.height,i=this._createCanvasOfMask(t,n),o=e.getContext("2d"),r=i.getContext("2d"),a=o.getImageData(0,0,t,n);this._drawMask(r,e,o),this._mapData(r,a,t,n),o.putImageData(a,0,0)}},_createCanvasOfMask:function(e,t){var n=r.default.util.createCanvasElement();return n.width=e,n.height=t,n},_drawMask:function(e){var t=this.mask,n=t.getElement(),i=t.getLeft(),o=t.getTop(),r=t.getAngle();e.save(),e.translate(i,o),e.rotate(r*Math.PI/180),e.scale(t.scaleX,t.scaleY),e.drawImage(n,-n.width/2,-n.height/2),e.restore()},_mapData:function(e,t,n,i){for(var o=t.data,r=e.getImageData(0,0,n,i).data,a=this.channel,s=t.width*t.height*4,l=0;l1&&void 0!==arguments[1]?arguments[1]:{},i=n.cssMaxWidth,r=n.cssMaxHeight,a=n.useItext,s=void 0!==a&&a,l=n.useDragAddIcon,c=void 0!==l&&l;o(this,e),this.canvasImage=null,this.cssMaxWidth=i||ie,this.cssMaxHeight=r||oe,this.useItext=s,this.useDragAddIcon=c,this.cropSelectionStyle={},this.imageName="",this._objects={},this._canvas=null,this._drawingMode=q.NORMAL,this._drawingModeMap={},this._componentMap={},this._handler={onMouseDown:this._onMouseDown.bind(this),onObjectAdded:this._onObjectAdded.bind(this),onObjectRemoved:this._onObjectRemoved.bind(this),onObjectMoved:this._onObjectMoved.bind(this),onObjectScaled:this._onObjectScaled.bind(this),onObjectSelected:this._onObjectSelected.bind(this),onPathCreated:this._onPathCreated.bind(this),onSelectionCleared:this._onSelectionCleared.bind(this),onSelectionCreated:this._onSelectionCreated.bind(this)},this._setCanvasElement(t),this._createDrawingModeInstances(),this._createComponents(),this._attachCanvasEvents()}return r(e,[{key:"destroy",value:function(){var e=this._canvas.wrapperEl;this._canvas.clear(),e.parentNode.removeChild(e)}},{key:"deactivateAll",value:function(){return this._canvas.deactivateAll(),this}},{key:"renderAll",value:function(){return this._canvas.renderAll(),this}},{key:"add",value:function(e){var t,n=[];$(e)?n=e:n.push(e),(t=this._canvas).add.apply(t,n)}},{key:"contains",value:function(e){return this._canvas.contains(e)}},{key:"getObjects",value:function(){return this._canvas.getObjects().slice()}},{key:"getObject",value:function(e){return this._objects[e]}},{key:"remove",value:function(e){this._canvas.remove(e)}},{key:"removeAll",value:function(e){var t=this._canvas,n=t.getObjects().slice();return t.remove.apply(t,this._canvas.getObjects()),e&&t.clear(),n}},{key:"removeObjectById",value:function(e){var t=[],n=this._canvas,i=this.getObject(e),o=i&&i.isType("group")&&!i.isEmpty();return o?(n.discardActiveGroup(),i.forEachObject(function(e){t.push(e),e.remove()})):n.contains(i)&&(t.push(i),i.remove()),t}},{key:"getObjectId",value:function(e){var t=null;for(t in this._objects)if(this._objects.hasOwnProperty(t)&&e===this._objects[t])return t;return null}},{key:"getActiveObject",value:function(){return this._canvas.getActiveObject()}},{key:"getActiveGroupObject",value:function(){return this._canvas.getActiveGroup()}},{key:"setActiveObject",value:function(e){this._canvas.setActiveObject(e)}},{key:"setCropSelectionStyle",value:function(e){this.cropSelectionStyle=e}},{key:"getComponent",value:function(e){return this._componentMap[e]}},{key:"getDrawingMode",value:function(){return this._drawingMode}},{key:"startDrawingMode",value:function(e,t){if(this._isSameDrawingMode(e))return!0;this.stopDrawingMode();var n=this._getDrawingModeInstance(e);return n&&n.start&&(n.start(this,t),this._drawingMode=e),!!n}},{key:"stopDrawingMode",value:function(){if(!this._isSameDrawingMode(q.NORMAL)){var e=this._getDrawingModeInstance(this.getDrawingMode());e&&e.end&&e.end(this),this._drawingMode=q.NORMAL}}},{key:"toDataURL",value:function(e){return this._canvas&&this._canvas.toDataURL(e)}},{key:"setCanvasImage",value:function(e,t){t&&Z(t),this.imageName=e,this.canvasImage=t}},{key:"setCssMaxDimension",value:function(e){this.cssMaxWidth=e.width||this.cssMaxWidth,this.cssMaxHeight=e.height||this.cssMaxHeight}},{key:"adjustCanvasDimension",value:function(){var e=this.canvasImage.scale(1),t=e.getBoundingRect(),n=t.width,i=t.height,o=this._calcMaxDimension(n,i);this.setCanvasCssDimension({width:"100%",height:"100%","max-width":o.width+"px","max-height":o.height+"px"}),this.setCanvasBackstoreDimension({width:n,height:i}),this._canvas.centerObject(e)}},{key:"setCanvasCssDimension",value:function(e){this._canvas.setDimensions(e,re)}},{key:"setCanvasBackstoreDimension",value:function(e){this._canvas.setDimensions(e,ae)}},{key:"setImageProperties",value:function(e,t){var n=this.canvasImage;n&&(n.set(e).setCoords(),t&&this._canvas.renderAll())}},{key:"getCanvasElement",value:function(){return this._canvas.getElement()}},{key:"getCanvas",value:function(){return this._canvas}},{key:"getCanvasImage",value:function(){return this.canvasImage}},{key:"getImageName",value:function(){return this.imageName}},{key:"addImageObject",value:function(e){var t=this,n=this._callbackAfterLoadingImageObject.bind(this);return new c.default(function(i){d.default.Image.fromURL(e,function(e){n(e),i(t.createObjectProperties(e))},{crossOrigin:"Anonymous"})})}},{key:"getCenter",value:function(){return this._canvas.getCenter()}},{key:"getCropzoneRect",value:function(){return this.getComponent(G.CROPPER).getCropzoneRect()}},{key:"getCroppedImageData",value:function(e){return this.getComponent(G.CROPPER).getCroppedImageData(e)}},{key:"setBrush",value:function(e){var t=this._drawingMode,n=G.FREE_DRAWING;t===q.LINE&&(n=q.LINE),this.getComponent(n).setBrush(e)}},{key:"setDrawingShape",value:function(e,t){this.getComponent(G.SHAPE).setStates(e,t)}},{key:"registerPaths",value:function(e){this.getComponent(G.ICON).registerPaths(e)}},{key:"changeCursor",value:function(e){var t=this.getCanvas();t.defaultCursor=e,t.renderAll()}},{key:"hasFilter",value:function(e){return this.getComponent(G.FILTER).hasFilter(e)}},{key:"setSelectionStyle",value:function(e){J(K.SELECTION_STYLE,e)}},{key:"setObjectProperties",value:function(e,t){var n=this.getObject(e),i=J({},t);return n.set(i),n.setCoords(),this.getCanvas().renderAll(),i}},{key:"getObjectProperties",value:function(e,t){var n=this.getObject(e),i={};return Q(t)?i[t]=n[t]:$(t)?ee(t,function(e){i[e]=n[e]}):te(t,function(e,t){i[t]=n[t]}),i}},{key:"getObjectPosition",value:function(e,t,n){var i=this.getObject(e);return i?i.getPointByOrigin(t,n):null}},{key:"setObjectPosition",value:function(e,t){var n=this.getObject(e),i=t.x,o=t.y,r=t.originX,a=t.originY;if(!n)return!1;var s=n.getPointByOrigin(r,a),l=n.getPointByOrigin("center","center"),c=l.x-s.x,u=l.y-s.y;return n.set({left:i+c,top:o+u}),n.setCoords(),!0}},{key:"getCanvasSize",value:function(){var e=this.getCanvasImage();return{width:e?e.width:0,height:e?e.height:0}}},{key:"_getDrawingModeInstance",value:function(e){return this._drawingModeMap[e]}},{key:"_setCanvasElement",value:function(e){var t=void 0,n=void 0;t=e.jquery?e[0]:e.nodeType?e:document.querySelector(e),"CANVAS"!==t.nodeName.toUpperCase()&&(n=document.createElement("canvas"),t.appendChild(n)),this._canvas=new d.default.Canvas(n,{containerClass:"tui-image-editor-canvas-container",enableRetinaScaling:!1})}},{key:"_createDrawingModeInstances",value:function(){this._register(this._drawingModeMap,new I.default),this._register(this._drawingModeMap,new R.default),this._register(this._drawingModeMap,new N.default),this._register(this._drawingModeMap,new F.default),this._register(this._drawingModeMap,new z.default)}},{key:"_createComponents",value:function(){this._register(this._componentMap,new f.default(this)),this._register(this._componentMap,new g.default(this)),this._register(this._componentMap,new m.default(this)),this._register(this._componentMap,new y.default(this)),this._register(this._componentMap,new k.default(this)),this._register(this._componentMap,new x.default(this)),this._register(this._componentMap,new C.default(this)),this._register(this._componentMap,new S.default(this)),this._register(this._componentMap,new j.default(this)),this._register(this._componentMap,new P.default(this))}},{key:"_register",value:function(e,t){e[t.getName()]=t}},{key:"_isSameDrawingMode",value:function(e){return this.getDrawingMode()===e}},{key:"_calcMaxDimension",value:function(e,t){var n=this.cssMaxWidth/e,i=this.cssMaxHeight/t,o=Math.min(e,this.cssMaxWidth),r=Math.min(t,this.cssMaxHeight);return n<1&&n-1&&J(n,this._createTextProperties(e,n)),n}},{key:"_createTextProperties",value:function(e){var t=["text","fontFamily","fontSize","fontStyle","textAlign","textDecoration"],n={};return J(n,X.default.getProperties(e,t)),n}},{key:"_addFabricObject",value:function(e){var t=Z(e);return this._objects[t]=e,t}},{key:"_removeFabricObject",value:function(e){delete this._objects[e]}}]),e}();ne.mixin(se),e.exports=se},function(e,t){"use strict";function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n0&&(e=this.blur(e,t.blurradius,t.blurdelta)),h=0;h0)for(d=0;d0&&(f[d]={r:Math.floor(s[d].r/s[d].n),g:Math.floor(s[d].g/s[d].n),b:Math.floor(s[d].b/s[d].n),a:Math.floor(s[d].a/s[d].n)}),s[d].n/ln[i].boundingbox[2]&&(n[i].boundingbox[2]=r-1),a-1n[i].boundingbox[3]&&(n[i].boundingbox[3]=a-1),h=this.pathscan_combined_lookup[e[a][r]][c],e[a][r]=h[0],c=h[1],r+=h[2],a+=h[3],r-1===n[i].points[0].x&&a-1===n[i].points[0].y)if(u=!0,n[i].points.lengtht[2]&&e[3]>t[3]}},{key:"batchpathscan",value:function(e,t){var n=[];for(var i in e)e.hasOwnProperty(i)&&(n[i]=this.pathscan(e[i],t));return n}},{key:"internodes",value:function(e,t){var n=[],i=0,o=0,r=0,a=0,s=0,l=void 0,c=void 0;for(l=0;l0&&(n[l].points[n[l].points.length-1].linesegment=this.getdirection(n[l].points[n[l].points.length-1].x,n[l].points[n[l].points.length-1].y,e[l].points[c].x,e[l].points[c].y)),n[l].points.push({x:e[l].points[c].x,y:e[l].points[c].y,linesegment:this.getdirection(e[l].points[c].x,e[l].points[c].y,(e[l].points[c].x+e[l].points[o].x)/2,(e[l].points[c].y+e[l].points[o].y)/2)})),n[l].points.push({x:(e[l].points[c].x+e[l].points[o].x)/2,y:(e[l].points[c].y+e[l].points[o].y)/2,linesegment:this.getdirection((e[l].points[c].x+e[l].points[o].x)/2,(e[l].points[c].y+e[l].points[o].y)/2,(e[l].points[o].x+e[l].points[r].x)/2,(e[l].points[o].y+e[l].points[r].y)/2)});return n}},{key:"testrightangle",value:function(e,t,n,i,o,r){return e.points[i].x===e.points[t].x&&e.points[i].x===e.points[n].x&&e.points[i].y===e.points[o].y&&e.points[i].y===e.points[r].y||e.points[i].y===e.points[t].y&&e.points[i].y===e.points[n].y&&e.points[i].x===e.points[o].x&&e.points[i].x===e.points[r].x}},{key:"getdirection",value:function(e,t,n,i){var o=8;return o=ei?7:0:e>n?ti?5:4:ti?6:8}},{key:"batchinternodes",value:function(e,t){var n=[];for(var i in e)e.hasOwnProperty(i)&&(n[i]=this.internodes(e[i],t));return n}},{key:"tracepath",value:function(e,t,n){var i=0,o=void 0,r=void 0,a=void 0,s={};for(s.segments=[],s.boundingbox=e.boundingbox,s.holechildren=e.holechildren,s.isholepath=e.isholepath;i0?a:e.points.length}return s}},{key:"fitseq",value:function(e,t,n,i,o){if(o>e.points.length||o<0)return[];var r=i,a=0,s=!0,l=void 0,c=void 0,u=void 0,d=o-i;d<0&&(d+=e.points.length);for(var h=(e.points[o].x-e.points[i].x)/d,f=(e.points[o].y-e.points[i].y)/d,p=(i+1)%e.points.length,g=void 0;p!=o;)g=p-i,g<0&&(g+=e.points.length),l=e.points[i].x+h*g,c=e.points[i].y+f*g,u=(e.points[p].x-l)*(e.points[p].x-l)+(e.points[p].y-c)*(e.points[p].y-c),u>t&&(s=!1),u>a&&(r=p,a=u),p=(p+1)%e.points.length;if(s)return[{type:"L",x1:e.points[i].x,y1:e.points[i].y,x2:e.points[o].x,y2:e.points[o].y}];var v=r;s=!0,a=0;var m=(v-i)/d,b=(1-m)*(1-m),y=2*(1-m)*m,_=m*m,k=(b*e.points[i].x+_*e.points[o].x-e.points[v].x)/-y,w=(b*e.points[i].y+_*e.points[o].y-e.points[v].y)/-y;for(p=i+1;p!=o;)m=(p-i)/d,b=(1-m)*(1-m),y=2*(1-m)*m,_=m*m,l=b*e.points[i].x+y*k+_*e.points[o].x,c=b*e.points[i].y+y*w+_*e.points[o].y,u=(e.points[p].x-l)*(e.points[p].x-l)+(e.points[p].y-c)*(e.points[p].y-c),u>n&&(s=!1),u>a&&(r=p,a=u),p=(p+1)%e.points.length;if(s)return[{type:"Q",x1:e.points[i].x,y1:e.points[i].y,x2:k,y2:w,x3:e.points[o].x,y3:e.points[o].y}];var x=v;return this.fitseq(e,t,n,i,x).concat(this.fitseq(e,t,n,x,o))}},{key:"batchtracepaths",value:function(e,t,n){var i=[];for(var o in e)e.hasOwnProperty(o)&&i.push(this.tracepath(e[o],t,n));return i}},{key:"batchtracelayers",value:function(e,t,n){var i=[];for(var o in e)e.hasOwnProperty(o)&&(i[o]=this.batchtracepaths(e[o],t,n));return i}},{key:"roundtodec",value:function(e,t){return Number(e.toFixed(t))}},{key:"svgpathstring",value:function(e,t,n,i){var o=e.layers[t],r=o[n],a="",s=void 0;if(i.linefilter&&r.segments.length<3)return a;if(a="=0;s--)a+=c.segments[s].type+" ",c.segments[s].hasOwnProperty("x3")&&(a+=c.segments[s].x2*i.scale+" "+c.segments[s].y2*i.scale+" "),a+=c.segments[s].x1*i.scale+" "+c.segments[s].y1*i.scale+" ";else for(a+=c.segments[c.segments.length-1].hasOwnProperty("x3")?"M "+this.roundtodec(c.segments[c.segments.length-1].x3*i.scale)+" "+this.roundtodec(c.segments[c.segments.length-1].y3*i.scale)+" ":"M "+this.roundtodec(c.segments[c.segments.length-1].x2*i.scale)+" "+this.roundtodec(c.segments[c.segments.length-1].y2*i.scale)+" ",s=c.segments.length-1;s>=0;s--)a+=c.segments[s].type+" ",c.segments[s].hasOwnProperty("x3")&&(a+=this.roundtodec(c.segments[s].x2*i.scale)+" "+this.roundtodec(c.segments[s].y2*i.scale)+" "),a+=this.roundtodec(c.segments[s].x1*i.scale)+" "+this.roundtodec(c.segments[s].y1*i.scale)+" ";a+="Z "}if(a+='" />',i.lcpr||i.qcpr){for(s=0;s',a+='',a+='',a+=''),!r.segments[s].hasOwnProperty("x3")&&i.lcpr&&(a+='');for(var l=0;l',a+='',a+='',a+=''),!c.segments[s].hasOwnProperty("x3")&&i.lcpr&&(a+='')}}return a}},{key:"getsvgstring",value:function(e,t){t=this.checkoptions(t);for(var n=e.width*t.scale,i=e.height*t.scale,o="',r=0;r5&&(t=5),n=Math.abs(n),n>1024&&(n=1024);var p=this.gks[t-1];for(o=0;o0&&i+r0&&o+rn&&(f.data[s]=e.data[s],f.data[s+1]=e.data[s+1],f.data[s+2]=e.data[s+2],f.data[s+3]=e.data[s+3]);return f}},{key:"loadImage",value:function(e,t,n){var i=new Image;n&&n.corsenabled&&(i.crossOrigin="Anonymous"),i.src=e,i.onload=function(){var e=document.createElement("canvas");e.width=i.width,e.height=i.height;var n=e.getContext("2d");n.drawImage(i,0,0),t(e)}}},{key:"getImgdata",value:function(e){var t=e.getContext("2d");return t.getImageData(0,0,e.width,e.height)}},{key:"drawLayers",value:function(e,t,n,i){n=n||1;var o=void 0,r=void 0,a=void 0,s=void 0,l=void 0,c=void 0;i?(c=document.getElementById(i),c||(c=document.createElement("div"),c.id=i,document.body.appendChild(c))):(c=document.createElement("div"),document.body.appendChild(c));for(l in e)if(e.hasOwnProperty(l)){o=e[l][0].length,r=e[l].length;var u=document.createElement("canvas");u.width=o*n,u.height=r*n;var d=u.getContext("2d");for(s=0;sl?"right":"left",originY:o>c?"bottom":"top"}}function o(e){return"center"===e.getOriginX()&&"center"===e.getOriginY()}function r(e,t){var n=t.getPointByOrigin("center","center"),o=-t.getAngle(),r=i(n,e,o),a=r.originX,s=r.originY,l=t.getPointByOrigin(a,s),c=t.getLeft()-(n.x-l.x),u=t.getTop()-(n.x-l.y);t.set({originX:a,originY:s,left:c,top:u}),t.setCoords()}function a(e,t){var n=t.startPoint,o=-t.getAngle(),r=i(n,e,o),a=r.originX,s=r.originY;t.setPositionByOrigin(n,a,s)}function s(e){var t=e.type,n=e.scaleX,i=e.scaleY,o=u[t],r=e[o.w]*n,a=e[o.h]*i;if(e.isRegular){var s=Math.max(n,i);r=e[o.w]*s,a=e[o.h]*s}var l={hasControls:!1,hasBorders:!1,scaleX:1,scaleY:1};l[o.w]=r,l[o.h]=a,e.set(l)}function l(e,t){var n=t.type,i=t.strokeWidth,o=t.startPoint,r=c[n],a=u[n],s=!("triangle"!==t.type),l={},d=Math.abs(o.x-e.x)/r,h=Math.abs(o.y-e.y)/r;d>i&&(d-=i/r),h>i&&(h-=i/r),t.isRegular&&(d=h=Math.max(d,h),s&&(h=Math.sqrt(3)/2*d)),l[a.w]=d,l[a.h]=h,t.set(l)}var c={rect:1,circle:2,triangle:1},u={rect:{w:"width",h:"height"},circle:{w:"rx",h:"ry"},triangle:{w:"width",h:"height"}};e.exports={setOrigins:function(e){var t=e.getPointByOrigin("left","top"),n=e.getPointByOrigin("right","top"),i=e.getPointByOrigin("right","bottom"),o=e.getPointByOrigin("left","bottom");e.origins={lt:t,rt:n,rb:i,lb:o}},resize:function(e,t,i){o(e)&&(r(t,e),n(e)),i?s(e,t):l(t,e),a(t,e)},adjustOriginToCenter:function(e){var t=e.getPointByOrigin("center","center"),n=e.getOriginX(),i=e.getOriginY(),o=e.getPointByOrigin(n,i),r=e.getLeft()+(t.x-o.x),a=e.getTop()+(t.y-o.y);e.set({hasControls:!0,hasBorders:!0,originX:"center",originY:"center",left:r,top:a}),e.setCoords()}}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var r=function(){function e(e,t){for(var n=0;n1?n-1:0),o=1;o1?n-1:0),o=1;on&&(i=t,t=n,n=i),r(t,o(e,n))},keyMirror:function(){for(var e={},t=arguments.length,n=Array(t),o=0;o1&&void 0!==arguments[1]?arguments[1]:"#7e7e7e",i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"up";o(this,e);var r=t.getAttribute("title");this._show=!1,this._colorpickerElement=t,this._toggleDirection=i,this._makePickerButtonElement(t,n),this._makePickerLayerElement(t,r),this._color=n,this.picker=c.default.create({container:this.pickerElement,preset:u,color:n}),this._addEvent(t)}return r(e,[{key:"_changeColorElement",value:function(e){e?(this.colorElement.classList.remove("transparent"),this.colorElement.style.backgroundColor=e):(this.colorElement.style.backgroundColor="#fff",this.colorElement.classList.add("transparent"))}},{key:"_makePickerButtonElement",value:function(e,t){e.classList.add("tui-image-editor-button"),this.colorElement=document.createElement("div"),this.colorElement.className="color-picker-value",t?this.colorElement.style.backgroundColor=t:this.colorElement.classList.add("transparent")}},{key:"_makePickerLayerElement",value:function(e,t){var n=document.createElement("label"),i=document.createElement("div");this.pickerControl=document.createElement("div"),this.pickerControl.className="color-picker-control",this.pickerElement=document.createElement("div"),this.pickerElement.className="color-picker",n.innerHTML=t,i.className="triangle",this.pickerControl.appendChild(this.pickerElement),this.pickerControl.appendChild(i),e.appendChild(this.pickerControl),e.appendChild(this.colorElement),e.appendChild(n)}},{key:"_addEvent",value:function(e){var t=this;this.picker.on("selectColor",function(e){t._changeColorElement(e.color),t._color=e.color,t.fire("change",e.color)}),e.addEventListener("click",function(e){t._show=!t._show,t.pickerControl.style.display=t._show?"block":"none",t._setPickerControlPosition(),t.fire("changeShow",t),e.stopPropagation()}),document.body.addEventListener("click",function(){t.hide()})}},{key:"hide",value:function(){this._show=!1,this.pickerControl.style.display="none"}},{key:"_setPickerControlPosition",value:function(){var e=this.pickerControl.style,t=this._colorpickerElement.clientWidth/2+2,n=this.pickerControl.offsetWidth/2-t,i=(this.pickerControl.offsetHeight+10)*-1;"down"===this._toggleDirection&&(i=30),e.top=i+"px",e.left="-"+n+"px"}},{key:"color",get:function(){return this._color},set:function(e){this._color=e,this._changeColorElement(e)}}]),e}();s.default.CustomEvents.mixin(d),t.default=d},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var r=function(){function e(e,t){for(var n=0;n1&&void 0!==arguments[1]?arguments[1]:{};o(this,e),this._value=n.value||0,this.rangeElement=t,this._drawRangeElement(),this.rangeWidth=(0,l.toInteger)(window.getComputedStyle(t,null).width)-12,this._min=n.min||0,this._max=n.max||100,this._absMax=this._min*-1+this._max,this.realTimeEvent=n.realTimeEvent||!1,this._addClickEvent(),this._addDragEvent(),this.value=n.value,this.trigger("change")}return r(e,[{key:"trigger",value:function(e){this.fire(e,this._value)}},{key:"_drawRangeElement",value:function(){this.rangeElement.classList.add("tui-image-editor-range"),this.bar=document.createElement("div"),this.bar.className="tui-image-editor-virtual-range-bar",this.subbar=document.createElement("div"),this.subbar.className="tui-image-editor-virtual-range-subbar",this.pointer=document.createElement("div"),this.pointer.className="tui-image-editor-virtual-range-pointer",this.bar.appendChild(this.subbar),this.bar.appendChild(this.pointer),this.rangeElement.appendChild(this.bar)}},{key:"_addClickEvent",value:function(){var e=this;this.rangeElement.addEventListener("click",function(t){if(t.stopPropagation(),"tui-image-editor-range"===t.target.className){var n=t.offsetX,i=n/e.rangeWidth,o=e._absMax*i+e._min;e.pointer.style.left=i*e.rangeWidth+"px",e.subbar.style.right=(1-i)*e.rangeWidth+"px",e._value=o,e.fire("change",o)}})}},{key:"_addDragEvent",value:function(){var e=this;this.pointer.addEventListener("mousedown",function(t){e.firstPosition=t.screenX,e.firstLeft=(0,l.toInteger)(e.pointer.style.left)||0,e.dragEventHandler={changeAngle:e._changeAngle.bind(e),stopChangingAngle:e._stopChangingAngle.bind(e)},document.addEventListener("mousemove",e.dragEventHandler.changeAngle),document.addEventListener("mouseup",e.dragEventHandler.stopChangingAngle)})}},{key:"_changeAngle",value:function(e){var t=e.screenX,n=t-this.firstPosition,i=this.firstLeft+n;i=i>this.rangeWidth?this.rangeWidth:i,i=i<0?0:i,this.pointer.style.left=i+"px",this.subbar.style.right=this.rangeWidth-i+"px";var o=i/this.rangeWidth,r=this._absMax*o+this._min;this._value=r,this.realTimeEvent&&this.fire("change",r)}},{key:"_stopChangingAngle",value:function(){this.fire("change",this._value),document.removeEventListener("mousemove",this.dragEventHandler.changeAngle),document.removeEventListener("mouseup",this.dragEventHandler.stopChangingAngle)}},{key:"max",set:function(e){this._max=e,this._absMax=this._min*-1+this._max,this.value=this._value},get:function(){return this._max}},{key:"value",get:function(){return this._value},set:function(e){var t=e-this._min,n=t*this.rangeWidth/this._absMax;this.rangeWidth0?i:n)(e)}},function(e,t,n){var i=n(122),o=n(25);e.exports=function(e){return i(o(e))}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(3),r=i(o),a=n(5),s=(0,a.keyMirror)("UN_IMPLEMENTATION","NO_COMPONENT_NAME"),l={UN_IMPLEMENTATION:"Should implement a method: ",NO_COMPONENT_NAME:"Should set a component name"},c={UN_IMPLEMENTATION:function(e){return l.UN_IMPLEMENTATION+e},NO_COMPONENT_NAME:function(){return l.NO_COMPONENT_NAME}};e.exports={types:r.default.extend({},s),create:function(e){e=e.toLowerCase();for(var t=c[e],n=arguments.length,i=Array(n>1?n-1:0),o=1;on;)t.push(arguments[n++]);return v[++g]=function(){s("function"==typeof e?e:Function(e),t)},i(g),g},f=function(e){delete v[e]},"process"==n(19)(d)?i=function(e){d.nextTick(a(b,e,1))}:p?(o=new p,r=o.port2,o.port1.onmessage=y,i=a(r.postMessage,r,1)):u.addEventListener&&"function"==typeof postMessage&&!u.importScripts?(i=function(e){u.postMessage(e+"","*")},u.addEventListener("message",y,!1)):i=m in c("script")?function(e){l.appendChild(c("script"))[m]=function(){l.removeChild(this),b.call(e)}}:function(e){setTimeout(a(b,e,1),0)}),e.exports={set:h,clear:f}},function(e,t,n){var i=n(29),o=Math.min;e.exports=function(e){return e>0?o(i(e),9007199254740991):0}},function(e,t){var n=0,i=Math.random();e.exports=function(e){return"Symbol(".concat(void 0===e?"":e,")_",(++n+i).toString(36))}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0});var o=n(3),r=n(5),a=i(r),s=n(86),l=i(s);t.default={getActions:function(){return{main:this._mainAction(),shape:this._shapeAction(),crop:this._cropAction(),flip:this._flipAction(),rotate:this._rotateAction(),text:this._textAction(),mask:this._maskAction(),draw:this._drawAction(),icon:this._iconAction(),filter:this._filterAction()}},_mainAction:function(){var e=this,t=function(){"crop"===e.ui.submenu&&(e.stopDrawingMode(),e.ui.changeMenu("crop"))};return(0,o.extend)({initLoadImage:function(n,i){return e.loadImageFromURL(n,i).then(function(i){t(),e.ui.initializeImgUrl=n,e.ui.resizeEditor({imageSize:i}),e.clearUndoStack()})},undo:function(){e.isEmptyUndoStack()||(t(),e.undo())},redo:function(){e.isEmptyRedoStack()||(t(),e.redo())},reset:function(){t(),e.loadImageFromURL(e.ui.initializeImgUrl,"resetImage").then(function(n){t(),e.ui.resizeEditor({imageSize:n}),e.clearUndoStack()})},delete:function(){e.ui.changeDeleteButtonEnabled(!1),t(),e.removeActiveObject(),e.activeObjectId=null},deleteAll:function(){t(),e.clearObjects(),e.ui.changeDeleteButtonEnabled(!1),e.ui.changeDeleteAllButtonEnabled(!1)},load:function(n){a.default.isSupportFileApi()||alert("This browser does not support file-api"),e.ui.initializeImgUrl=URL.createObjectURL(n),e.loadImageFromFile(n).then(function(){t(),e.clearUndoStack(),e.ui.resizeEditor()}).catch(function(e){return Promise.reject(e)})},download:function(){var t=e.toDataURL(),n=e.getImageName(),i=void 0,o=void 0,r=void 0;a.default.isSupportFileApi()&&window.saveAs?(i=a.default.base64ToBlob(t),o=i.type.split("/")[1],n.split(".").pop()!==o&&(n+="."+o),saveAs(i,n)):(r=window.open(),r.document.body.innerHTML="")}},this._commonAction())},_iconAction:function(){var e=this,t=void 0,n=void 0,i=void 0,r=void 0,a=void 0,s=void 0,c=void 0;this.on({iconCreateResize:function(t){var n=t.moveOriginPointer,o=(n.x-i)/a,l=(n.y-r)/s;e.setObjectPropertiesQuietly(c,{scaleX:Math.abs(2*o),scaleY:Math.abs(2*l)})},iconCreateEnd:function(){e.ui.icon.clearIconType(),e.changeSelectableAll(!0)}});var u=function(o,l){i=l.x,r=l.y,e.addIcon(t,{left:l.x,top:l.y,fill:n}).then(function(e){c=e.id,a=e.width,s=e.height})};return(0,o.extend)({changeColor:function(t){e.activeObjectId&&e.changeIconColor(e.activeObjectId,t)},addIcon:function(i,o){t=i,n=o,e.changeCursor("crosshair"),e.off("mousedown"),e.once("mousedown",u.bind(e))},cancelAddIcon:function(){e.off("mousedown"),e.ui.icon.clearIconType(),e.changeSelectableAll(!0),e.changeCursor("default")},registDefalutIcons:function(t,n){var i={};i[t]=n,e.registerIcons(i)},registCustomIcon:function(t,n){var i=new l.default;i.imageToSVG(t,function(t){var i=t.match(/path[^>]*d="([^"]*)"/),o=i[1],r={};r[n.name]=o,e.registerIcons(r),e.addIcon(n.name,{left:100,top:100})},l.default.tracerDefaultOption())}},this._commonAction())},_drawAction:function(){var e=this;return(0,o.extend)({setDrawMode:function(t,n){e.stopDrawingMode(),"free"===t?e.startDrawingMode("FREE_DRAWING",n):e.startDrawingMode("LINE_DRAWING",n)},setColor:function(t){e.setBrush({color:t})}},this._commonAction())},_maskAction:function(){var e=this;return(0,o.extend)({loadImageFromURL:function(t,n){return e.loadImageFromURL(e.toDataURL(),"FilterImage").then(function(){e.addImageObject(t).then(function(){URL.revokeObjectURL(n)})})},applyFilter:function(){e.applyFilter("mask",{maskObjId:e.activeObjectId})}},this._commonAction())},_textAction:function(){var e=this;return(0,o.extend)({changeTextStyle:function(t){e.activeObjectId&&e.changeTextStyle(e.activeObjectId,t)}},this._commonAction())},_rotateAction:function(){var e=this;return(0,o.extend)({rotate:function(t){e.rotate(t),e.ui.resizeEditor()},setAngle:function(t){e.setAngle(t),e.ui.resizeEditor()}},this._commonAction())},_shapeAction:function(){var e=this;return(0,o.extend)({changeShape:function(t){e.activeObjectId&&e.changeShape(e.activeObjectId,t)},setDrawingShape:function(t){e.setDrawingShape(t)}},this._commonAction())},_cropAction:function(){var e=this;return(0,o.extend)({crop:function(){var t=e.getCropzoneRect();t&&e.crop(t).then(function(){e.stopDrawingMode(),e.ui.resizeEditor(),e.ui.changeMenu("crop")}).catch(function(e){return Promise.reject(e)})},cancel:function(){e.stopDrawingMode(),e.ui.changeMenu("crop")}},this._commonAction())},_flipAction:function(){var e=this;return(0,o.extend)({flip:function(t){return e[t]()}},this._commonAction())},_filterAction:function(){var e=this;return(0,o.extend)({applyFilter:function(t,n,i){t?e.applyFilter(n,i):e.hasFilter(n)&&e.removeFilter(n)}},this._commonAction())},setReAction:function(){var e=this;this.on({undoStackChanged:function(t){t?(e.ui.changeUndoButtonStatus(!0),e.ui.changeResetButtonStatus(!0)):(e.ui.changeUndoButtonStatus(!1),e.ui.changeResetButtonStatus(!1)),e.ui.resizeEditor()},redoStackChanged:function(t){t?e.ui.changeRedoButtonStatus(!0):e.ui.changeRedoButtonStatus(!1),e.ui.resizeEditor()},objectActivated:function(t){e.activeObjectId=t.id,e.ui.changeDeleteButtonEnabled(!0),e.ui.changeDeleteAllButtonEnabled(!0),"cropzone"===t.type?e.ui.crop.changeApplyButtonStatus(!0):["rect","circle","triangle"].indexOf(t.type)>-1?(e.stopDrawingMode(),"shape"!==e.ui.submenu&&e.ui.changeMenu("shape",!1,!1),e.ui.shape.setShapeStatus({strokeColor:t.stroke,strokeWidth:t.strokeWidth,fillColor:t.fill}),e.ui.shape.setMaxStrokeValue(Math.min(t.width,t.height))):"path"===t.type||"line"===t.type?"draw"!==e.ui.submenu&&(e.ui.changeMenu("draw",!1,!1),e.ui.draw.changeStandbyMode()):["i-text","text"].indexOf(t.type)>-1?"text"!==e.ui.submenu&&e.ui.changeMenu("text",!1,!1):"icon"===t.type&&(e.stopDrawingMode(),"icon"!==e.ui.submenu&&e.ui.changeMenu("icon",!1,!1),e.ui.icon.setIconPickerColor(t.fill))},addText:function(t){e.addText("Double Click",{position:t.originPosition,styles:{fill:e.ui.text.textColor,fontSize:a.default.toInteger(e.ui.text.fontSize),fontFamily:"Noto Sans"}}).then(function(){e.changeCursor("default")})},addObjectAfter:function(t){["rect","circle","triangle"].indexOf(t.type)>-1&&(e.ui.shape.setMaxStrokeValue(Math.min(t.width,t.height)),e.ui.shape.changeStandbyMode())},objectScaled:function(t){if(["i-text","text"].indexOf(t.type)>-1)e.ui.text.fontSize=a.default.toInteger(t.fontSize);else if(["rect","circle","triangle"].indexOf(t.type)>=0){var n=t.width,i=t.height,o=e.ui.shape.getStrokeValue();nv&&(r.remove(),r.set(this._calcRectDimensionFromPoint(i,o)),t.add(r))}},{key:"_calcRectDimensionFromPoint",value:function(e,t){var n=this.getCanvas(),i=n.getWidth(),o=n.getHeight(),r=this._startX,a=this._startY,s=(0,g.clamp)(e,0,r),l=(0,g.clamp)(t,0,a),c=(0,g.clamp)(e,r,i)-s,u=(0,g.clamp)(t,a,o)-l;return this._withShiftKey&&(c>u?u=c:u>c&&(c=u),r>=e&&(s=r-c),a>=t&&(l=a-u)),{left:s,top:l,width:c,height:u}}},{key:"_onFabricMouseUp",value:function(){var e=this._cropzone,t=this._listeners,n=this.getCanvas();n.setActiveObject(e),n.off({"mouse:move":t.mousemove,"mouse:up":t.mouseup})}},{key:"getCroppedImageData",value:function(e){var t=this.getCanvas(),n=t.contains(this._cropzone);if(!e)return null;n&&this._cropzone.remove();var i={imageName:this.getImageName(),url:t.toDataURL(e)};return n&&t.add(this._cropzone),i}},{key:"getCropzoneRect",value:function(){var e=this._cropzone;return e.isValid()?{left:e.getLeft(),top:e.getTop(),width:e.getWidth(),height:e.getHeight()}:null}},{key:"_onKeyDown",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!0)}},{key:"_onKeyUp",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!1)}}]),t}(d.default);e.exports=m},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;n=0,c=n.useDragAddIcon&&l,u=a?n._createIcon(a):null;u||o(y.invalidParameters),u.set(d.default.extend({type:"icon",fill:n._oColor},s,t,n.graphics.controlStyle)),r.add(u).setActiveObject(u),c&&n._addWithDragEvent(r),i(n.graphics.createObjectProperties(u))})}},{key:"_addWithDragEvent",value:function(e){var t=this;e.on({"mouse:move":function(n){e.selection=!1,t.fire(b.ICON_CREATE_RESIZE,{moveOriginPointer:e.getPointer(n.e)})},"mouse:up":function(n){t.fire(b.ICON_CREATE_END,{moveOriginPointer:e.getPointer(n.e)}),e.defaultCursor="default",e.off("mouse:up"),e.off("mouse:move"),e.selection=!0}})}},{key:"registerPaths",value:function(e){var t=this;d.default.forEach(e,function(e,n){t._pathMap[n]=e},this)}},{key:"setColor",value:function(e,t){this._oColor=e,t&&"icon"===t.get("type")&&(t.setFill(this._oColor),this.getCanvas().renderAll())}},{key:"getColor",value:function(e){return e.fill}},{key:"_createIcon",value:function(e){return new c.default.Path(e)}}]),t}(g.default);e.exports=k},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;nn},_getColor:function(e,t,n){var i=[0,0,0,0],o=e.data,r=e.width,a=4,s=(r*n+t)*a;return i[0]=o[s],i[1]=o[s+1],i[2]=o[s+2],i[3]=o[s+3],i}});e.exports=a},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(3),r=i(o),a=n(6),s=i(a),l=n(5),c="tl",u="tr",d="mt",h="ml",f="mr",p="mb",g="bl",v="br",m=s.default.util.createClass(s.default.Rect,{initialize:function(e,t){e=r.default.extend(e,t),e.type="cropzone",this.callSuper("initialize",e),this.options=e,this.on({moving:this._onMoving,scaling:this._onScaling})},_render:function(e){var t=7,n=7;this.callSuper("_render",e);var i=this.flipX?-1:1,o=this.flipY?-1:1,r=i/this.scaleX,a=o/this.scaleY;e.scale(r,a),this._fillOuterRect(e,"rgba(0, 0, 0, 0.55)"),this.options.lineWidth?(this._fillInnerRect(e),this._strokeBorder(e,"rgb(255, 255, 255)",{lineWidth:this.options.lineWidth})):(this._strokeBorder(e,"rgb(0, 0, 0)",{lineDashWidth:t}),this._strokeBorder(e,"rgb(255, 255, 255)",{lineDashWidth:t,lineDashOffset:n})),e.scale(1/r,1/a)},_fillOuterRect:function(e,t){var n=this._getCoordinates(e),i=n.x,o=n.y;e.save(),e.fillStyle=t,e.beginPath(),e.moveTo(i[0]-1,o[0]-1),e.lineTo(i[3]+1,o[0]-1),e.lineTo(i[3]+1,o[3]+1),e.lineTo(i[0]-1,o[3]+1),e.lineTo(i[0]-1,o[0]-1),e.closePath(),e.moveTo(i[1],o[1]),e.lineTo(i[1],o[2]),e.lineTo(i[2],o[2]),e.lineTo(i[2],o[1]),e.lineTo(i[1],o[1]),e.closePath(),e.fill(),e.restore()},_fillInnerRect:function(e){var t=this._getCoordinates(e),n=t.x,i=t.y,o=this._caculateInnerPosition(n,(n[2]-n[1])/3),r=this._caculateInnerPosition(i,(i[2]-i[1])/3);e.save(),e.strokeStyle="rgba(255, 255, 255, 0.7)",e.lineWidth=this.options.lineWidth,e.beginPath(),e.moveTo(o[0],r[1]),e.lineTo(o[3],r[1]),e.moveTo(o[0],r[2]),e.lineTo(o[3],r[2]),e.moveTo(o[1],r[0]),e.lineTo(o[1],r[3]),e.moveTo(o[2],r[0]),e.lineTo(o[2],r[3]),e.stroke(),e.closePath(),e.restore()},_caculateInnerPosition:function(e,t){var n=[];return n[0]=e[1],n[1]=e[1]+t,n[2]=e[1]+2*t,n[3]=e[2],n},_getCoordinates:function(e){var t=this.getWidth(),n=this.getHeight(),i=t/2,o=n/2,a=this.getLeft(),s=this.getTop(),l=e.canvas;return{x:r.default.map([-(i+a),-i,i,i+(l.width-a-t)],Math.ceil),y:r.default.map([-(o+s),-o,o,o+(l.height-s-n)],Math.ceil)}},_strokeBorder:function(e,t,n){var i=n.lineDashWidth,o=n.lineDashOffset,r=n.lineWidth,a=this.getWidth()/2,s=this.getHeight()/2;e.save(),e.strokeStyle=t,e.setLineDash&&e.setLineDash([i,i]),o&&(e.lineDashOffset=o),r&&(e.lineWidth=r),e.beginPath(),e.moveTo(-a,-s),e.lineTo(a,-s),e.lineTo(a,s),e.lineTo(-a,s),e.lineTo(-a,-s),e.stroke(),e.restore()},_onMoving:function(){var e=this.getLeft(),t=this.getTop(),n=this.getWidth(),i=this.getHeight(),o=this.canvas.getWidth()-n,r=this.canvas.getHeight()-i;this.setLeft((0,l.clamp)(e,0,o)),this.setTop((0,l.clamp)(t,0,r))},_onScaling:function(e){var t=this.canvas.getPointer(e.e),n=this._calcScalingSizeFromPointer(t);this.scale(1).set(n)},_calcScalingSizeFromPointer:function(e){var t=e.x,n=e.y,i=this._calcTopLeftScalingSizeFromPointer(t,n),o=this._calcBottomRightScalingSizeFromPointer(t,n);return this._makeScalingSettings(i,o)},_calcTopLeftScalingSizeFromPointer:function(e,t){var n=this.getHeight()+this.top,i=this.getWidth()+this.left,o=(0,l.clamp)(t,0,n-1),r=(0,l.clamp)(e,0,i-1);return{top:o,left:r,width:i-r,height:n-o}},_calcBottomRightScalingSizeFromPointer:function(e,t){var n=this.canvas,i=n.width,o=n.height,r=this.left,a=this.top;return{width:(0,l.clamp)(e,r+1,i)-r,height:(0,l.clamp)(t,a+1,o)-a}},_makeScalingSettings:function(e,t){var n=e.width,i=e.height,o=t.height,r=t.width,a=e.left,s=e.top,l=void 0;switch(this.__corner){case c:l=e;break;case u:l={width:r,height:i,top:s};break;case g:l={width:n,height:o,left:a};break;case v:l=t;break;case h:l={width:n,left:a};break;case d:l={height:i,top:s};break;case f:l={width:r};break;case p:l={height:o}}return l},isValid:function(){return this.left>=0&&this.top>=0&&this.width>0&&this.height>0}});e.exports=m},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(6),r=i(o),a=r.default.util.createClass(r.default.Image.filters.Convolute,{type:"Emboss",initialize:function(){var e=[1,1,1,1,.7,-1,-1,-1,-1];this.matrix=e}});e.exports=a},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(6),r=i(o),a=r.default.util.createClass(r.default.Image.filters.Mask,{applyTo:function(e){if(this.mask){var t=e.width,n=e.height,i=this._createCanvasOfMask(t,n),o=e.getContext("2d"),r=i.getContext("2d"),a=o.getImageData(0,0,t,n);this._drawMask(r,e,o),this._mapData(r,a,t,n),o.putImageData(a,0,0)}},_createCanvasOfMask:function(e,t){var n=r.default.util.createCanvasElement();return n.width=e,n.height=t,n},_drawMask:function(e){var t=this.mask,n=t.getElement(),i=t.getLeft(),o=t.getTop(),r=t.getAngle();e.save(),e.translate(i,o),e.rotate(r*Math.PI/180),e.scale(t.scaleX,t.scaleY),e.drawImage(n,-n.width/2,-n.height/2),e.restore()},_mapData:function(e,t,n,i){for(var o=t.data,r=e.getImageData(0,0,n,i).data,a=this.channel,s=t.width*t.height*4,l=0;l1&&void 0!==arguments[1]?arguments[1]:{},i=n.cssMaxWidth,r=n.cssMaxHeight,a=n.useItext,s=void 0!==a&&a,l=n.useDragAddIcon,c=void 0!==l&&l;o(this,e),this.canvasImage=null,this.cssMaxWidth=i||ie,this.cssMaxHeight=r||oe,this.useItext=s,this.useDragAddIcon=c,this.cropSelectionStyle={},this.imageName="",this._objects={},this._canvas=null,this._drawingMode=q.NORMAL,this._drawingModeMap={},this._componentMap={},this._handler={onMouseDown:this._onMouseDown.bind(this),onObjectAdded:this._onObjectAdded.bind(this),onObjectRemoved:this._onObjectRemoved.bind(this),onObjectMoved:this._onObjectMoved.bind(this),onObjectScaled:this._onObjectScaled.bind(this),onObjectSelected:this._onObjectSelected.bind(this),onPathCreated:this._onPathCreated.bind(this),onSelectionCleared:this._onSelectionCleared.bind(this),onSelectionCreated:this._onSelectionCreated.bind(this)},this._setCanvasElement(t),this._createDrawingModeInstances(),this._createComponents(),this._attachCanvasEvents()}return r(e,[{key:"destroy",value:function(){var e=this._canvas.wrapperEl;this._canvas.clear(),e.parentNode.removeChild(e)}},{key:"deactivateAll",value:function(){return this._canvas.deactivateAll(),this}},{key:"renderAll",value:function(){return this._canvas.renderAll(),this}},{key:"add",value:function(e){var t,n=[];$(e)?n=e:n.push(e),(t=this._canvas).add.apply(t,n)}},{key:"contains",value:function(e){return this._canvas.contains(e)}},{key:"getObjects",value:function(){return this._canvas.getObjects().slice()}},{key:"getObject",value:function(e){return this._objects[e]}},{key:"remove",value:function(e){this._canvas.remove(e)}},{key:"removeAll",value:function(e){var t=this._canvas,n=t.getObjects().slice();return t.remove.apply(t,this._canvas.getObjects()),e&&t.clear(),n}},{key:"removeObjectById",value:function(e){var t=[],n=this._canvas,i=this.getObject(e),o=i&&i.isType("group")&&!i.isEmpty();return o?(n.discardActiveGroup(),i.forEachObject(function(e){t.push(e),e.remove()})):n.contains(i)&&(t.push(i),i.remove()),t}},{key:"getObjectId",value:function(e){var t=null;for(t in this._objects)if(this._objects.hasOwnProperty(t)&&e===this._objects[t])return t;return null}},{key:"getActiveObject",value:function(){return this._canvas.getActiveObject()}},{key:"getActiveGroupObject",value:function(){return this._canvas.getActiveGroup()}},{key:"setActiveObject",value:function(e){this._canvas.setActiveObject(e)}},{key:"setCropSelectionStyle",value:function(e){this.cropSelectionStyle=e}},{key:"getComponent",value:function(e){return this._componentMap[e]}},{key:"getDrawingMode",value:function(){return this._drawingMode}},{key:"startDrawingMode",value:function(e,t){if(this._isSameDrawingMode(e))return!0;this.stopDrawingMode();var n=this._getDrawingModeInstance(e);return n&&n.start&&(n.start(this,t),this._drawingMode=e),!!n}},{key:"stopDrawingMode",value:function(){if(!this._isSameDrawingMode(q.NORMAL)){var e=this._getDrawingModeInstance(this.getDrawingMode());e&&e.end&&e.end(this),this._drawingMode=q.NORMAL}}},{key:"toDataURL",value:function(e){return this._canvas&&this._canvas.toDataURL(e)}},{key:"setCanvasImage",value:function(e,t){t&&Z(t),this.imageName=e,this.canvasImage=t}},{key:"setCssMaxDimension",value:function(e){this.cssMaxWidth=e.width||this.cssMaxWidth,this.cssMaxHeight=e.height||this.cssMaxHeight}},{key:"adjustCanvasDimension",value:function(){var e=this.canvasImage.scale(1),t=e.getBoundingRect(),n=t.width,i=t.height,o=this._calcMaxDimension(n,i);this.setCanvasCssDimension({width:"100%",height:"100%","max-width":o.width+"px","max-height":o.height+"px"}),this.setCanvasBackstoreDimension({width:n,height:i}),this._canvas.centerObject(e)}},{key:"setCanvasCssDimension",value:function(e){this._canvas.setDimensions(e,re)}},{key:"setCanvasBackstoreDimension",value:function(e){this._canvas.setDimensions(e,ae)}},{key:"setImageProperties",value:function(e,t){var n=this.canvasImage;n&&(n.set(e).setCoords(),t&&this._canvas.renderAll())}},{key:"getCanvasElement",value:function(){return this._canvas.getElement()}},{key:"getCanvas",value:function(){return this._canvas}},{key:"getCanvasImage",value:function(){return this.canvasImage}},{key:"getImageName",value:function(){return this.imageName}},{key:"addImageObject",value:function(e){var t=this,n=this._callbackAfterLoadingImageObject.bind(this);return new c.default(function(i){d.default.Image.fromURL(e,function(e){n(e),i(t.createObjectProperties(e))},{crossOrigin:"Anonymous"})})}},{key:"getCenter",value:function(){return this._canvas.getCenter()}},{key:"getCropzoneRect",value:function(){return this.getComponent(G.CROPPER).getCropzoneRect()}},{key:"getCroppedImageData",value:function(e){return this.getComponent(G.CROPPER).getCroppedImageData(e)}},{key:"setBrush",value:function(e){var t=this._drawingMode,n=G.FREE_DRAWING;t===q.LINE&&(n=q.LINE),this.getComponent(n).setBrush(e)}},{key:"setDrawingShape",value:function(e,t){this.getComponent(G.SHAPE).setStates(e,t)}},{key:"registerPaths",value:function(e){this.getComponent(G.ICON).registerPaths(e)}},{key:"changeCursor",value:function(e){var t=this.getCanvas();t.defaultCursor=e,t.renderAll()}},{key:"hasFilter",value:function(e){return this.getComponent(G.FILTER).hasFilter(e)}},{key:"setSelectionStyle",value:function(e){J(K.SELECTION_STYLE,e)}},{key:"setObjectProperties",value:function(e,t){var n=this.getObject(e),i=J({},t);return n.set(i),n.setCoords(),this.getCanvas().renderAll(),i}},{key:"getObjectProperties",value:function(e,t){var n=this.getObject(e),i={};return Q(t)?i[t]=n[t]:$(t)?ee(t,function(e){i[e]=n[e]}):te(t,function(e,t){i[t]=n[t]}),i}},{key:"getObjectPosition",value:function(e,t,n){var i=this.getObject(e);return i?i.getPointByOrigin(t,n):null}},{key:"setObjectPosition",value:function(e,t){var n=this.getObject(e),i=t.x,o=t.y,r=t.originX,a=t.originY;if(!n)return!1;var s=n.getPointByOrigin(r,a),l=n.getPointByOrigin("center","center"),c=l.x-s.x,u=l.y-s.y;return n.set({left:i+c,top:o+u}),n.setCoords(),!0}},{key:"getCanvasSize",value:function(){var e=this.getCanvasImage();return{width:e?e.width:0,height:e?e.height:0}}},{key:"_getDrawingModeInstance",value:function(e){return this._drawingModeMap[e]}},{key:"_setCanvasElement",value:function(e){var t=void 0,n=void 0;t=e.jquery?e[0]:e.nodeType?e:document.querySelector(e),"CANVAS"!==t.nodeName.toUpperCase()&&(n=document.createElement("canvas"),t.appendChild(n)),this._canvas=new d.default.Canvas(n,{containerClass:"tui-image-editor-canvas-container",enableRetinaScaling:!1})}},{key:"_createDrawingModeInstances",value:function(){this._register(this._drawingModeMap,new D.default),this._register(this._drawingModeMap,new R.default),this._register(this._drawingModeMap,new N.default),this._register(this._drawingModeMap,new F.default),this._register(this._drawingModeMap,new z.default)}},{key:"_createComponents",value:function(){this._register(this._componentMap,new f.default(this)),this._register(this._componentMap,new g.default(this)),this._register(this._componentMap,new m.default(this)),this._register(this._componentMap,new y.default(this)),this._register(this._componentMap,new k.default(this)),this._register(this._componentMap,new x.default(this)),this._register(this._componentMap,new C.default(this)),this._register(this._componentMap,new S.default(this)),this._register(this._componentMap,new j.default(this)),this._register(this._componentMap,new P.default(this))}},{key:"_register",value:function(e,t){e[t.getName()]=t}},{key:"_isSameDrawingMode",value:function(e){return this.getDrawingMode()===e}},{key:"_calcMaxDimension",value:function(e,t){var n=this.cssMaxWidth/e,i=this.cssMaxHeight/t,o=Math.min(e,this.cssMaxWidth),r=Math.min(t,this.cssMaxHeight); +return n<1&&n-1&&J(n,this._createTextProperties(e,n)),n}},{key:"_createTextProperties",value:function(e){var t=["text","fontFamily","fontSize","fontStyle","textAlign","textDecoration"],n={};return J(n,X.default.getProperties(e,t)),n}},{key:"_addFabricObject",value:function(e){var t=Z(e);return this._objects[t]=e,t}},{key:"_removeFabricObject",value:function(e){delete this._objects[e]}}]),e}();ne.mixin(se),e.exports=se},function(e,t){"use strict";function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n0&&(e=this.blur(e,t.blurradius,t.blurdelta)),h=0;h0)for(d=0;d0&&(f[d]={r:Math.floor(s[d].r/s[d].n),g:Math.floor(s[d].g/s[d].n),b:Math.floor(s[d].b/s[d].n),a:Math.floor(s[d].a/s[d].n)}),s[d].n/ln[i].boundingbox[2]&&(n[i].boundingbox[2]=r-1),a-1n[i].boundingbox[3]&&(n[i].boundingbox[3]=a-1),h=this.pathscan_combined_lookup[e[a][r]][c],e[a][r]=h[0],c=h[1],r+=h[2],a+=h[3],r-1===n[i].points[0].x&&a-1===n[i].points[0].y)if(u=!0,n[i].points.lengtht[2]&&e[3]>t[3]}},{key:"batchpathscan",value:function(e,t){var n=[];for(var i in e)e.hasOwnProperty(i)&&(n[i]=this.pathscan(e[i],t));return n}},{key:"internodes",value:function(e,t){var n=[],i=0,o=0,r=0,a=0,s=0,l=void 0,c=void 0;for(l=0;l0&&(n[l].points[n[l].points.length-1].linesegment=this.getdirection(n[l].points[n[l].points.length-1].x,n[l].points[n[l].points.length-1].y,e[l].points[c].x,e[l].points[c].y)),n[l].points.push({x:e[l].points[c].x,y:e[l].points[c].y,linesegment:this.getdirection(e[l].points[c].x,e[l].points[c].y,(e[l].points[c].x+e[l].points[o].x)/2,(e[l].points[c].y+e[l].points[o].y)/2)})),n[l].points.push({x:(e[l].points[c].x+e[l].points[o].x)/2,y:(e[l].points[c].y+e[l].points[o].y)/2,linesegment:this.getdirection((e[l].points[c].x+e[l].points[o].x)/2,(e[l].points[c].y+e[l].points[o].y)/2,(e[l].points[o].x+e[l].points[r].x)/2,(e[l].points[o].y+e[l].points[r].y)/2)});return n}},{key:"testrightangle",value:function(e,t,n,i,o,r){return e.points[i].x===e.points[t].x&&e.points[i].x===e.points[n].x&&e.points[i].y===e.points[o].y&&e.points[i].y===e.points[r].y||e.points[i].y===e.points[t].y&&e.points[i].y===e.points[n].y&&e.points[i].x===e.points[o].x&&e.points[i].x===e.points[r].x}},{key:"getdirection",value:function(e,t,n,i){var o=8;return o=ei?7:0:e>n?ti?5:4:ti?6:8}},{key:"batchinternodes",value:function(e,t){var n=[];for(var i in e)e.hasOwnProperty(i)&&(n[i]=this.internodes(e[i],t));return n}},{key:"tracepath",value:function(e,t,n){var i=0,o=void 0,r=void 0,a=void 0,s={};for(s.segments=[],s.boundingbox=e.boundingbox,s.holechildren=e.holechildren,s.isholepath=e.isholepath;i0?a:e.points.length}return s}},{key:"fitseq",value:function(e,t,n,i,o){if(o>e.points.length||o<0)return[];var r=i,a=0,s=!0,l=void 0,c=void 0,u=void 0,d=o-i;d<0&&(d+=e.points.length);for(var h=(e.points[o].x-e.points[i].x)/d,f=(e.points[o].y-e.points[i].y)/d,p=(i+1)%e.points.length,g=void 0;p!=o;)g=p-i,g<0&&(g+=e.points.length),l=e.points[i].x+h*g,c=e.points[i].y+f*g,u=(e.points[p].x-l)*(e.points[p].x-l)+(e.points[p].y-c)*(e.points[p].y-c),u>t&&(s=!1),u>a&&(r=p,a=u),p=(p+1)%e.points.length;if(s)return[{type:"L",x1:e.points[i].x,y1:e.points[i].y,x2:e.points[o].x,y2:e.points[o].y}];var v=r;s=!0,a=0;var m=(v-i)/d,b=(1-m)*(1-m),y=2*(1-m)*m,_=m*m,k=(b*e.points[i].x+_*e.points[o].x-e.points[v].x)/-y,w=(b*e.points[i].y+_*e.points[o].y-e.points[v].y)/-y;for(p=i+1;p!=o;)m=(p-i)/d,b=(1-m)*(1-m),y=2*(1-m)*m,_=m*m,l=b*e.points[i].x+y*k+_*e.points[o].x,c=b*e.points[i].y+y*w+_*e.points[o].y,u=(e.points[p].x-l)*(e.points[p].x-l)+(e.points[p].y-c)*(e.points[p].y-c),u>n&&(s=!1),u>a&&(r=p,a=u),p=(p+1)%e.points.length;if(s)return[{type:"Q",x1:e.points[i].x,y1:e.points[i].y,x2:k,y2:w,x3:e.points[o].x,y3:e.points[o].y}];var x=v;return this.fitseq(e,t,n,i,x).concat(this.fitseq(e,t,n,x,o))}},{key:"batchtracepaths",value:function(e,t,n){var i=[];for(var o in e)e.hasOwnProperty(o)&&i.push(this.tracepath(e[o],t,n));return i}},{key:"batchtracelayers",value:function(e,t,n){var i=[];for(var o in e)e.hasOwnProperty(o)&&(i[o]=this.batchtracepaths(e[o],t,n));return i}},{key:"roundtodec",value:function(e,t){return Number(e.toFixed(t))}},{key:"svgpathstring",value:function(e,t,n,i){var o=e.layers[t],r=o[n],a="",s=void 0;if(i.linefilter&&r.segments.length<3)return a;if(a="=0;s--)a+=c.segments[s].type+" ",c.segments[s].hasOwnProperty("x3")&&(a+=c.segments[s].x2*i.scale+" "+c.segments[s].y2*i.scale+" "),a+=c.segments[s].x1*i.scale+" "+c.segments[s].y1*i.scale+" ";else for(a+=c.segments[c.segments.length-1].hasOwnProperty("x3")?"M "+this.roundtodec(c.segments[c.segments.length-1].x3*i.scale)+" "+this.roundtodec(c.segments[c.segments.length-1].y3*i.scale)+" ":"M "+this.roundtodec(c.segments[c.segments.length-1].x2*i.scale)+" "+this.roundtodec(c.segments[c.segments.length-1].y2*i.scale)+" ",s=c.segments.length-1;s>=0;s--)a+=c.segments[s].type+" ",c.segments[s].hasOwnProperty("x3")&&(a+=this.roundtodec(c.segments[s].x2*i.scale)+" "+this.roundtodec(c.segments[s].y2*i.scale)+" "),a+=this.roundtodec(c.segments[s].x1*i.scale)+" "+this.roundtodec(c.segments[s].y1*i.scale)+" ";a+="Z "}if(a+='" />',i.lcpr||i.qcpr){for(s=0;s',a+='',a+='',a+=''),!r.segments[s].hasOwnProperty("x3")&&i.lcpr&&(a+='');for(var l=0;l',a+='',a+='',a+=''),!c.segments[s].hasOwnProperty("x3")&&i.lcpr&&(a+='')}}return a}},{key:"getsvgstring",value:function(e,t){t=this.checkoptions(t);for(var n=e.width*t.scale,i=e.height*t.scale,o="',r=0;r5&&(t=5),n=Math.abs(n),n>1024&&(n=1024);var p=this.gks[t-1];for(o=0;o0&&i+r0&&o+rn&&(f.data[s]=e.data[s],f.data[s+1]=e.data[s+1],f.data[s+2]=e.data[s+2],f.data[s+3]=e.data[s+3]);return f}},{key:"loadImage",value:function(e,t,n){var i=new Image;n&&n.corsenabled&&(i.crossOrigin="Anonymous"),i.src=e,i.onload=function(){var e=document.createElement("canvas");e.width=i.width,e.height=i.height;var n=e.getContext("2d");n.drawImage(i,0,0),t(e)}}},{key:"getImgdata",value:function(e){var t=e.getContext("2d");return t.getImageData(0,0,e.width,e.height)}},{key:"drawLayers",value:function(e,t,n,i){n=n||1;var o=void 0,r=void 0,a=void 0,s=void 0,l=void 0,c=void 0;i?(c=document.getElementById(i),c||(c=document.createElement("div"),c.id=i,document.body.appendChild(c))):(c=document.createElement("div"),document.body.appendChild(c));for(l in e)if(e.hasOwnProperty(l)){o=e[l][0].length,r=e[l].length;var u=document.createElement("canvas");u.width=o*n,u.height=r*n;var d=u.getContext("2d");for(s=0;sl?"right":"left",originY:o>c?"bottom":"top"}}function o(e){return"center"===e.getOriginX()&&"center"===e.getOriginY()}function r(e,t){var n=t.getPointByOrigin("center","center"),o=-t.getAngle(),r=i(n,e,o),a=r.originX,s=r.originY,l=t.getPointByOrigin(a,s),c=t.getLeft()-(n.x-l.x),u=t.getTop()-(n.x-l.y);t.set({originX:a,originY:s,left:c,top:u}),t.setCoords()}function a(e,t){var n=t.startPoint,o=-t.getAngle(),r=i(n,e,o),a=r.originX,s=r.originY;t.setPositionByOrigin(n,a,s)}function s(e){var t=e.type,n=e.scaleX,i=e.scaleY,o=u[t],r=e[o.w]*n,a=e[o.h]*i;if(e.isRegular){var s=Math.max(n,i);r=e[o.w]*s,a=e[o.h]*s}var l={hasControls:!1,hasBorders:!1,scaleX:1,scaleY:1};l[o.w]=r,l[o.h]=a,e.set(l)}function l(e,t){var n=t.type,i=t.strokeWidth,o=t.startPoint,r=c[n],a=u[n],s=!("triangle"!==t.type),l={},d=Math.abs(o.x-e.x)/r,h=Math.abs(o.y-e.y)/r;d>i&&(d-=i/r),h>i&&(h-=i/r),t.isRegular&&(d=h=Math.max(d,h),s&&(h=Math.sqrt(3)/2*d)),l[a.w]=d,l[a.h]=h,t.set(l)}var c={rect:1,circle:2,triangle:1},u={rect:{w:"width",h:"height"},circle:{w:"rx",h:"ry"},triangle:{w:"width",h:"height"}};e.exports={setOrigins:function(e){var t=e.getPointByOrigin("left","top"),n=e.getPointByOrigin("right","top"),i=e.getPointByOrigin("right","bottom"),o=e.getPointByOrigin("left","bottom");e.origins={lt:t,rt:n,rb:i,lb:o}},resize:function(e,t,i){o(e)&&(r(t,e),n(e)),i?s(e,t):l(t,e),a(t,e)},adjustOriginToCenter:function(e){var t=e.getPointByOrigin("center","center"),n=e.getOriginX(),i=e.getOriginY(),o=e.getPointByOrigin(n,i),r=e.getLeft()+(t.x-o.x),a=e.getTop()+(t.y-o.y);e.set({hasControls:!0,hasBorders:!0,originX:"center",originY:"center",left:r,top:a}),e.setCoords()}}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var r=function(){function e(e,t){for(var n=0;n1?n-1:0),o=1;o0&&void 0!==arguments[0]?arguments[0]:{},t=e.uiSize,n=e.imageSize,i=void 0===n?this.imageSize:n;i!==this.imageSize&&(this.imageSize=i),t&&this._setUiSize(t);var o=this._getEditorDimension(),r=o.width,a=o.height,s=this._editorElement.style,l=this.options.menuBarPosition;s.height=a+"px",s.width=r+"px";var c=this._getEditorPosition(l),u=c.top,d=c.bottom,h=c.left,f=c.right;this._editorElementWrap.style.bottom=d+"px",this._editorElementWrap.style.top=u+"px",this._editorElementWrap.style.left=h+"px",this._editorElementWrap.style.width="calc(100% - "+f+"px)";var p=this._selectedElement.classList;"top"===l&&this._selectedElement.offsetWidth0&&void 0!==arguments[0]?arguments[0]:this.options.uiSize,t=this._selectedElement.style;t.width=e.width,t.height=e.height}},{key:"_makeSubMenu",value:function(){var e=this;s.default.forEach(this.options.menu,function(t){var n=D[t.replace(/^[a-z]/,function(e){return e.toUpperCase()})];e._makeMenuElement(t),e._els[t]=e._menuElement.querySelector("#tie-btn-"+t),e[t]=new n(e._subMenuElement,{iconStyle:e.theme.getStyle("submenu.icon"),menuBarPosition:e.options.menuBarPosition})})}},{key:"_makeUiElement",value:function(e){var t=void 0;window.snippet=s.default,t=e.jquery?e[0]:e.nodeType?e:document.querySelector(e);var n=c.default.getSelector(t);t.classList.add("tui-image-editor-container"),t.innerHTML=(0,f.default)({biImage:this.theme.getStyle("common.bi"),iconStyle:this.theme.getStyle("menu.icon"),loadButtonStyle:this.theme.getStyle("loadButton"),downloadButtonStyle:this.theme.getStyle("downloadButton")})+(0,d.default)({biImage:this.theme.getStyle("common.bi"),commonStyle:this.theme.getStyle("common"),headerStyle:this.theme.getStyle("header"),loadButtonStyle:this.theme.getStyle("loadButton"),downloadButtonStyle:this.theme.getStyle("downloadButton"),submenuStyle:this.theme.getStyle("submenu")}),this._selectedElement=t,this._selectedElement.classList.add(this.options.menuBarPosition),this._mainElement=n(".tui-image-editor-main"),this._editorElementWrap=n(".tui-image-editor-wrap"),this._editorElement=n(".tui-image-editor"),this._menuElement=n(".tui-image-editor-menu"),this._subMenuElement=n(".tui-image-editor-submenu")}},{key:"_makeMenuElement",value:function(e){var t=document.createElement("li"),n=this.theme.getStyle("menu.icon"),i=n.normal,o=n.active,r='\n \n \n \n \n ';t.id="tie-btn-"+e,t.className="tui-image-editor-item",t.title=e,t.innerHTML=r,this._menuElement.appendChild(t)}},{key:"_addHelpActionEvent",value:function(e){var t=this;this._els[e].addEventListener("click",function(){t._actions.main[e]()})}},{key:"_addDownloadEvent",value:function(){var e=this;s.default.forEach(this._els.download,function(t){t.addEventListener("click",function(){e._actions.main.download()})})}},{key:"_addLoadEvent",value:function(){var e=this;s.default.forEach(this._els.load,function(t){t.addEventListener("change",function(t){e._actions.main.load(t.target.files[0])})})}},{key:"_addMenuEvent",value:function(e){var t=this;this._els[e].addEventListener("click",function(){t.changeMenu(e)})}},{key:"_addSubMenuEvent",value:function(e){this[e].addEvent(this._actions[e])}},{key:"getEditorArea",value:function(){return this._editorElement}},{key:"initCanvas",value:function(){var e=this,t=this._getLoadImage();t&&this._actions.main.initLoadImage(t.path,t.name).then(function(){e._addHelpActionEvent("undo"),e._addHelpActionEvent("redo"),e._addHelpActionEvent("reset"),e._addHelpActionEvent("delete"),e._addHelpActionEvent("deleteAll"),e._addDownloadEvent(),e._addLoadEvent(),s.default.forEach(e.options.menu,function(t){e._addMenuEvent(t),e._addSubMenuEvent(t)}),e._initMenu()});var n=document.createElement("div");n.className="tui-image-editor-grid-visual";var i='\n \n \n \n
    ';n.innerHTML=i,this._editorContainerElement=this._editorElement.querySelector(".tui-image-editor-canvas-container"),this._editorContainerElement.appendChild(n)}},{key:"_getLoadImage",value:function(){return this.options.loadImage}},{key:"changeMenu",value:function(e){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],n=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];this._submenuChangeTransection||(this._submenuChangeTransection=!0,this._changeMenu(e,t,n),this._submenuChangeTransection=!1)}},{key:"_changeMenu",value:function(e,t,n){this.submenu&&(this._els[this.submenu].classList.remove("active"),this._mainElement.classList.remove("tui-image-editor-menu-"+this.submenu),n&&this._actions.main.discardSelection(),this._actions.main.changeSelectableAll(!0),this[this.submenu].changeStandbyMode()),this.submenu===e&&t?this.submenu=null:(this._els[e].classList.add("active"),this._mainElement.classList.add("tui-image-editor-menu-"+e),this.submenu=e,this[this.submenu].changeStartMode()),this.resizeEditor()}},{key:"_initMenu",value:function(){if(this.options.initMenu){var e=document.createEvent("MouseEvents");e.initEvent("click",!0,!1),this._els[this.options.initMenu].dispatchEvent(e),this.icon&&this.icon.registDefaultIcon()}}},{key:"_getEditorDimension",value:function(){var e=parseFloat(this._editorContainerElement.style.maxHeight),t=this.imageSize.newHeight>e?e:this.imageSize.newHeight,n=parseFloat(this._editorContainerElement.style.maxWidth),i=this.imageSize.newWidth>n?n:this.imageSize.newWidth;return{width:i,height:t}}},{key:"_getEditorPosition",value:function(e){var t=0,n=0,i=0,o=0;if(this.submenu)switch(e){case"bottom":t+=150;break;case"top":n+=150;break;case"left":i+=248,o+=248;break;case"right":o+=248}return{top:n,bottom:t,left:i,right:o}}}]),e}();t.default=L},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n\n \n
      \n
    • \n \n \n \n \n
      • \n
    • \n \n \n \n \n
      • \n
    • \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    • \n \n \n \n \n
      • \n
    • \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    \n\n
    \n \n \n
    \n \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.biImage,n=e.commonStyle,i=e.headerStyle,o=e.loadButtonStyle,r=e.downloadButtonStyle,a=e.submenuStyle;return'\n
    \n
    \n \n
    \n \n \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.subMenuLabelActive,n=e.subMenuLabelNormal,i=e.subMenuRangeTitle,o=e.submenuPartitionVertical,r=e.submenuPartitionHorizontal,a=e.submenuCheckbox,s=e.submenuRangePointer,l=e.submenuRangeValue,c=e.submenuColorpickerTitle,u=e.submenuColorpickerButton,d=e.submenuRangeBar,h=e.submenuRangeSubbar,f=e.submenuIconSize,p=e.menuIconSize,g=e.biSize;return'\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype="icon-bubble"] label,\n #tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype="icon-heart"] label,\n #tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype="icon-location"] label,\n #tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype="icon-polygon"] label,\n #tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype="icon-star"] label,\n #tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype="icon-arrow-3"] label,\n #tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype="icon-arrow-2"] label,\n #tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype="icon-arrow"] label,\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype="icon-bubble"] label,\n #tie-draw-line-select-button.line .tui-image-editor-button.line label,\n #tie-draw-line-select-button.free .tui-image-editor-button.free label,\n #tie-flip-button.flipX .tui-image-editor-button.flipX label,\n #tie-flip-button.flipY .tui-image-editor-button.flipY label,\n #tie-flip-button.resetFlip .tui-image-editor-button.resetFlip label,\n #tie-crop-button .tui-image-editor-button.apply.active label,\n #tie-shape-button.rect .tui-image-editor-button.rect label,\n #tie-shape-button.circle .tui-image-editor-button.circle label,\n #tie-shape-button.triangle .tui-image-editor-button.triangle label,\n #tie-text-effect-button .tui-image-editor-button.active label,\n #tie-text-align-button.left .tui-image-editor-button.left label,\n #tie-text-align-button.center .tui-image-editor-button.center label,\n #tie-text-align-button.right .tui-image-editor-button.right label,\n #tie-mask-apply.apply.active .tui-image-editor-button.apply label,\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover > label,\n .tui-image-editor-container .tui-image-editor-checkbox input + label {\n '+t+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button > label,\n .tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label {\n "+n+"\n }\n .tui-image-editor-container .tui-image-editor-range-wrap label {\n "+i+"\n }\n .tui-image-editor-container .tui-image-editor-partition > div {\n "+o+"\n }\n .tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition > div,\n .tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition > div {\n "+r+"\n }\n .tui-image-editor-container .tui-image-editor-checkbox input + label:before {\n "+a+"\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-pointer {\n "+s+"\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-bar {\n "+d+"\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-subbar {\n "+h+"\n }\n .tui-image-editor-container .tui-image-editor-range-value {\n "+l+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value + label {\n "+c+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value {\n "+u+"\n }\n .tui-image-editor-container .svg_ic-menu {\n "+p+"\n }\n .tui-image-editor-container .svg_ic-submenu {\n "+f+"\n }\n .tui-image-editor-container .tui-image-editor-controls-logo > img,\n .tui-image-editor-container .tui-image-editor-header-logo > img {\n "+g+"\n }\n\n"}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n \n \n \n \n \n
      \n
      \n \n \n \n \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(){return'\n
      \n
    • \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n\n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n \n \n \n \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'; -}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n-1&&"none"!==e&&(e="url("+e+")"),n.push(t._toUnderScore(i)+": "+e)}),n.join(";")}},{key:"_toUnderScore",value:function(e){return e.replace(/([A-Z])/g,function(e,t){return"-"+t.toLowerCase()})}}]),e}();t.default=h},function(e,t){e.exports=function(){}},function(e,t){e.exports=function(e,t,n,i){if(!(e instanceof t)||void 0!==i&&i in e)throw TypeError(n+": incorrect invocation!");return e}},function(e,t,n){var i=n(30),o=n(42),r=n(139);e.exports=function(e){return function(t,n,a){var s,l=i(t),c=o(l.length),u=r(a,c);if(e&&n!=n){for(;c>u;)if(s=l[u++],s!=s)return!0}else for(;c>u;u++)if((e||u in l)&&l[u]===n)return e||u||0;return!e&&-1}}},function(e,t,n){var i=n(20),o=n(124),r=n(123),a=n(11),s=n(42),l=n(142),c={},u={},t=e.exports=function(e,t,n,d,h){var f,p,g,v,m=h?function(){return e}:l(e),b=i(n,d,t?2:1),y=0;if("function"!=typeof m)throw TypeError(e+" is not iterable!");if(r(m)){for(f=s(e.length);f>y;y++)if(v=t?b(a(p=e[y])[0],p[1]):b(e[y]),v===c||v===u)return v}else for(g=m.call(e);!(p=g.next()).done;)if(v=o(g,b,p.value,t),v===c||v===u)return v};t.BREAK=c,t.RETURN=u},function(e,t,n){e.exports=!n(17)&&!n(35)(function(){return 7!=Object.defineProperty(n(26)("div"),"a",{get:function(){return 7}}).a})},function(e,t){e.exports=function(e,t,n){var i=void 0===n;switch(t.length){case 0:return i?e():e.call(n);case 1:return i?e(t[0]):e.call(n,t[0]);case 2:return i?e(t[0],t[1]):e.call(n,t[0],t[1]);case 3:return i?e(t[0],t[1],t[2]):e.call(n,t[0],t[1],t[2]);case 4:return i?e(t[0],t[1],t[2],t[3]):e.call(n,t[0],t[1],t[2],t[3])}return e.apply(n,t)}},function(e,t,n){var i=n(19);e.exports=Object("z").propertyIsEnumerable(0)?Object:function(e){return"String"==i(e)?e.split(""):Object(e)}},function(e,t,n){var i=n(18),o=n(7)("iterator"),r=Array.prototype;e.exports=function(e){return void 0!==e&&(i.Array===e||r[o]===e)}},function(e,t,n){var i=n(11);e.exports=function(e,t,n,o){try{return o?t(i(n)[0],n[1]):t(n)}catch(t){var r=e.return;throw void 0!==r&&i(r.call(e)),t}}},function(e,t,n){"use strict";var i=n(129),o=n(39),r=n(27),a={};n(12)(a,n(7)("iterator"),function(){return this}),e.exports=function(e,t,n){e.prototype=i(a,{next:o(1,n)}),r(e,t+" Iterator")}},function(e,t,n){var i=n(7)("iterator"),o=!1;try{var r=[7][i]();r.return=function(){o=!0},Array.from(r,function(){throw 2})}catch(e){}e.exports=function(e,t){if(!t&&!o)return!1;var n=!1;try{var r=[7],a=r[i]();a.next=function(){return{done:n=!0}},r[i]=function(){return a},e(r)}catch(e){}return n}},function(e,t){e.exports=function(e,t){return{value:t,done:!!e}}},function(e,t,n){var i=n(9),o=n(41).set,r=i.MutationObserver||i.WebKitMutationObserver,a=i.process,s=i.Promise,l="process"==n(19)(a);e.exports=function(){var e,t,n,c=function(){var i,o;for(l&&(i=a.domain)&&i.exit();e;){o=e.fn,e=e.next;try{o()}catch(i){throw e?n():t=void 0,i}}t=void 0,i&&i.enter()};if(l)n=function(){a.nextTick(c)};else if(r){var u=!0,d=document.createTextNode("");new r(c).observe(d,{characterData:!0}),n=function(){d.data=u=!u}}else if(s&&s.resolve){var h=s.resolve();n=function(){h.then(c)}}else n=function(){o.call(i,c)};return function(i){var o={fn:i,next:void 0};t&&(t.next=o),e||(e=o,n()),t=o}}},function(e,t,n){var i=n(11),o=n(130),r=n(33),a=n(28)("IE_PROTO"),s=function(){},l="prototype",c=function(){var e,t=n(26)("iframe"),i=r.length,o="<",a=">";for(t.style.display="none",n(36).appendChild(t),t.src="javascript:",e=t.contentWindow.document,e.open(),e.write(o+"script"+a+"document.F=Object"+o+"/script"+a),e.close(),c=e.F;i--;)delete c[l][r[i]];return c()};e.exports=Object.create||function(e,t){var n;return null!==e?(s[l]=i(e),n=new s,s[l]=null,n[a]=e):n=c(),void 0===t?n:o(n,t)}},function(e,t,n){var i=n(23),o=n(11),r=n(133);e.exports=n(17)?Object.defineProperties:function(e,t){o(e);for(var n,a=r(t),s=a.length,l=0;s>l;)i.f(e,n=a[l++],t[n]);return e}},function(e,t,n){var i=n(21),o=n(140),r=n(28)("IE_PROTO"),a=Object.prototype;e.exports=Object.getPrototypeOf||function(e){return e=o(e),i(e,r)?e[r]:"function"==typeof e.constructor&&e instanceof e.constructor?e.constructor.prototype:e instanceof Object?a:null}},function(e,t,n){var i=n(21),o=n(30),r=n(118)(!1),a=n(28)("IE_PROTO");e.exports=function(e,t){var n,s=o(e),l=0,c=[];for(n in s)n!=a&&i(s,n)&&c.push(n);for(;t.length>l;)i(s,n=t[l++])&&(~r(c,n)||c.push(n));return c}},function(e,t,n){var i=n(132),o=n(33);e.exports=Object.keys||function(e){return i(e,o)}},function(e,t,n){var i=n(12);e.exports=function(e,t,n){for(var o in t)n&&e[o]?e[o]=t[o]:i(e,o,t[o]);return e}},function(e,t,n){e.exports=n(12)},function(e,t,n){"use strict";var i=n(9),o=n(16),r=n(23),a=n(17),s=n(7)("species");e.exports=function(e){var t="function"==typeof o[e]?o[e]:i[e];a&&t&&!t[s]&&r.f(t,s,{configurable:!0,get:function(){return this}})}},function(e,t,n){var i=n(11),o=n(24),r=n(7)("species");e.exports=function(e,t){var n,a=i(e).constructor;return void 0===a||void 0==(n=i(a)[r])?t:o(n)}},function(e,t,n){var i=n(29),o=n(25);e.exports=function(e){return function(t,n){var r,a,s=String(o(t)),l=i(n),c=s.length;return l<0||l>=c?e?"":void 0:(r=s.charCodeAt(l),r<55296||r>56319||l+1===c||(a=s.charCodeAt(l+1))<56320||a>57343?e?s.charAt(l):r:e?s.slice(l,l+2):(r-55296<<10)+(a-56320)+65536)}}},function(e,t,n){var i=n(29),o=Math.max,r=Math.min;e.exports=function(e,t){return e=i(e),e<0?o(e+t,0):r(e,t)}},function(e,t,n){var i=n(25);e.exports=function(e){return Object(i(e))}},function(e,t,n){var i=n(22);e.exports=function(e,t){if(!i(e))return e;var n,o;if(t&&"function"==typeof(n=e.toString)&&!i(o=n.call(e)))return o;if("function"==typeof(n=e.valueOf)&&!i(o=n.call(e)))return o;if(!t&&"function"==typeof(n=e.toString)&&!i(o=n.call(e)))return o;throw TypeError("Can't convert object to primitive value")}},function(e,t,n){var i=n(32),o=n(7)("iterator"),r=n(18);e.exports=n(16).getIteratorMethod=function(e){if(void 0!=e)return e[o]||e["@@iterator"]||r[i(e)]}},function(e,t,n){"use strict";var i=n(116),o=n(127),r=n(18),a=n(30);e.exports=n(37)(Array,"Array",function(e,t){this._t=a(e),this._i=0,this._k=t},function(){var e=this._t,t=this._k,n=this._i++;return!e||n>=e.length?(this._t=void 0,o(1)):"keys"==t?o(0,n):"values"==t?o(0,e[n]):o(0,[n,e[n]])},"values"),r.Arguments=r.Array,i("keys"),i("values"),i("entries")},function(e,t){},function(e,t,n){"use strict";var i,o,r,a=n(38),s=n(9),l=n(20),c=n(32),u=n(34),d=n(22),h=n(24),f=n(117),p=n(119),g=n(137),v=n(41).set,m=n(128)(),b="Promise",y=s.TypeError,_=s.process,k=s[b],_=s.process,w="process"==c(_),x=function(){},E=!!function(){try{var e=k.resolve(1),t=(e.constructor={})[n(7)("species")]=function(e){e(x,x)};return(w||"function"==typeof PromiseRejectionEvent)&&e.then(x)instanceof t}catch(e){}}(),C=function(e,t){return e===t||e===k&&t===r},O=function(e){var t;return!(!d(e)||"function"!=typeof(t=e.then))&&t},S=function(e){return C(k,e)?new M(e):new o(e)},M=o=function(e){var t,n;this.promise=new e(function(e,i){if(void 0!==t||void 0!==n)throw y("Bad Promise constructor");t=e,n=i}),this.resolve=h(t),this.reject=h(n)},j=function(e){try{e()}catch(e){return{error:e}}},T=function(e,t){if(!e._n){e._n=!0;var n=e._c;m(function(){for(var i=e._v,o=1==e._s,r=0,a=function(t){var n,r,a=o?t.ok:t.fail,s=t.resolve,l=t.reject,c=t.domain;try{a?(o||(2==e._h&&I(e),e._h=1),a===!0?n=i:(c&&c.enter(),n=a(i),c&&c.exit()),n===t.promise?l(y("Promise-chain cycle")):(r=O(n))?r.call(n,s,l):s(n)):l(i)}catch(e){l(e)}};n.length>r;)a(n[r++]);e._c=[],e._n=!1,t&&!e._h&&P(e)})}},P=function(e){v.call(s,function(){var t,n,i,o=e._v;if(A(e)&&(t=j(function(){w?_.emit("unhandledRejection",o,e):(n=s.onunhandledrejection)?n({promise:e,reason:o}):(i=s.console)&&i.error&&i.error("Unhandled promise rejection",o)}),e._h=w||A(e)?2:1),e._a=void 0,t)throw t.error})},A=function(e){if(1==e._h)return!1;for(var t,n=e._a||e._c,i=0;n.length>i;)if(t=n[i++],t.fail||!A(t.promise))return!1;return!0},I=function(e){v.call(s,function(){var t;w?_.emit("rejectionHandled",e):(t=s.onrejectionhandled)&&t({promise:e,reason:e._v})})},D=function(e){var t=this;t._d||(t._d=!0,t=t._w||t,t._v=e,t._s=2,t._a||(t._a=t._c.slice()),T(t,!0))},R=function(e){var t,n=this;if(!n._d){n._d=!0,n=n._w||n;try{if(n===e)throw y("Promise can't be resolved itself");(t=O(e))?m(function(){var i={_w:n,_d:!1};try{t.call(e,l(R,i,1),l(D,i,1))}catch(e){D.call(i,e)}}):(n._v=e,n._s=1,T(n,!1))}catch(e){D.call({_w:n,_d:!1},e)}}};E||(k=function(e){f(this,k,b,"_h"),h(e),i.call(this);try{e(l(R,this,1),l(D,this,1))}catch(e){D.call(this,e)}},i=function(e){this._c=[],this._a=void 0,this._s=0,this._d=!1,this._v=void 0,this._h=0,this._n=!1},i.prototype=n(134)(k.prototype,{then:function(e,t){var n=S(g(this,k));return n.ok="function"!=typeof e||e,n.fail="function"==typeof t&&t,n.domain=w?_.domain:void 0,this._c.push(n),this._a&&this._a.push(n),this._s&&T(this,!1),n.promise},catch:function(e){return this.then(void 0,e)}}),M=function(){var e=new i;this.promise=e,this.resolve=l(R,e,1),this.reject=l(D,e,1)}),u(u.G+u.W+u.F*!E,{Promise:k}),n(27)(k,b),n(136)(b),r=n(16)[b],u(u.S+u.F*!E,b,{reject:function(e){var t=S(this),n=t.reject;return n(e),t.promise}}),u(u.S+u.F*(a||!E),b,{resolve:function(e){if(e instanceof k&&C(e.constructor,this))return e;var t=S(this),n=t.resolve;return n(e),t.promise}}),u(u.S+u.F*!(E&&n(126)(function(e){k.all(e).catch(x)})),b,{all:function(e){var t=this,n=S(t),i=n.resolve,o=n.reject,r=j(function(){var n=[],r=0,a=1;p(e,!1,function(e){var s=r++,l=!1;n.push(void 0),a++,t.resolve(e).then(function(e){l||(l=!0,n[s]=e,--a||i(n))},o)}),--a||i(n)});return r&&o(r.error),n.promise},race:function(e){var t=this,n=S(t),i=n.reject,o=j(function(){p(e,!1,function(e){t.resolve(e).then(n.resolve,i)})});return o&&i(o.error),n.promise}})},function(e,t,n){"use strict";var i=n(138)(!0);n(37)(String,"String",function(e){this._t=String(e),this._i=0},function(){var e,t=this._t,n=this._i;return n>=t.length?{value:void 0,done:!0}:(e=i(t,n),this._i+=e.length,{value:e,done:!1})})},function(e,t,n){n(143);for(var i=n(9),o=n(12),r=n(18),a=n(7)("toStringTag"),s=["NodeList","DOMTokenList","MediaList","StyleSheetList","CSSRuleList"],l=0;l<5;l++){var c=s[l],u=i[c],d=u&&u.prototype;d&&!d[a]&&o(d,a,c),r[c]=r.Array}},function(e,t){},function(e,t,n){/*! +function(){if("undefined"!=typeof window&&window.addEventListener){var e,t,n=Object.create(null),i=function(){clearTimeout(t),t=setTimeout(e,100)},o=function(){},r=function(){var e;window.addEventListener("resize",i,!1),window.addEventListener("orientationchange",i,!1),window.MutationObserver?(e=new MutationObserver(i),e.observe(document.documentElement,{childList:!0,subtree:!0,attributes:!0}),o=function(){try{e.disconnect(),window.removeEventListener("resize",i,!1),window.removeEventListener("orientationchange",i,!1)}catch(e){}}):(document.documentElement.addEventListener("DOMSubtreeModified",i,!1),o=function(){document.documentElement.removeEventListener("DOMSubtreeModified",i,!1),window.removeEventListener("resize",i,!1),window.removeEventListener("orientationchange",i,!1)})},a=function(e){function t(e){var t;return void 0!==e.protocol?t=e:(t=document.createElement("a"),t.href=e),t.protocol.replace(/:/g,"")+t.host}var n,i,o;return window.XMLHttpRequest&&(n=new XMLHttpRequest,i=t(location),o=t(e),n=void 0===n.withCredentials&&""!==o&&o!==i?XDomainRequest||void 0:XMLHttpRequest),n},s="http://www.w3.org/1999/xlink";e=function(){function e(){_-=1,0===_&&(o(),r())}function t(e){return function(){n[e.base]!==!0&&(e.useEl.setAttributeNS(s,"xlink:href","#"+e.hash),e.useEl.hasAttribute("href")&&e.useEl.setAttribute("href","#"+e.hash))}}function i(t){return function(){var n,i=document.body,o=document.createElement("x");t.onload=null,o.innerHTML=t.responseText,n=o.getElementsByTagName("svg")[0],n&&(n.setAttribute("aria-hidden","true"),n.style.position="absolute",n.style.width=0,n.style.height=0,n.style.overflow="hidden",i.insertBefore(n,i.firstChild)),e()}}function l(t){return function(){t.onerror=null,t.ontimeout=null,e()}}var c,u,d,h,f,p,g,v,m,b,y="",_=0;for(o(),m=document.getElementsByTagName("use"),f=0;f0&&void 0!==arguments[0]?arguments[0]:{},t=e.uiSize,n=e.imageSize,i=void 0===n?this.imageSize:n;i!==this.imageSize&&(this.imageSize=i),t&&this._setUiSize(t);var o=this._getEditorDimension(),r=o.width,a=o.height,s=this._editorElement.style,l=this.options.menuBarPosition;s.height=a+"px",s.width=r+"px",this._setEditorPosition(l),this._editorElementWrap.style.bottom="0px",this._editorElementWrap.style.top="0px",this._editorElementWrap.style.left="0px",this._editorElementWrap.style.width="100%";var c=this._selectedElement.classList;"top"===l&&this._selectedElement.offsetWidth0&&void 0!==arguments[0]?arguments[0]:this.options.uiSize,t=this._selectedElement.style;t.width=e.width,t.height=e.height}},{key:"_makeSubMenu",value:function(){var e=this;s.default.forEach(this.options.menu,function(t){var n=I[t.replace(/^[a-z]/,function(e){return e.toUpperCase()})];e._makeMenuElement(t),e._els[t]=e._menuElement.querySelector("#tie-btn-"+t),e[t]=new n(e._subMenuElement,{iconStyle:e.theme.getStyle("submenu.icon"),menuBarPosition:e.options.menuBarPosition})})}},{key:"_makeUiElement",value:function(e){var t=void 0;window.snippet=s.default,t=e.jquery?e[0]:e.nodeType?e:document.querySelector(e);var n=c.default.getSelector(t);t.classList.add("tui-image-editor-container"),t.innerHTML=(0,f.default)({biImage:this.theme.getStyle("common.bi"),iconStyle:this.theme.getStyle("menu.icon"),loadButtonStyle:this.theme.getStyle("loadButton"),downloadButtonStyle:this.theme.getStyle("downloadButton")})+(0,d.default)({biImage:this.theme.getStyle("common.bi"),commonStyle:this.theme.getStyle("common"),headerStyle:this.theme.getStyle("header"),loadButtonStyle:this.theme.getStyle("loadButton"),downloadButtonStyle:this.theme.getStyle("downloadButton"),submenuStyle:this.theme.getStyle("submenu")}),this._selectedElement=t,this._selectedElement.classList.add(this.options.menuBarPosition),this._mainElement=n(".tui-image-editor-main"),this._editorElementWrap=n(".tui-image-editor-wrap"),this._editorElement=n(".tui-image-editor"),this._menuElement=n(".tui-image-editor-menu"),this._subMenuElement=n(".tui-image-editor-submenu")}},{key:"_makeMenuElement",value:function(e){var t=document.createElement("li"),n=this.theme.getStyle("menu.icon"),i=n.normal,o=n.active,r=n.hover,a='\n \n \n \n \n \n ';t.id="tie-btn-"+e,t.className="tui-image-editor-item normal",t.title=e.replace(/^[a-z]/g,function(e){return e.toUpperCase()}),t.innerHTML=a,this._menuElement.appendChild(t)}},{key:"_addHelpActionEvent",value:function(e){var t=this;this._els[e].addEventListener("click",function(){t._actions.main[e]()})}},{key:"_addDownloadEvent",value:function(){var e=this;s.default.forEach(this._els.download,function(t){t.addEventListener("click",function(){e._actions.main.download()})})}},{key:"_addLoadEvent",value:function(){var e=this;s.default.forEach(this._els.load,function(t){t.addEventListener("change",function(t){e._actions.main.load(t.target.files[0])})})}},{key:"_addMenuEvent",value:function(e){var t=this;this._els[e].addEventListener("click",function(){t.changeMenu(e)})}},{key:"_addSubMenuEvent",value:function(e){this[e].addEvent(this._actions[e])}},{key:"getEditorArea",value:function(){return this._editorElement}},{key:"initCanvas",value:function(){var e=this,t=this._getLoadImage();t&&this._actions.main.initLoadImage(t.path,t.name).then(function(){e._addHelpActionEvent("undo"),e._addHelpActionEvent("redo"),e._addHelpActionEvent("reset"),e._addHelpActionEvent("delete"),e._addHelpActionEvent("deleteAll"),e._addDownloadEvent(),e._addLoadEvent(),s.default.forEach(e.options.menu,function(t){e._addMenuEvent(t),e._addSubMenuEvent(t)}),e._initMenu()});var n=document.createElement("div");n.className="tui-image-editor-grid-visual";var i='\n \n \n \n
    ';n.innerHTML=i,this._editorContainerElement=this._editorElement.querySelector(".tui-image-editor-canvas-container"),this._editorContainerElement.appendChild(n)}},{key:"_getLoadImage",value:function(){return this.options.loadImage}},{key:"changeMenu",value:function(e){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],n=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];this._submenuChangeTransection||(this._submenuChangeTransection=!0,this._changeMenu(e,t,n),this._submenuChangeTransection=!1)}},{key:"_changeMenu",value:function(e,t,n){this.submenu&&(this._els[this.submenu].classList.remove("active"),this._mainElement.classList.remove("tui-image-editor-menu-"+this.submenu),n&&this._actions.main.discardSelection(),this._actions.main.changeSelectableAll(!0),this[this.submenu].changeStandbyMode()),this.submenu===e&&t?this.submenu=null:(this._els[e].classList.add("active"),this._mainElement.classList.add("tui-image-editor-menu-"+e),this.submenu=e,this[this.submenu].changeStartMode()),this.resizeEditor()}},{key:"_initMenu",value:function(){if(this.options.initMenu){var e=document.createEvent("MouseEvents");e.initEvent("click",!0,!1),this._els[this.options.initMenu].dispatchEvent(e),this.icon&&this.icon.registDefaultIcon()}}},{key:"_getEditorDimension",value:function(){var e=parseFloat(this._editorContainerElement.style.maxHeight),t=this.imageSize.newHeight>e?e:this.imageSize.newHeight,n=parseFloat(this._editorContainerElement.style.maxWidth),i=this.imageSize.newWidth>n?n:this.imageSize.newWidth;return{width:i,height:t}}},{key:"_setEditorPosition",value:function(e){var t=this._getEditorDimension(),n=t.width,i=t.height,o=this._editorElement.style,r=0,a=0;this.submenu&&("bottom"===e?r=i>this._editorElementWrap.scrollHeight-150?(i-this._editorElementWrap.scrollHeight)/2:-75:"top"===e?r=i>this._editorElementWrap.offsetHeight-150?75-(i-(this._editorElementWrap.offsetHeight-150))/2:75:"left"===e?a=n>this._editorElementWrap.offsetWidth-248?124-(n-(this._editorElementWrap.offsetWidth-248))/2:124:"right"===e&&(a=n>this._editorElementWrap.scrollWidth-248?(n-this._editorElementWrap.scrollWidth)/2:-124)),o.top=r+"px",o.left=a+"px"}}]),e}();t.default=L},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n\n \n
      \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    \n\n
    \n \n \n
    \n \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.biImage,n=e.commonStyle,i=e.headerStyle,o=e.loadButtonStyle,r=e.downloadButtonStyle,a=e.submenuStyle;return'\n
    \n
    \n \n
    \n \n \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.subMenuLabelActive,n=e.subMenuLabelNormal,i=e.subMenuRangeTitle,o=e.submenuPartitionVertical,r=e.submenuPartitionHorizontal,a=e.submenuCheckbox,s=e.submenuRangePointer,l=e.submenuRangeValue,c=e.submenuColorpickerTitle,u=e.submenuColorpickerButton,d=e.submenuRangeBar,h=e.submenuRangeSubbar,f=e.submenuDisabledRangePointer,p=e.submenuDisabledRangeBar,g=e.submenuDisabledRangeSubbar,v=e.submenuIconSize,m=e.menuIconSize,b=e.biSize;return'\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype="icon-bubble"] label,\n #tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype="icon-heart"] label,\n #tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype="icon-location"] label,\n #tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype="icon-polygon"] label,\n #tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype="icon-star"] label,\n #tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype="icon-arrow-3"] label,\n #tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype="icon-arrow-2"] label,\n #tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype="icon-arrow"] label,\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype="icon-bubble"] label,\n #tie-draw-line-select-button.line .tui-image-editor-button.line label,\n #tie-draw-line-select-button.free .tui-image-editor-button.free label,\n #tie-flip-button.flipX .tui-image-editor-button.flipX label,\n #tie-flip-button.flipY .tui-image-editor-button.flipY label,\n #tie-flip-button.resetFlip .tui-image-editor-button.resetFlip label,\n #tie-crop-button .tui-image-editor-button.apply.active label,\n #tie-shape-button.rect .tui-image-editor-button.rect label,\n #tie-shape-button.circle .tui-image-editor-button.circle label,\n #tie-shape-button.triangle .tui-image-editor-button.triangle label,\n #tie-text-effect-button .tui-image-editor-button.active label,\n #tie-text-align-button.left .tui-image-editor-button.left label,\n #tie-text-align-button.center .tui-image-editor-button.center label,\n #tie-text-align-button.right .tui-image-editor-button.right label,\n #tie-mask-apply.apply.active .tui-image-editor-button.apply label,\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover > label,\n .tui-image-editor-container .tui-image-editor-checkbox input + label {\n '+t+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button > label,\n .tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label {\n "+n+"\n }\n .tui-image-editor-container .tui-image-editor-range-wrap label {\n "+i+"\n }\n .tui-image-editor-container .tui-image-editor-partition > div {\n "+o+"\n }\n .tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition > div,\n .tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition > div {\n "+r+"\n }\n .tui-image-editor-container .tui-image-editor-checkbox input + label:before {\n "+a+"\n }\n .tui-image-editor-container .tui-image-editor-checkbox input:checked + label:before {\n border: 0;\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-pointer {\n "+s+"\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-bar {\n "+d+"\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-subbar {\n "+h+"\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-pointer {\n "+f+"\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-subbar {\n "+g+"\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-bar {\n "+p+"\n }\n .tui-image-editor-container .tui-image-editor-range-value {\n "+l+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value + label {\n "+c+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value {\n "+u+"\n }\n .tui-image-editor-container .svg_ic-menu {\n "+m+"\n }\n .tui-image-editor-container .svg_ic-submenu {\n "+v+"\n }\n .tui-image-editor-container .tui-image-editor-controls-logo > img,\n .tui-image-editor-container .tui-image-editor-header-logo > img {\n "+b+"\n }\n\n"}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n \n \n \n \n \n
      \n
      \n \n \n \n \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(){return'\n
      \n
    • \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n\n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    \n'; +}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n \n \n \n \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n-1&&"none"!==e&&(e="url("+e+")"),n.push(t._toUnderScore(i)+": "+e)}),n.join(";")}},{key:"_toUnderScore",value:function(e){return e.replace(/([A-Z])/g,function(e,t){return"-"+t.toLowerCase()})}}]),e}();t.default=h},function(e,t){e.exports=function(){}},function(e,t){e.exports=function(e,t,n,i){if(!(e instanceof t)||void 0!==i&&i in e)throw TypeError(n+": incorrect invocation!");return e}},function(e,t,n){var i=n(30),o=n(42),r=n(139);e.exports=function(e){return function(t,n,a){var s,l=i(t),c=o(l.length),u=r(a,c);if(e&&n!=n){for(;c>u;)if(s=l[u++],s!=s)return!0}else for(;c>u;u++)if((e||u in l)&&l[u]===n)return e||u||0;return!e&&-1}}},function(e,t,n){var i=n(20),o=n(124),r=n(123),a=n(11),s=n(42),l=n(142),c={},u={},t=e.exports=function(e,t,n,d,h){var f,p,g,v,m=h?function(){return e}:l(e),b=i(n,d,t?2:1),y=0;if("function"!=typeof m)throw TypeError(e+" is not iterable!");if(r(m)){for(f=s(e.length);f>y;y++)if(v=t?b(a(p=e[y])[0],p[1]):b(e[y]),v===c||v===u)return v}else for(g=m.call(e);!(p=g.next()).done;)if(v=o(g,b,p.value,t),v===c||v===u)return v};t.BREAK=c,t.RETURN=u},function(e,t,n){e.exports=!n(17)&&!n(35)(function(){return 7!=Object.defineProperty(n(26)("div"),"a",{get:function(){return 7}}).a})},function(e,t){e.exports=function(e,t,n){var i=void 0===n;switch(t.length){case 0:return i?e():e.call(n);case 1:return i?e(t[0]):e.call(n,t[0]);case 2:return i?e(t[0],t[1]):e.call(n,t[0],t[1]);case 3:return i?e(t[0],t[1],t[2]):e.call(n,t[0],t[1],t[2]);case 4:return i?e(t[0],t[1],t[2],t[3]):e.call(n,t[0],t[1],t[2],t[3])}return e.apply(n,t)}},function(e,t,n){var i=n(19);e.exports=Object("z").propertyIsEnumerable(0)?Object:function(e){return"String"==i(e)?e.split(""):Object(e)}},function(e,t,n){var i=n(18),o=n(7)("iterator"),r=Array.prototype;e.exports=function(e){return void 0!==e&&(i.Array===e||r[o]===e)}},function(e,t,n){var i=n(11);e.exports=function(e,t,n,o){try{return o?t(i(n)[0],n[1]):t(n)}catch(t){var r=e.return;throw void 0!==r&&i(r.call(e)),t}}},function(e,t,n){"use strict";var i=n(129),o=n(39),r=n(27),a={};n(12)(a,n(7)("iterator"),function(){return this}),e.exports=function(e,t,n){e.prototype=i(a,{next:o(1,n)}),r(e,t+" Iterator")}},function(e,t,n){var i=n(7)("iterator"),o=!1;try{var r=[7][i]();r.return=function(){o=!0},Array.from(r,function(){throw 2})}catch(e){}e.exports=function(e,t){if(!t&&!o)return!1;var n=!1;try{var r=[7],a=r[i]();a.next=function(){return{done:n=!0}},r[i]=function(){return a},e(r)}catch(e){}return n}},function(e,t){e.exports=function(e,t){return{value:t,done:!!e}}},function(e,t,n){var i=n(9),o=n(41).set,r=i.MutationObserver||i.WebKitMutationObserver,a=i.process,s=i.Promise,l="process"==n(19)(a);e.exports=function(){var e,t,n,c=function(){var i,o;for(l&&(i=a.domain)&&i.exit();e;){o=e.fn,e=e.next;try{o()}catch(i){throw e?n():t=void 0,i}}t=void 0,i&&i.enter()};if(l)n=function(){a.nextTick(c)};else if(r){var u=!0,d=document.createTextNode("");new r(c).observe(d,{characterData:!0}),n=function(){d.data=u=!u}}else if(s&&s.resolve){var h=s.resolve();n=function(){h.then(c)}}else n=function(){o.call(i,c)};return function(i){var o={fn:i,next:void 0};t&&(t.next=o),e||(e=o,n()),t=o}}},function(e,t,n){var i=n(11),o=n(130),r=n(33),a=n(28)("IE_PROTO"),s=function(){},l="prototype",c=function(){var e,t=n(26)("iframe"),i=r.length,o="<",a=">";for(t.style.display="none",n(36).appendChild(t),t.src="javascript:",e=t.contentWindow.document,e.open(),e.write(o+"script"+a+"document.F=Object"+o+"/script"+a),e.close(),c=e.F;i--;)delete c[l][r[i]];return c()};e.exports=Object.create||function(e,t){var n;return null!==e?(s[l]=i(e),n=new s,s[l]=null,n[a]=e):n=c(),void 0===t?n:o(n,t)}},function(e,t,n){var i=n(23),o=n(11),r=n(133);e.exports=n(17)?Object.defineProperties:function(e,t){o(e);for(var n,a=r(t),s=a.length,l=0;s>l;)i.f(e,n=a[l++],t[n]);return e}},function(e,t,n){var i=n(21),o=n(140),r=n(28)("IE_PROTO"),a=Object.prototype;e.exports=Object.getPrototypeOf||function(e){return e=o(e),i(e,r)?e[r]:"function"==typeof e.constructor&&e instanceof e.constructor?e.constructor.prototype:e instanceof Object?a:null}},function(e,t,n){var i=n(21),o=n(30),r=n(118)(!1),a=n(28)("IE_PROTO");e.exports=function(e,t){var n,s=o(e),l=0,c=[];for(n in s)n!=a&&i(s,n)&&c.push(n);for(;t.length>l;)i(s,n=t[l++])&&(~r(c,n)||c.push(n));return c}},function(e,t,n){var i=n(132),o=n(33);e.exports=Object.keys||function(e){return i(e,o)}},function(e,t,n){var i=n(12);e.exports=function(e,t,n){for(var o in t)n&&e[o]?e[o]=t[o]:i(e,o,t[o]);return e}},function(e,t,n){e.exports=n(12)},function(e,t,n){"use strict";var i=n(9),o=n(16),r=n(23),a=n(17),s=n(7)("species");e.exports=function(e){var t="function"==typeof o[e]?o[e]:i[e];a&&t&&!t[s]&&r.f(t,s,{configurable:!0,get:function(){return this}})}},function(e,t,n){var i=n(11),o=n(24),r=n(7)("species");e.exports=function(e,t){var n,a=i(e).constructor;return void 0===a||void 0==(n=i(a)[r])?t:o(n)}},function(e,t,n){var i=n(29),o=n(25);e.exports=function(e){return function(t,n){var r,a,s=String(o(t)),l=i(n),c=s.length;return l<0||l>=c?e?"":void 0:(r=s.charCodeAt(l),r<55296||r>56319||l+1===c||(a=s.charCodeAt(l+1))<56320||a>57343?e?s.charAt(l):r:e?s.slice(l,l+2):(r-55296<<10)+(a-56320)+65536)}}},function(e,t,n){var i=n(29),o=Math.max,r=Math.min;e.exports=function(e,t){return e=i(e),e<0?o(e+t,0):r(e,t)}},function(e,t,n){var i=n(25);e.exports=function(e){return Object(i(e))}},function(e,t,n){var i=n(22);e.exports=function(e,t){if(!i(e))return e;var n,o;if(t&&"function"==typeof(n=e.toString)&&!i(o=n.call(e)))return o;if("function"==typeof(n=e.valueOf)&&!i(o=n.call(e)))return o;if(!t&&"function"==typeof(n=e.toString)&&!i(o=n.call(e)))return o;throw TypeError("Can't convert object to primitive value")}},function(e,t,n){var i=n(32),o=n(7)("iterator"),r=n(18);e.exports=n(16).getIteratorMethod=function(e){if(void 0!=e)return e[o]||e["@@iterator"]||r[i(e)]}},function(e,t,n){"use strict";var i=n(116),o=n(127),r=n(18),a=n(30);e.exports=n(37)(Array,"Array",function(e,t){this._t=a(e),this._i=0,this._k=t},function(){var e=this._t,t=this._k,n=this._i++;return!e||n>=e.length?(this._t=void 0,o(1)):"keys"==t?o(0,n):"values"==t?o(0,e[n]):o(0,[n,e[n]])},"values"),r.Arguments=r.Array,i("keys"),i("values"),i("entries")},function(e,t){},function(e,t,n){"use strict";var i,o,r,a=n(38),s=n(9),l=n(20),c=n(32),u=n(34),d=n(22),h=n(24),f=n(117),p=n(119),g=n(137),v=n(41).set,m=n(128)(),b="Promise",y=s.TypeError,_=s.process,k=s[b],_=s.process,w="process"==c(_),x=function(){},E=!!function(){try{var e=k.resolve(1),t=(e.constructor={})[n(7)("species")]=function(e){e(x,x)};return(w||"function"==typeof PromiseRejectionEvent)&&e.then(x)instanceof t}catch(e){}}(),C=function(e,t){return e===t||e===k&&t===r},O=function(e){var t;return!(!d(e)||"function"!=typeof(t=e.then))&&t},S=function(e){return C(k,e)?new M(e):new o(e)},M=o=function(e){var t,n;this.promise=new e(function(e,i){if(void 0!==t||void 0!==n)throw y("Bad Promise constructor");t=e,n=i}),this.resolve=h(t),this.reject=h(n)},j=function(e){try{e()}catch(e){return{error:e}}},T=function(e,t){if(!e._n){e._n=!0;var n=e._c;m(function(){for(var i=e._v,o=1==e._s,r=0,a=function(t){var n,r,a=o?t.ok:t.fail,s=t.resolve,l=t.reject,c=t.domain;try{a?(o||(2==e._h&&D(e),e._h=1),a===!0?n=i:(c&&c.enter(),n=a(i),c&&c.exit()),n===t.promise?l(y("Promise-chain cycle")):(r=O(n))?r.call(n,s,l):s(n)):l(i)}catch(e){l(e)}};n.length>r;)a(n[r++]);e._c=[],e._n=!1,t&&!e._h&&P(e)})}},P=function(e){v.call(s,function(){var t,n,i,o=e._v;if(A(e)&&(t=j(function(){w?_.emit("unhandledRejection",o,e):(n=s.onunhandledrejection)?n({promise:e,reason:o}):(i=s.console)&&i.error&&i.error("Unhandled promise rejection",o)}),e._h=w||A(e)?2:1),e._a=void 0,t)throw t.error})},A=function(e){if(1==e._h)return!1;for(var t,n=e._a||e._c,i=0;n.length>i;)if(t=n[i++],t.fail||!A(t.promise))return!1;return!0},D=function(e){v.call(s,function(){var t;w?_.emit("rejectionHandled",e):(t=s.onrejectionhandled)&&t({promise:e,reason:e._v})})},I=function(e){var t=this;t._d||(t._d=!0,t=t._w||t,t._v=e,t._s=2,t._a||(t._a=t._c.slice()),T(t,!0))},R=function(e){var t,n=this;if(!n._d){n._d=!0,n=n._w||n;try{if(n===e)throw y("Promise can't be resolved itself");(t=O(e))?m(function(){var i={_w:n,_d:!1};try{t.call(e,l(R,i,1),l(I,i,1))}catch(e){I.call(i,e)}}):(n._v=e,n._s=1,T(n,!1))}catch(e){I.call({_w:n,_d:!1},e)}}};E||(k=function(e){f(this,k,b,"_h"),h(e),i.call(this);try{e(l(R,this,1),l(I,this,1))}catch(e){I.call(this,e)}},i=function(e){this._c=[],this._a=void 0,this._s=0,this._d=!1,this._v=void 0,this._h=0,this._n=!1},i.prototype=n(134)(k.prototype,{then:function(e,t){var n=S(g(this,k));return n.ok="function"!=typeof e||e,n.fail="function"==typeof t&&t,n.domain=w?_.domain:void 0,this._c.push(n),this._a&&this._a.push(n),this._s&&T(this,!1),n.promise},catch:function(e){return this.then(void 0,e)}}),M=function(){var e=new i;this.promise=e,this.resolve=l(R,e,1),this.reject=l(I,e,1)}),u(u.G+u.W+u.F*!E,{Promise:k}),n(27)(k,b),n(136)(b),r=n(16)[b],u(u.S+u.F*!E,b,{reject:function(e){var t=S(this),n=t.reject;return n(e),t.promise}}),u(u.S+u.F*(a||!E),b,{resolve:function(e){if(e instanceof k&&C(e.constructor,this))return e;var t=S(this),n=t.resolve;return n(e),t.promise}}),u(u.S+u.F*!(E&&n(126)(function(e){k.all(e).catch(x)})),b,{all:function(e){var t=this,n=S(t),i=n.resolve,o=n.reject,r=j(function(){var n=[],r=0,a=1;p(e,!1,function(e){var s=r++,l=!1;n.push(void 0),a++,t.resolve(e).then(function(e){l||(l=!0,n[s]=e,--a||i(n))},o)}),--a||i(n)});return r&&o(r.error),n.promise},race:function(e){var t=this,n=S(t),i=n.reject,o=j(function(){p(e,!1,function(e){t.resolve(e).then(n.resolve,i)})});return o&&i(o.error),n.promise}})},function(e,t,n){"use strict";var i=n(138)(!0);n(37)(String,"String",function(e){this._t=String(e),this._i=0},function(){var e,t=this._t,n=this._i;return n>=t.length?{value:void 0,done:!0}:(e=i(t,n),this._i+=e.length,{value:e,done:!1})})},function(e,t,n){n(143);for(var i=n(9),o=n(12),r=n(18),a=n(7)("toStringTag"),s=["NodeList","DOMTokenList","MediaList","StyleSheetList","CSSRuleList"],l=0;l<5;l++){var c=s[l],u=i[c],d=u&&u.prototype;d&&!d[a]&&o(d,a,c),r[c]=r.Array}},function(e,t){},function(e,t,n){/*! * Toast UI Colorpicker * @version 2.2.0 * @author NHNEnt FE Development Team From 1b9a9dfff7faf41c9338ba199dfa37392704311f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B9=80=EC=A7=84=EC=9A=B0?= Date: Mon, 22 Oct 2018 11:58:04 +0900 Subject: [PATCH 07/10] chore: version up - v3.2.2 --- dist/tui-image-editor.css | 2 +- dist/tui-image-editor.js | 128 ++++++++++++++++++++++------------ dist/tui-image-editor.min.css | 2 +- dist/tui-image-editor.min.js | 14 ++-- 4 files changed, 93 insertions(+), 53 deletions(-) diff --git a/dist/tui-image-editor.css b/dist/tui-image-editor.css index 88205318d..a6a3ab6fb 100644 --- a/dist/tui-image-editor.css +++ b/dist/tui-image-editor.css @@ -1,6 +1,6 @@ /*! * tui-image-editor.js - * @version 3.2.1 + * @version 3.2.2 * @author NHNEnt FE Development Lab * @license MIT */ diff --git a/dist/tui-image-editor.js b/dist/tui-image-editor.js index 337c506b3..adbcff886 100644 --- a/dist/tui-image-editor.js +++ b/dist/tui-image-editor.js @@ -1,6 +1,6 @@ /*! * tui-image-editor.js - * @version 3.2.1 + * @version 3.2.2 * @author NHNEnt FE Development Lab * @license MIT */ @@ -651,6 +651,9 @@ return /******/ (function(modules) { // webpackBootstrap * @param {Object} [options.includeUI.theme] - Theme object * @param {Array} [options.includeUI.menu] - It can be selected when only specific menu is used. [default all] * @param {string} [options.includeUI.initMenu] - The first menu to be selected and started. + * @param {Object} [options.includeUI.uiSize] - ui size of editor + * @param {string} options.includeUI.uiSize.width - width of ui + * @param {string} options.includeUI.uiSize.height - height of ui * @param {string} [options.includeUI.menuBarPosition=bottom] - Menu bar position [top | bottom | left | right] * @param {number} options.cssMaxWidth - Canvas css-max-width * @param {number} options.cssMaxHeight - Canvas css-max-height @@ -667,6 +670,10 @@ return /******/ (function(modules) { // webpackBootstrap * theme: blackTheme, // or whiteTheme * menu: ['shape', 'filter'], * initMenu: 'filter', + * uiSize: { + * width: '1000px', + * height: '700px' + * }, * menuBarPosition: 'bottom' * }, * cssMaxWidth: 700, @@ -4563,22 +4570,12 @@ return /******/ (function(modules) { // webpackBootstrap * send hostname */ sendHostName: function sendHostName() { - var _location = location, - hostname = _location.hostname; - if (hostnameSent) { return; } hostnameSent = true; - (0, _tuiCodeSnippet.imagePing)('https://www.google-analytics.com/collect', { - v: 1, - t: 'event', - tid: 'UA-115377265-9', - cid: hostname, - dp: hostname, - dh: 'image-editor' - }); + (0, _tuiCodeSnippet.sendHostname)('image-editor'); }, @@ -4954,8 +4951,10 @@ return /******/ (function(modules) { // webpackBootstrap * @param {number} option.initMenu - Init start menu * @param {Boolean} [option.menuBarPosition=bottom] - Let * @param {Boolean} [option.applyCropSelectionStyle=false] - Let + * @param {Object} [options.uiSize] - ui size of editor + * @param {string} options.uiSize.width - width of ui + * @param {string} options.uiSize.height - height of ui * @param {Objecdt} actions - ui action instance - * @ignore */ var Ui = function () { @@ -4979,6 +4978,7 @@ return /******/ (function(modules) { // webpackBootstrap this._subMenuElement = null; this._makeUiElement(element); this._setUiSize(); + this._initMenuEvent = false; this._els = { 'undo': this._menuElement.querySelector('#tie-btn-undo'), @@ -4997,6 +4997,7 @@ return /******/ (function(modules) { // webpackBootstrap * Set Default Selection for includeUI * @param {Object} option - imageEditor options * @returns {Object} - extends selectionStyle option + * @ignore */ @@ -5029,6 +5030,15 @@ return /******/ (function(modules) { // webpackBootstrap * @param {Number} resizeInfo.imageSize.oldHeight - old height * @param {Number} resizeInfo.imageSize.newWidth - new width * @param {Number} resizeInfo.imageSize.newHeight - new height + * @example + * // Change the image size and ui size, and change the affected ui state together. + * imageEditor.ui.resizeEditor({ + * imageSize: {oldWidth: 100, oldHeight: 100, newWidth: 700, newHeight: 700}, + * uiSize: {width: 1000, height: 1000} + * }); + * @example + * // Apply the ui state while preserving the previous attribute (for example, if responsive Ui) + * imageEditor.ui.resizeEditor(); */ }, { @@ -5076,6 +5086,7 @@ return /******/ (function(modules) { // webpackBootstrap /** * Change undo button status * @param {Boolean} enableStatus - enabled status + * @ignore */ }, { @@ -5091,6 +5102,7 @@ return /******/ (function(modules) { // webpackBootstrap /** * Change redo button status * @param {Boolean} enableStatus - enabled status + * @ignore */ }, { @@ -5106,6 +5118,7 @@ return /******/ (function(modules) { // webpackBootstrap /** * Change reset button status * @param {Boolean} enableStatus - enabled status + * @ignore */ }, { @@ -5121,6 +5134,7 @@ return /******/ (function(modules) { // webpackBootstrap /** * Change delete-all button status * @param {Boolean} enableStatus - enabled status + * @ignore */ }, { @@ -5136,6 +5150,7 @@ return /******/ (function(modules) { // webpackBootstrap /** * Change delete button status * @param {Boolean} enableStatus - enabled status + * @ignore */ }, { @@ -5381,6 +5396,7 @@ return /******/ (function(modules) { // webpackBootstrap /** * get editor area element * @returns {HTMLElement} editor area html element + * @ignore */ }, { @@ -5389,35 +5405,55 @@ return /******/ (function(modules) { // webpackBootstrap return this._editorElement; } + /** + * Add event for menu items + * @ignore + */ + + }, { + key: 'activeMenuEvent', + value: function activeMenuEvent() { + var _this6 = this; + + if (this._initMenuEvent) { + return; + } + + this._addHelpActionEvent('undo'); + this._addHelpActionEvent('redo'); + this._addHelpActionEvent('reset'); + this._addHelpActionEvent('delete'); + this._addHelpActionEvent('deleteAll'); + + this._addDownloadEvent(); + + _tuiCodeSnippet2.default.forEach(this.options.menu, function (menuName) { + _this6._addMenuEvent(menuName); + _this6._addSubMenuEvent(menuName); + }); + this._initMenu(); + this._initMenuEvent = true; + } + /** * Init canvas + * @ignore */ }, { key: 'initCanvas', value: function initCanvas() { - var _this6 = this; + var _this7 = this; var loadImageInfo = this._getLoadImage(); - if (loadImageInfo) { + if (loadImageInfo.path) { this._actions.main.initLoadImage(loadImageInfo.path, loadImageInfo.name).then(function () { - _this6._addHelpActionEvent('undo'); - _this6._addHelpActionEvent('redo'); - _this6._addHelpActionEvent('reset'); - _this6._addHelpActionEvent('delete'); - _this6._addHelpActionEvent('deleteAll'); - - _this6._addDownloadEvent(); - _this6._addLoadEvent(); - - _tuiCodeSnippet2.default.forEach(_this6.options.menu, function (menuName) { - _this6._addMenuEvent(menuName); - _this6._addSubMenuEvent(menuName); - }); - _this6._initMenu(); + _this7.activeMenuEvent(); }); } + this._addLoadEvent(); + var gridVisual = document.createElement('div'); gridVisual.className = 'tui-image-editor-grid-visual'; var grid = '\n \n \n \n
    '; @@ -5428,7 +5464,7 @@ return /******/ (function(modules) { // webpackBootstrap /** * get editor area element - * @returns {Object} loadimage optionk + * @returns {Object} load image option * @private */ @@ -5443,6 +5479,7 @@ return /******/ (function(modules) { // webpackBootstrap * @param {string} menuName - menu name * @param {boolean} toggle - whether toogle or not * @param {boolean} discardSelection - discard selection + * @ignore */ }, { @@ -6025,14 +6062,14 @@ return /******/ (function(modules) { // webpackBootstrap 'loadButton.backgroundColor': '#fff', 'loadButton.border': '1px solid #ddd', 'loadButton.color': '#222', - 'loadButton.fontFamily': '"Noto Sans", sans-serif', + 'loadButton.fontFamily': '\'Noto Sans\', sans-serif', 'loadButton.fontSize': '12px', // download button 'downloadButton.backgroundColor': '#fdba3b', 'downloadButton.border': '1px solid #fdba3b', 'downloadButton.color': '#fff', - 'downloadButton.fontFamily': '"Noto Sans", sans-serif', + 'downloadButton.fontFamily': '\'Noto Sans\', sans-serif', 'downloadButton.fontSize': '12px', // main icons @@ -6048,34 +6085,36 @@ return /******/ (function(modules) { // webpackBootstrap 'menu.iconSize.height': '24px', // submenu primary color - 'submenu.backgroundColor': 'transparent', - 'submenu.partition.color': '#858585', + 'submenu.backgroundColor': '#1e1e1e', + 'submenu.partition.color': '#3c3c3c', // submenu icons - 'submenu.normalIcon.path': 'icon-a.svg', - 'submenu.normalIcon.name': 'icon-a', + 'submenu.normalIcon.path': 'icon-d.svg', + 'submenu.normalIcon.name': 'icon-d', 'submenu.activeIcon.path': 'icon-c.svg', 'submenu.activeIcon.name': 'icon-c', 'submenu.iconSize.width': '32px', 'submenu.iconSize.height': '32px', // submenu labels - 'submenu.normalLabel.color': '#858585', + 'submenu.normalLabel.color': '#8a8a8a', 'submenu.normalLabel.fontWeight': 'lighter', 'submenu.activeLabel.color': '#fff', 'submenu.activeLabel.fontWeight': 'lighter', // checkbox style - 'checkbox.border': '1px solid #ccc', + 'checkbox.border': '0px', 'checkbox.backgroundColor': '#fff', - // rango style + // range style 'range.pointer.color': '#fff', 'range.bar.color': '#666', 'range.subbar.color': '#d1d1d1', - 'range.disabledPointer.color': 'red', - 'range.disabledBar.color': 'blue', - 'range.disabledSubbar.color': 'red', + + 'range.disabledPointer.color': '#414141', + 'range.disabledBar.color': '#282828', + 'range.disabledSubbar.color': '#414141', + 'range.value.color': '#fff', 'range.value.fontWeight': 'lighter', 'range.value.fontSize': '11px', @@ -11926,10 +11965,11 @@ return /******/ (function(modules) { // webpackBootstrap } _this.ui.initializeImgUrl = URL.createObjectURL(file); - _this.loadImageFromFile(file).then(function () { + _this.loadImageFromFile(file).then(function (sizeValue) { exitCropOnAction(); _this.clearUndoStack(); - _this.ui.resizeEditor(); + _this.ui.activeMenuEvent(); + _this.ui.resizeEditor({ imageSize: sizeValue }); })['catch'](function (message) { return Promise.reject(message); }); diff --git a/dist/tui-image-editor.min.css b/dist/tui-image-editor.min.css index 9fd50b180..4e62444ea 100644 --- a/dist/tui-image-editor.min.css +++ b/dist/tui-image-editor.min.css @@ -1,6 +1,6 @@ /*! * tui-image-editor.min.js - * @version 3.2.1 + * @version 3.2.2 * @author NHNEnt FE Development Lab * @license MIT */ diff --git a/dist/tui-image-editor.min.js b/dist/tui-image-editor.min.js index fcec29d2e..8e14ace93 100644 --- a/dist/tui-image-editor.min.js +++ b/dist/tui-image-editor.min.js @@ -1,12 +1,12 @@ /*! * tui-image-editor.min.js - * @version 3.2.1 + * @version 3.2.2 * @author NHNEnt FE Development Lab * @license MIT */ -!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("tui-code-snippet"),require("fabric/dist/fabric.require")):"function"==typeof define&&define.amd?define(["tui-code-snippet","fabric/dist/fabric.require"],t):"object"==typeof exports?exports.ImageEditor=t(require("tui-code-snippet"),require("fabric/dist/fabric.require")):(e.tui=e.tui||{},e.tui.ImageEditor=t(e.tui&&e.tui.util,e.fabric))}(this,function(e,t){return function(e){function t(i){if(n[i])return n[i].exports;var o=n[i]={exports:{},id:i,loaded:!1};return e[i].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var n={};return t.m=e,t.c=n,t.p="dist",t(0)}([function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}n(91);var o=n(88),r=i(o);n(148),n(45),n(46),n(47),n(48),n(49),n(50),n(51),n(52),n(53),n(54),n(55),n(56),n(57),n(58),n(59),n(60),n(61),n(63),n(62),e.exports=r.default},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(5),r=i(o);e.exports={componentNames:r.default.keyMirror("IMAGE_LOADER","CROPPER","FLIP","ROTATION","FREE_DRAWING","LINE","TEXT","ICON","FILTER","SHAPE"),commandNames:{CLEAR_OBJECTS:"clearObjects",LOAD_IMAGE:"loadImage",FLIP_IMAGE:"flip",ROTATE_IMAGE:"rotate",ADD_OBJECT:"addObject",REMOVE_OBJECT:"removeObject",APPLY_FILTER:"applyFilter",REMOVE_FILTER:"removeFilter",ADD_ICON:"addIcon",CHANGE_ICON_COLOR:"changeIconColor",ADD_SHAPE:"addShape",CHANGE_SHAPE:"changeShape",ADD_TEXT:"addText",CHANGE_TEXT:"changeText",CHANGE_TEXT_STYLE:"changeTextStyle",ADD_IMAGE_OBJECT:"addImageObject",RESIZE_CANVAS_DIMENSION:"resizeCanvasDimension",SET_OBJECT_PROPERTIES:"setObjectProperties",SET_OBJECT_POSITION:"setObjectPosition"},eventNames:{OBJECT_ACTIVATED:"objectActivated",OBJECT_MOVED:"objectMoved",OBJECT_SCALED:"objectScaled",OBJECT_CREATED:"objectCreated",TEXT_EDITING:"textEditing",TEXT_CHANGED:"textChanged",ICON_CREATE_RESIZE:"iconCreateResize",ICON_CREATE_END:"iconCreateEnd",ADD_TEXT:"addText",ADD_OBJECT:"addObject",ADD_OBJECT_AFTER:"addObjectAfter",MOUSE_DOWN:"mousedown",MOUSE_UP:"mouseup",MOUSE_MOVE:"mousemove",REDO_STACK_CHANGED:"redoStackChanged",UNDO_STACK_CHANGED:"undoStackChanged",SELECTION_CLEARED:"selectionCleared",SELECTION_CREATED:"selectionCreated"},drawingModes:r.default.keyMirror("NORMAL","CROPPER","FREE_DRAWING","LINE_DRAWING","TEXT","SHAPE"),keyCodes:{Z:90,Y:89,SHIFT:16,BACKSPACE:8,DEL:46},fObjectOptions:{SELECTION_STYLE:{borderColor:"red",cornerColor:"green",cornerSize:10,originX:"center",originY:"center",transparentCorners:!1}},rejectMessages:{flip:"The flipX and flipY setting values are not changed.",rotation:"The current angle is same the old angle.",loadImage:"The background image is empty.",isLock:"The executing command state is locked.",undo:"The promise of undo command is reject.",redo:"The promise of redo command is reject.",invalidDrawingMode:"This operation is not supported in the drawing mode",invalidParameters:"Invalid parameters",noActiveObject:"There is no active object.",unsupportedType:"Unsupported object type",noObject:"The object is not in canvas.",addedObject:"The object is already added."},defaultIconPath:{"icon-arrow":"M40 12V0l24 24-24 24V36H0V12h40z","icon-arrow-2":"M49,32 H3 V22 h46 l-18,-18 h12 l23,23 L43,50 h-12 l18,-18 z ","icon-arrow-3":"M43.349998,27 L17.354,53 H1.949999 l25.996,-26 L1.949999,1 h15.404 L43.349998,27 z ","icon-star":"M35,54.557999 l-19.912001,10.468 l3.804,-22.172001 l-16.108,-15.7 l22.26,-3.236 L35,3.746 l9.956,20.172001 l22.26,3.236 l-16.108,15.7 l3.804,22.172001 z ","icon-star-2":"M17,31.212 l-7.194,4.08 l-4.728,-6.83 l-8.234,0.524 l-1.328,-8.226 l-7.644,-3.14 l2.338,-7.992 l-5.54,-6.18 l5.54,-6.176 l-2.338,-7.994 l7.644,-3.138 l1.328,-8.226 l8.234,0.522 l4.728,-6.83 L17,-24.312 l7.194,-4.08 l4.728,6.83 l8.234,-0.522 l1.328,8.226 l7.644,3.14 l-2.338,7.992 l5.54,6.178 l-5.54,6.178 l2.338,7.992 l-7.644,3.14 l-1.328,8.226 l-8.234,-0.524 l-4.728,6.83 z ","icon-polygon":"M3,31 L19,3 h32 l16,28 l-16,28 H19 z ","icon-location":"M24 62C8 45.503 0 32.837 0 24 0 10.745 10.745 0 24 0s24 10.745 24 24c0 8.837-8 21.503-24 38zm0-28c5.523 0 10-4.477 10-10s-4.477-10-10-10-10 4.477-10 10 4.477 10 10 10z","icon-heart":"M49.994999,91.349998 l-6.96,-6.333 C18.324001,62.606995 2.01,47.829002 2.01,29.690998 C2.01,14.912998 13.619999,3.299999 28.401001,3.299999 c8.349,0 16.362,5.859 21.594,12 c5.229,-6.141 13.242001,-12 21.591,-12 c14.778,0 26.390999,11.61 26.390999,26.390999 c0,18.138 -16.314001,32.916 -41.025002,55.374001 l-6.96,6.285 z ","icon-bubble":"M44 48L34 58V48H12C5.373 48 0 42.627 0 36V12C0 5.373 5.373 0 12 0h40c6.627 0 12 5.373 12 12v24c0 6.627-5.373 12-12 12h-8z"},defaultRotateRangeValus:{realTimeEvent:!0,min:-360,max:360,value:0},defaultDrawRangeValus:{min:5,max:30,value:12},defaultShapeStrokeValus:{realTimeEvent:!1,min:2,max:300,value:3},defaultTextRangeValus:{realTimeEvent:!0,min:10,max:100,value:50},defaultFilterRangeValus:{tintOpacityRange:{min:0,max:1,value:.7},removewhiteThresholdRange:{min:0,max:255,value:60},removewhiteDistanceRange:{min:0,max:255,value:10},gradientTransparencyRange:{min:0,max:255,value:100},brightnessRange:{min:-255,max:255,value:100},noiseRange:{min:0,max:1e3,value:100},pixelateRange:{min:2,max:20,value:4},colorfilterThresholeRange:{min:0,max:255,value:45}}}},function(e,t,n){n(144),n(146),n(147),n(145),e.exports=n(16).Promise},function(t,n){t.exports=e},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e){var t=l[e];if(t){for(var n=arguments.length,i=Array(n>1?n-1:0),o=1;on&&(i=t,t=n,n=i),r(t,o(e,n))},keyMirror:function(){for(var e={},t=arguments.length,n=Array(t),o=0;o1&&void 0!==arguments[1]?arguments[1]:"#7e7e7e",i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"up";o(this,e);var r=t.getAttribute("title");this._show=!1,this._colorpickerElement=t,this._toggleDirection=i,this._makePickerButtonElement(t,n),this._makePickerLayerElement(t,r),this._color=n,this.picker=c.default.create({container:this.pickerElement,preset:u,color:n}),this._addEvent(t)}return r(e,[{key:"_changeColorElement",value:function(e){e?(this.colorElement.classList.remove("transparent"),this.colorElement.style.backgroundColor=e):(this.colorElement.style.backgroundColor="#fff",this.colorElement.classList.add("transparent"))}},{key:"_makePickerButtonElement",value:function(e,t){e.classList.add("tui-image-editor-button"),this.colorElement=document.createElement("div"),this.colorElement.className="color-picker-value",t?this.colorElement.style.backgroundColor=t:this.colorElement.classList.add("transparent")}},{key:"_makePickerLayerElement",value:function(e,t){var n=document.createElement("label"),i=document.createElement("div");this.pickerControl=document.createElement("div"),this.pickerControl.className="color-picker-control",this.pickerElement=document.createElement("div"),this.pickerElement.className="color-picker",n.innerHTML=t,i.className="triangle",this.pickerControl.appendChild(this.pickerElement),this.pickerControl.appendChild(i),e.appendChild(this.pickerControl),e.appendChild(this.colorElement),e.appendChild(n)}},{key:"_addEvent",value:function(e){var t=this;this.picker.on("selectColor",function(e){t._changeColorElement(e.color),t._color=e.color,t.fire("change",e.color)}),e.addEventListener("click",function(e){t._show=!t._show,t.pickerControl.style.display=t._show?"block":"none",t._setPickerControlPosition(),t.fire("changeShow",t),e.stopPropagation()}),document.body.addEventListener("click",function(){t.hide()})}},{key:"hide",value:function(){this._show=!1,this.pickerControl.style.display="none"}},{key:"_setPickerControlPosition",value:function(){var e=this.pickerControl.style,t=this._colorpickerElement.clientWidth/2+2,n=this.pickerControl.offsetWidth/2-t,i=(this.pickerControl.offsetHeight+10)*-1;"down"===this._toggleDirection&&(i=30),e.top=i+"px",e.left="-"+n+"px"}},{key:"color",get:function(){return this._color},set:function(e){this._color=e,this._changeColorElement(e)}}]),e}();s.default.CustomEvents.mixin(d),t.default=d},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var r=function(){function e(e,t){for(var n=0;n1&&void 0!==arguments[1]?arguments[1]:{};o(this,e),this._value=n.value||0,this.rangeElement=t,this._drawRangeElement(),this.rangeWidth=(0,l.toInteger)(window.getComputedStyle(t,null).width)-12,this._min=n.min||0,this._max=n.max||100,this._absMax=this._min*-1+this._max,this.realTimeEvent=n.realTimeEvent||!1,this._addClickEvent(),this._addDragEvent(),this.value=n.value,this.trigger("change")}return r(e,[{key:"trigger",value:function(e){this.fire(e,this._value)}},{key:"_drawRangeElement",value:function(){this.rangeElement.classList.add("tui-image-editor-range"),this.bar=document.createElement("div"),this.bar.className="tui-image-editor-virtual-range-bar",this.subbar=document.createElement("div"),this.subbar.className="tui-image-editor-virtual-range-subbar",this.pointer=document.createElement("div"),this.pointer.className="tui-image-editor-virtual-range-pointer",this.bar.appendChild(this.subbar),this.bar.appendChild(this.pointer),this.rangeElement.appendChild(this.bar)}},{key:"_addClickEvent",value:function(){var e=this;this.rangeElement.addEventListener("click",function(t){if(t.stopPropagation(),"tui-image-editor-range"===t.target.className){var n=t.offsetX,i=n/e.rangeWidth,o=e._absMax*i+e._min;e.pointer.style.left=i*e.rangeWidth+"px",e.subbar.style.right=(1-i)*e.rangeWidth+"px",e._value=o,e.fire("change",o)}})}},{key:"_addDragEvent",value:function(){var e=this;this.pointer.addEventListener("mousedown",function(t){e.firstPosition=t.screenX,e.firstLeft=(0,l.toInteger)(e.pointer.style.left)||0,e.dragEventHandler={changeAngle:e._changeAngle.bind(e),stopChangingAngle:e._stopChangingAngle.bind(e)},document.addEventListener("mousemove",e.dragEventHandler.changeAngle),document.addEventListener("mouseup",e.dragEventHandler.stopChangingAngle)})}},{key:"_changeAngle",value:function(e){var t=e.screenX,n=t-this.firstPosition,i=this.firstLeft+n;i=i>this.rangeWidth?this.rangeWidth:i,i=i<0?0:i,this.pointer.style.left=i+"px",this.subbar.style.right=this.rangeWidth-i+"px";var o=i/this.rangeWidth,r=this._absMax*o+this._min;this._value=r,this.realTimeEvent&&this.fire("change",r)}},{key:"_stopChangingAngle",value:function(){this.fire("change",this._value),document.removeEventListener("mousemove",this.dragEventHandler.changeAngle),document.removeEventListener("mouseup",this.dragEventHandler.stopChangingAngle)}},{key:"max",set:function(e){this._max=e,this._absMax=this._min*-1+this._max,this.value=this._value},get:function(){return this._max}},{key:"value",get:function(){return this._value},set:function(e){var t=e-this._min,n=t*this.rangeWidth/this._absMax;this.rangeWidth0?i:n)(e)}},function(e,t,n){var i=n(122),o=n(25);e.exports=function(e){return i(o(e))}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(3),r=i(o),a=n(5),s=(0,a.keyMirror)("UN_IMPLEMENTATION","NO_COMPONENT_NAME"),l={UN_IMPLEMENTATION:"Should implement a method: ",NO_COMPONENT_NAME:"Should set a component name"},c={UN_IMPLEMENTATION:function(e){return l.UN_IMPLEMENTATION+e},NO_COMPONENT_NAME:function(){return l.NO_COMPONENT_NAME}};e.exports={types:r.default.extend({},s),create:function(e){e=e.toLowerCase();for(var t=c[e],n=arguments.length,i=Array(n>1?n-1:0),o=1;on;)t.push(arguments[n++]);return v[++g]=function(){s("function"==typeof e?e:Function(e),t)},i(g),g},f=function(e){delete v[e]},"process"==n(19)(d)?i=function(e){d.nextTick(a(b,e,1))}:p?(o=new p,r=o.port2,o.port1.onmessage=y,i=a(r.postMessage,r,1)):u.addEventListener&&"function"==typeof postMessage&&!u.importScripts?(i=function(e){u.postMessage(e+"","*")},u.addEventListener("message",y,!1)):i=m in c("script")?function(e){l.appendChild(c("script"))[m]=function(){l.removeChild(this),b.call(e)}}:function(e){setTimeout(a(b,e,1),0)}),e.exports={set:h,clear:f}},function(e,t,n){var i=n(29),o=Math.min;e.exports=function(e){return e>0?o(i(e),9007199254740991):0}},function(e,t){var n=0,i=Math.random();e.exports=function(e){return"Symbol(".concat(void 0===e?"":e,")_",(++n+i).toString(36))}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0});var o=n(3),r=n(5),a=i(r),s=n(86),l=i(s);t.default={getActions:function(){return{main:this._mainAction(),shape:this._shapeAction(),crop:this._cropAction(),flip:this._flipAction(),rotate:this._rotateAction(),text:this._textAction(),mask:this._maskAction(),draw:this._drawAction(),icon:this._iconAction(),filter:this._filterAction()}},_mainAction:function(){var e=this,t=function(){"crop"===e.ui.submenu&&(e.stopDrawingMode(),e.ui.changeMenu("crop"))};return(0,o.extend)({initLoadImage:function(n,i){return e.loadImageFromURL(n,i).then(function(i){t(),e.ui.initializeImgUrl=n,e.ui.resizeEditor({imageSize:i}),e.clearUndoStack()})},undo:function(){e.isEmptyUndoStack()||(t(),e.undo())},redo:function(){e.isEmptyRedoStack()||(t(),e.redo())},reset:function(){t(),e.loadImageFromURL(e.ui.initializeImgUrl,"resetImage").then(function(n){t(),e.ui.resizeEditor({imageSize:n}),e.clearUndoStack()})},delete:function(){e.ui.changeDeleteButtonEnabled(!1),t(),e.removeActiveObject(),e.activeObjectId=null},deleteAll:function(){t(),e.clearObjects(),e.ui.changeDeleteButtonEnabled(!1),e.ui.changeDeleteAllButtonEnabled(!1)},load:function(n){a.default.isSupportFileApi()||alert("This browser does not support file-api"),e.ui.initializeImgUrl=URL.createObjectURL(n),e.loadImageFromFile(n).then(function(){t(),e.clearUndoStack(),e.ui.resizeEditor()}).catch(function(e){return Promise.reject(e)})},download:function(){var t=e.toDataURL(),n=e.getImageName(),i=void 0,o=void 0,r=void 0;a.default.isSupportFileApi()&&window.saveAs?(i=a.default.base64ToBlob(t),o=i.type.split("/")[1],n.split(".").pop()!==o&&(n+="."+o),saveAs(i,n)):(r=window.open(),r.document.body.innerHTML="")}},this._commonAction())},_iconAction:function(){var e=this,t=void 0,n=void 0,i=void 0,r=void 0,a=void 0,s=void 0,c=void 0;this.on({iconCreateResize:function(t){var n=t.moveOriginPointer,o=(n.x-i)/a,l=(n.y-r)/s;e.setObjectPropertiesQuietly(c,{scaleX:Math.abs(2*o),scaleY:Math.abs(2*l)})},iconCreateEnd:function(){e.ui.icon.clearIconType(),e.changeSelectableAll(!0)}});var u=function(o,l){i=l.x,r=l.y,e.addIcon(t,{left:l.x,top:l.y,fill:n}).then(function(e){c=e.id,a=e.width,s=e.height})};return(0,o.extend)({changeColor:function(t){e.activeObjectId&&e.changeIconColor(e.activeObjectId,t)},addIcon:function(i,o){t=i,n=o,e.changeCursor("crosshair"),e.off("mousedown"),e.once("mousedown",u.bind(e))},cancelAddIcon:function(){e.off("mousedown"),e.ui.icon.clearIconType(),e.changeSelectableAll(!0),e.changeCursor("default")},registDefalutIcons:function(t,n){var i={};i[t]=n,e.registerIcons(i)},registCustomIcon:function(t,n){var i=new l.default;i.imageToSVG(t,function(t){var i=t.match(/path[^>]*d="([^"]*)"/),o=i[1],r={};r[n.name]=o,e.registerIcons(r),e.addIcon(n.name,{left:100,top:100})},l.default.tracerDefaultOption())}},this._commonAction())},_drawAction:function(){var e=this;return(0,o.extend)({setDrawMode:function(t,n){e.stopDrawingMode(),"free"===t?e.startDrawingMode("FREE_DRAWING",n):e.startDrawingMode("LINE_DRAWING",n)},setColor:function(t){e.setBrush({color:t})}},this._commonAction())},_maskAction:function(){var e=this;return(0,o.extend)({loadImageFromURL:function(t,n){return e.loadImageFromURL(e.toDataURL(),"FilterImage").then(function(){e.addImageObject(t).then(function(){URL.revokeObjectURL(n)})})},applyFilter:function(){e.applyFilter("mask",{maskObjId:e.activeObjectId})}},this._commonAction())},_textAction:function(){var e=this;return(0,o.extend)({changeTextStyle:function(t){e.activeObjectId&&e.changeTextStyle(e.activeObjectId,t)}},this._commonAction())},_rotateAction:function(){var e=this;return(0,o.extend)({rotate:function(t){e.rotate(t),e.ui.resizeEditor()},setAngle:function(t){e.setAngle(t),e.ui.resizeEditor()}},this._commonAction())},_shapeAction:function(){var e=this;return(0,o.extend)({changeShape:function(t){e.activeObjectId&&e.changeShape(e.activeObjectId,t)},setDrawingShape:function(t){e.setDrawingShape(t)}},this._commonAction())},_cropAction:function(){var e=this;return(0,o.extend)({crop:function(){var t=e.getCropzoneRect();t&&e.crop(t).then(function(){e.stopDrawingMode(),e.ui.resizeEditor(),e.ui.changeMenu("crop")}).catch(function(e){return Promise.reject(e)})},cancel:function(){e.stopDrawingMode(),e.ui.changeMenu("crop")}},this._commonAction())},_flipAction:function(){var e=this;return(0,o.extend)({flip:function(t){return e[t]()}},this._commonAction())},_filterAction:function(){var e=this;return(0,o.extend)({applyFilter:function(t,n,i){t?e.applyFilter(n,i):e.hasFilter(n)&&e.removeFilter(n)}},this._commonAction())},setReAction:function(){var e=this;this.on({undoStackChanged:function(t){t?(e.ui.changeUndoButtonStatus(!0),e.ui.changeResetButtonStatus(!0)):(e.ui.changeUndoButtonStatus(!1),e.ui.changeResetButtonStatus(!1)),e.ui.resizeEditor()},redoStackChanged:function(t){t?e.ui.changeRedoButtonStatus(!0):e.ui.changeRedoButtonStatus(!1),e.ui.resizeEditor()},objectActivated:function(t){e.activeObjectId=t.id,e.ui.changeDeleteButtonEnabled(!0),e.ui.changeDeleteAllButtonEnabled(!0),"cropzone"===t.type?e.ui.crop.changeApplyButtonStatus(!0):["rect","circle","triangle"].indexOf(t.type)>-1?(e.stopDrawingMode(),"shape"!==e.ui.submenu&&e.ui.changeMenu("shape",!1,!1),e.ui.shape.setShapeStatus({strokeColor:t.stroke,strokeWidth:t.strokeWidth,fillColor:t.fill}),e.ui.shape.setMaxStrokeValue(Math.min(t.width,t.height))):"path"===t.type||"line"===t.type?"draw"!==e.ui.submenu&&(e.ui.changeMenu("draw",!1,!1),e.ui.draw.changeStandbyMode()):["i-text","text"].indexOf(t.type)>-1?"text"!==e.ui.submenu&&e.ui.changeMenu("text",!1,!1):"icon"===t.type&&(e.stopDrawingMode(),"icon"!==e.ui.submenu&&e.ui.changeMenu("icon",!1,!1),e.ui.icon.setIconPickerColor(t.fill))},addText:function(t){e.addText("Double Click",{position:t.originPosition,styles:{fill:e.ui.text.textColor,fontSize:a.default.toInteger(e.ui.text.fontSize),fontFamily:"Noto Sans"}}).then(function(){e.changeCursor("default")})},addObjectAfter:function(t){["rect","circle","triangle"].indexOf(t.type)>-1&&(e.ui.shape.setMaxStrokeValue(Math.min(t.width,t.height)),e.ui.shape.changeStandbyMode())},objectScaled:function(t){if(["i-text","text"].indexOf(t.type)>-1)e.ui.text.fontSize=a.default.toInteger(t.fontSize);else if(["rect","circle","triangle"].indexOf(t.type)>=0){var n=t.width,i=t.height,o=e.ui.shape.getStrokeValue();nv&&(r.remove(),r.set(this._calcRectDimensionFromPoint(i,o)),t.add(r))}},{key:"_calcRectDimensionFromPoint",value:function(e,t){var n=this.getCanvas(),i=n.getWidth(),o=n.getHeight(),r=this._startX,a=this._startY,s=(0,g.clamp)(e,0,r),l=(0,g.clamp)(t,0,a),c=(0,g.clamp)(e,r,i)-s,u=(0,g.clamp)(t,a,o)-l;return this._withShiftKey&&(c>u?u=c:u>c&&(c=u),r>=e&&(s=r-c),a>=t&&(l=a-u)),{left:s,top:l,width:c,height:u}}},{key:"_onFabricMouseUp",value:function(){var e=this._cropzone,t=this._listeners,n=this.getCanvas();n.setActiveObject(e),n.off({"mouse:move":t.mousemove,"mouse:up":t.mouseup})}},{key:"getCroppedImageData",value:function(e){var t=this.getCanvas(),n=t.contains(this._cropzone);if(!e)return null;n&&this._cropzone.remove();var i={imageName:this.getImageName(),url:t.toDataURL(e)};return n&&t.add(this._cropzone),i}},{key:"getCropzoneRect",value:function(){var e=this._cropzone;return e.isValid()?{left:e.getLeft(),top:e.getTop(),width:e.getWidth(),height:e.getHeight()}:null}},{key:"_onKeyDown",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!0)}},{key:"_onKeyUp",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!1)}}]),t}(d.default);e.exports=m},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;n=0,c=n.useDragAddIcon&&l,u=a?n._createIcon(a):null;u||o(y.invalidParameters),u.set(d.default.extend({type:"icon",fill:n._oColor},s,t,n.graphics.controlStyle)),r.add(u).setActiveObject(u),c&&n._addWithDragEvent(r),i(n.graphics.createObjectProperties(u))})}},{key:"_addWithDragEvent",value:function(e){var t=this;e.on({"mouse:move":function(n){e.selection=!1,t.fire(b.ICON_CREATE_RESIZE,{moveOriginPointer:e.getPointer(n.e)})},"mouse:up":function(n){t.fire(b.ICON_CREATE_END,{moveOriginPointer:e.getPointer(n.e)}),e.defaultCursor="default",e.off("mouse:up"),e.off("mouse:move"),e.selection=!0}})}},{key:"registerPaths",value:function(e){var t=this;d.default.forEach(e,function(e,n){t._pathMap[n]=e},this)}},{key:"setColor",value:function(e,t){this._oColor=e,t&&"icon"===t.get("type")&&(t.setFill(this._oColor),this.getCanvas().renderAll())}},{key:"getColor",value:function(e){return e.fill}},{key:"_createIcon",value:function(e){return new c.default.Path(e)}}]),t}(g.default);e.exports=k},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;nn},_getColor:function(e,t,n){var i=[0,0,0,0],o=e.data,r=e.width,a=4,s=(r*n+t)*a;return i[0]=o[s],i[1]=o[s+1],i[2]=o[s+2],i[3]=o[s+3],i}});e.exports=a},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(3),r=i(o),a=n(6),s=i(a),l=n(5),c="tl",u="tr",d="mt",h="ml",f="mr",p="mb",g="bl",v="br",m=s.default.util.createClass(s.default.Rect,{initialize:function(e,t){e=r.default.extend(e,t),e.type="cropzone",this.callSuper("initialize",e),this.options=e,this.on({moving:this._onMoving,scaling:this._onScaling})},_render:function(e){var t=7,n=7;this.callSuper("_render",e);var i=this.flipX?-1:1,o=this.flipY?-1:1,r=i/this.scaleX,a=o/this.scaleY;e.scale(r,a),this._fillOuterRect(e,"rgba(0, 0, 0, 0.55)"),this.options.lineWidth?(this._fillInnerRect(e),this._strokeBorder(e,"rgb(255, 255, 255)",{lineWidth:this.options.lineWidth})):(this._strokeBorder(e,"rgb(0, 0, 0)",{lineDashWidth:t}),this._strokeBorder(e,"rgb(255, 255, 255)",{lineDashWidth:t,lineDashOffset:n})),e.scale(1/r,1/a)},_fillOuterRect:function(e,t){var n=this._getCoordinates(e),i=n.x,o=n.y;e.save(),e.fillStyle=t,e.beginPath(),e.moveTo(i[0]-1,o[0]-1),e.lineTo(i[3]+1,o[0]-1),e.lineTo(i[3]+1,o[3]+1),e.lineTo(i[0]-1,o[3]+1),e.lineTo(i[0]-1,o[0]-1),e.closePath(),e.moveTo(i[1],o[1]),e.lineTo(i[1],o[2]),e.lineTo(i[2],o[2]),e.lineTo(i[2],o[1]),e.lineTo(i[1],o[1]),e.closePath(),e.fill(),e.restore()},_fillInnerRect:function(e){var t=this._getCoordinates(e),n=t.x,i=t.y,o=this._caculateInnerPosition(n,(n[2]-n[1])/3),r=this._caculateInnerPosition(i,(i[2]-i[1])/3);e.save(),e.strokeStyle="rgba(255, 255, 255, 0.7)",e.lineWidth=this.options.lineWidth,e.beginPath(),e.moveTo(o[0],r[1]),e.lineTo(o[3],r[1]),e.moveTo(o[0],r[2]),e.lineTo(o[3],r[2]),e.moveTo(o[1],r[0]),e.lineTo(o[1],r[3]),e.moveTo(o[2],r[0]),e.lineTo(o[2],r[3]),e.stroke(),e.closePath(),e.restore()},_caculateInnerPosition:function(e,t){var n=[];return n[0]=e[1],n[1]=e[1]+t,n[2]=e[1]+2*t,n[3]=e[2],n},_getCoordinates:function(e){var t=this.getWidth(),n=this.getHeight(),i=t/2,o=n/2,a=this.getLeft(),s=this.getTop(),l=e.canvas;return{x:r.default.map([-(i+a),-i,i,i+(l.width-a-t)],Math.ceil),y:r.default.map([-(o+s),-o,o,o+(l.height-s-n)],Math.ceil)}},_strokeBorder:function(e,t,n){var i=n.lineDashWidth,o=n.lineDashOffset,r=n.lineWidth,a=this.getWidth()/2,s=this.getHeight()/2;e.save(),e.strokeStyle=t,e.setLineDash&&e.setLineDash([i,i]),o&&(e.lineDashOffset=o),r&&(e.lineWidth=r),e.beginPath(),e.moveTo(-a,-s),e.lineTo(a,-s),e.lineTo(a,s),e.lineTo(-a,s),e.lineTo(-a,-s),e.stroke(),e.restore()},_onMoving:function(){var e=this.getLeft(),t=this.getTop(),n=this.getWidth(),i=this.getHeight(),o=this.canvas.getWidth()-n,r=this.canvas.getHeight()-i;this.setLeft((0,l.clamp)(e,0,o)),this.setTop((0,l.clamp)(t,0,r))},_onScaling:function(e){var t=this.canvas.getPointer(e.e),n=this._calcScalingSizeFromPointer(t);this.scale(1).set(n)},_calcScalingSizeFromPointer:function(e){var t=e.x,n=e.y,i=this._calcTopLeftScalingSizeFromPointer(t,n),o=this._calcBottomRightScalingSizeFromPointer(t,n);return this._makeScalingSettings(i,o)},_calcTopLeftScalingSizeFromPointer:function(e,t){var n=this.getHeight()+this.top,i=this.getWidth()+this.left,o=(0,l.clamp)(t,0,n-1),r=(0,l.clamp)(e,0,i-1);return{top:o,left:r,width:i-r,height:n-o}},_calcBottomRightScalingSizeFromPointer:function(e,t){var n=this.canvas,i=n.width,o=n.height,r=this.left,a=this.top;return{width:(0,l.clamp)(e,r+1,i)-r,height:(0,l.clamp)(t,a+1,o)-a}},_makeScalingSettings:function(e,t){var n=e.width,i=e.height,o=t.height,r=t.width,a=e.left,s=e.top,l=void 0;switch(this.__corner){case c:l=e;break;case u:l={width:r,height:i,top:s};break;case g:l={width:n,height:o,left:a};break;case v:l=t;break;case h:l={width:n,left:a};break;case d:l={height:i,top:s};break;case f:l={width:r};break;case p:l={height:o}}return l},isValid:function(){return this.left>=0&&this.top>=0&&this.width>0&&this.height>0}});e.exports=m},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(6),r=i(o),a=r.default.util.createClass(r.default.Image.filters.Convolute,{type:"Emboss",initialize:function(){var e=[1,1,1,1,.7,-1,-1,-1,-1];this.matrix=e}});e.exports=a},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(6),r=i(o),a=r.default.util.createClass(r.default.Image.filters.Mask,{applyTo:function(e){if(this.mask){var t=e.width,n=e.height,i=this._createCanvasOfMask(t,n),o=e.getContext("2d"),r=i.getContext("2d"),a=o.getImageData(0,0,t,n);this._drawMask(r,e,o),this._mapData(r,a,t,n),o.putImageData(a,0,0)}},_createCanvasOfMask:function(e,t){var n=r.default.util.createCanvasElement();return n.width=e,n.height=t,n},_drawMask:function(e){var t=this.mask,n=t.getElement(),i=t.getLeft(),o=t.getTop(),r=t.getAngle();e.save(),e.translate(i,o),e.rotate(r*Math.PI/180),e.scale(t.scaleX,t.scaleY),e.drawImage(n,-n.width/2,-n.height/2),e.restore()},_mapData:function(e,t,n,i){for(var o=t.data,r=e.getImageData(0,0,n,i).data,a=this.channel,s=t.width*t.height*4,l=0;l1&&void 0!==arguments[1]?arguments[1]:{},i=n.cssMaxWidth,r=n.cssMaxHeight,a=n.useItext,s=void 0!==a&&a,l=n.useDragAddIcon,c=void 0!==l&&l;o(this,e),this.canvasImage=null,this.cssMaxWidth=i||ie,this.cssMaxHeight=r||oe,this.useItext=s,this.useDragAddIcon=c,this.cropSelectionStyle={},this.imageName="",this._objects={},this._canvas=null,this._drawingMode=q.NORMAL,this._drawingModeMap={},this._componentMap={},this._handler={onMouseDown:this._onMouseDown.bind(this),onObjectAdded:this._onObjectAdded.bind(this),onObjectRemoved:this._onObjectRemoved.bind(this),onObjectMoved:this._onObjectMoved.bind(this),onObjectScaled:this._onObjectScaled.bind(this),onObjectSelected:this._onObjectSelected.bind(this),onPathCreated:this._onPathCreated.bind(this),onSelectionCleared:this._onSelectionCleared.bind(this),onSelectionCreated:this._onSelectionCreated.bind(this)},this._setCanvasElement(t),this._createDrawingModeInstances(),this._createComponents(),this._attachCanvasEvents()}return r(e,[{key:"destroy",value:function(){var e=this._canvas.wrapperEl;this._canvas.clear(),e.parentNode.removeChild(e)}},{key:"deactivateAll",value:function(){return this._canvas.deactivateAll(),this}},{key:"renderAll",value:function(){return this._canvas.renderAll(),this}},{key:"add",value:function(e){var t,n=[];$(e)?n=e:n.push(e),(t=this._canvas).add.apply(t,n)}},{key:"contains",value:function(e){return this._canvas.contains(e)}},{key:"getObjects",value:function(){return this._canvas.getObjects().slice()}},{key:"getObject",value:function(e){return this._objects[e]}},{key:"remove",value:function(e){this._canvas.remove(e)}},{key:"removeAll",value:function(e){var t=this._canvas,n=t.getObjects().slice();return t.remove.apply(t,this._canvas.getObjects()),e&&t.clear(),n}},{key:"removeObjectById",value:function(e){var t=[],n=this._canvas,i=this.getObject(e),o=i&&i.isType("group")&&!i.isEmpty();return o?(n.discardActiveGroup(),i.forEachObject(function(e){t.push(e),e.remove()})):n.contains(i)&&(t.push(i),i.remove()),t}},{key:"getObjectId",value:function(e){var t=null;for(t in this._objects)if(this._objects.hasOwnProperty(t)&&e===this._objects[t])return t;return null}},{key:"getActiveObject",value:function(){return this._canvas.getActiveObject()}},{key:"getActiveGroupObject",value:function(){return this._canvas.getActiveGroup()}},{key:"setActiveObject",value:function(e){this._canvas.setActiveObject(e)}},{key:"setCropSelectionStyle",value:function(e){this.cropSelectionStyle=e}},{key:"getComponent",value:function(e){return this._componentMap[e]}},{key:"getDrawingMode",value:function(){return this._drawingMode}},{key:"startDrawingMode",value:function(e,t){if(this._isSameDrawingMode(e))return!0;this.stopDrawingMode();var n=this._getDrawingModeInstance(e);return n&&n.start&&(n.start(this,t),this._drawingMode=e),!!n}},{key:"stopDrawingMode",value:function(){if(!this._isSameDrawingMode(q.NORMAL)){var e=this._getDrawingModeInstance(this.getDrawingMode());e&&e.end&&e.end(this),this._drawingMode=q.NORMAL}}},{key:"toDataURL",value:function(e){return this._canvas&&this._canvas.toDataURL(e)}},{key:"setCanvasImage",value:function(e,t){t&&Z(t),this.imageName=e,this.canvasImage=t}},{key:"setCssMaxDimension",value:function(e){this.cssMaxWidth=e.width||this.cssMaxWidth,this.cssMaxHeight=e.height||this.cssMaxHeight}},{key:"adjustCanvasDimension",value:function(){var e=this.canvasImage.scale(1),t=e.getBoundingRect(),n=t.width,i=t.height,o=this._calcMaxDimension(n,i);this.setCanvasCssDimension({width:"100%",height:"100%","max-width":o.width+"px","max-height":o.height+"px"}),this.setCanvasBackstoreDimension({width:n,height:i}),this._canvas.centerObject(e)}},{key:"setCanvasCssDimension",value:function(e){this._canvas.setDimensions(e,re)}},{key:"setCanvasBackstoreDimension",value:function(e){this._canvas.setDimensions(e,ae)}},{key:"setImageProperties",value:function(e,t){var n=this.canvasImage;n&&(n.set(e).setCoords(),t&&this._canvas.renderAll())}},{key:"getCanvasElement",value:function(){return this._canvas.getElement()}},{key:"getCanvas",value:function(){return this._canvas}},{key:"getCanvasImage",value:function(){return this.canvasImage}},{key:"getImageName",value:function(){return this.imageName}},{key:"addImageObject",value:function(e){var t=this,n=this._callbackAfterLoadingImageObject.bind(this);return new c.default(function(i){d.default.Image.fromURL(e,function(e){n(e),i(t.createObjectProperties(e))},{crossOrigin:"Anonymous"})})}},{key:"getCenter",value:function(){return this._canvas.getCenter()}},{key:"getCropzoneRect",value:function(){return this.getComponent(G.CROPPER).getCropzoneRect()}},{key:"getCroppedImageData",value:function(e){return this.getComponent(G.CROPPER).getCroppedImageData(e)}},{key:"setBrush",value:function(e){var t=this._drawingMode,n=G.FREE_DRAWING;t===q.LINE&&(n=q.LINE),this.getComponent(n).setBrush(e)}},{key:"setDrawingShape",value:function(e,t){this.getComponent(G.SHAPE).setStates(e,t)}},{key:"registerPaths",value:function(e){this.getComponent(G.ICON).registerPaths(e)}},{key:"changeCursor",value:function(e){var t=this.getCanvas();t.defaultCursor=e,t.renderAll()}},{key:"hasFilter",value:function(e){return this.getComponent(G.FILTER).hasFilter(e)}},{key:"setSelectionStyle",value:function(e){J(K.SELECTION_STYLE,e)}},{key:"setObjectProperties",value:function(e,t){var n=this.getObject(e),i=J({},t);return n.set(i),n.setCoords(),this.getCanvas().renderAll(),i}},{key:"getObjectProperties",value:function(e,t){var n=this.getObject(e),i={};return Q(t)?i[t]=n[t]:$(t)?ee(t,function(e){i[e]=n[e]}):te(t,function(e,t){i[t]=n[t]}),i}},{key:"getObjectPosition",value:function(e,t,n){var i=this.getObject(e);return i?i.getPointByOrigin(t,n):null}},{key:"setObjectPosition",value:function(e,t){var n=this.getObject(e),i=t.x,o=t.y,r=t.originX,a=t.originY;if(!n)return!1;var s=n.getPointByOrigin(r,a),l=n.getPointByOrigin("center","center"),c=l.x-s.x,u=l.y-s.y;return n.set({left:i+c,top:o+u}),n.setCoords(),!0}},{key:"getCanvasSize",value:function(){var e=this.getCanvasImage();return{width:e?e.width:0,height:e?e.height:0}}},{key:"_getDrawingModeInstance",value:function(e){return this._drawingModeMap[e]}},{key:"_setCanvasElement",value:function(e){var t=void 0,n=void 0;t=e.jquery?e[0]:e.nodeType?e:document.querySelector(e),"CANVAS"!==t.nodeName.toUpperCase()&&(n=document.createElement("canvas"),t.appendChild(n)),this._canvas=new d.default.Canvas(n,{containerClass:"tui-image-editor-canvas-container",enableRetinaScaling:!1})}},{key:"_createDrawingModeInstances",value:function(){this._register(this._drawingModeMap,new D.default),this._register(this._drawingModeMap,new R.default),this._register(this._drawingModeMap,new N.default),this._register(this._drawingModeMap,new F.default),this._register(this._drawingModeMap,new z.default)}},{key:"_createComponents",value:function(){this._register(this._componentMap,new f.default(this)),this._register(this._componentMap,new g.default(this)),this._register(this._componentMap,new m.default(this)),this._register(this._componentMap,new y.default(this)),this._register(this._componentMap,new k.default(this)),this._register(this._componentMap,new x.default(this)),this._register(this._componentMap,new C.default(this)),this._register(this._componentMap,new S.default(this)),this._register(this._componentMap,new j.default(this)),this._register(this._componentMap,new P.default(this))}},{key:"_register",value:function(e,t){e[t.getName()]=t}},{key:"_isSameDrawingMode",value:function(e){return this.getDrawingMode()===e}},{key:"_calcMaxDimension",value:function(e,t){var n=this.cssMaxWidth/e,i=this.cssMaxHeight/t,o=Math.min(e,this.cssMaxWidth),r=Math.min(t,this.cssMaxHeight); +!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("tui-code-snippet"),require("fabric/dist/fabric.require")):"function"==typeof define&&define.amd?define(["tui-code-snippet","fabric/dist/fabric.require"],t):"object"==typeof exports?exports.ImageEditor=t(require("tui-code-snippet"),require("fabric/dist/fabric.require")):(e.tui=e.tui||{},e.tui.ImageEditor=t(e.tui&&e.tui.util,e.fabric))}(this,function(e,t){return function(e){function t(i){if(n[i])return n[i].exports;var o=n[i]={exports:{},id:i,loaded:!1};return e[i].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var n={};return t.m=e,t.c=n,t.p="dist",t(0)}([function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}n(91);var o=n(88),r=i(o);n(148),n(45),n(46),n(47),n(48),n(49),n(50),n(51),n(52),n(53),n(54),n(55),n(56),n(57),n(58),n(59),n(60),n(61),n(63),n(62),e.exports=r.default},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(5),r=i(o);e.exports={componentNames:r.default.keyMirror("IMAGE_LOADER","CROPPER","FLIP","ROTATION","FREE_DRAWING","LINE","TEXT","ICON","FILTER","SHAPE"),commandNames:{CLEAR_OBJECTS:"clearObjects",LOAD_IMAGE:"loadImage",FLIP_IMAGE:"flip",ROTATE_IMAGE:"rotate",ADD_OBJECT:"addObject",REMOVE_OBJECT:"removeObject",APPLY_FILTER:"applyFilter",REMOVE_FILTER:"removeFilter",ADD_ICON:"addIcon",CHANGE_ICON_COLOR:"changeIconColor",ADD_SHAPE:"addShape",CHANGE_SHAPE:"changeShape",ADD_TEXT:"addText",CHANGE_TEXT:"changeText",CHANGE_TEXT_STYLE:"changeTextStyle",ADD_IMAGE_OBJECT:"addImageObject",RESIZE_CANVAS_DIMENSION:"resizeCanvasDimension",SET_OBJECT_PROPERTIES:"setObjectProperties",SET_OBJECT_POSITION:"setObjectPosition"},eventNames:{OBJECT_ACTIVATED:"objectActivated",OBJECT_MOVED:"objectMoved",OBJECT_SCALED:"objectScaled",OBJECT_CREATED:"objectCreated",TEXT_EDITING:"textEditing",TEXT_CHANGED:"textChanged",ICON_CREATE_RESIZE:"iconCreateResize",ICON_CREATE_END:"iconCreateEnd",ADD_TEXT:"addText",ADD_OBJECT:"addObject",ADD_OBJECT_AFTER:"addObjectAfter",MOUSE_DOWN:"mousedown",MOUSE_UP:"mouseup",MOUSE_MOVE:"mousemove",REDO_STACK_CHANGED:"redoStackChanged",UNDO_STACK_CHANGED:"undoStackChanged",SELECTION_CLEARED:"selectionCleared",SELECTION_CREATED:"selectionCreated"},drawingModes:r.default.keyMirror("NORMAL","CROPPER","FREE_DRAWING","LINE_DRAWING","TEXT","SHAPE"),keyCodes:{Z:90,Y:89,SHIFT:16,BACKSPACE:8,DEL:46},fObjectOptions:{SELECTION_STYLE:{borderColor:"red",cornerColor:"green",cornerSize:10,originX:"center",originY:"center",transparentCorners:!1}},rejectMessages:{flip:"The flipX and flipY setting values are not changed.",rotation:"The current angle is same the old angle.",loadImage:"The background image is empty.",isLock:"The executing command state is locked.",undo:"The promise of undo command is reject.",redo:"The promise of redo command is reject.",invalidDrawingMode:"This operation is not supported in the drawing mode",invalidParameters:"Invalid parameters",noActiveObject:"There is no active object.",unsupportedType:"Unsupported object type",noObject:"The object is not in canvas.",addedObject:"The object is already added."},defaultIconPath:{"icon-arrow":"M40 12V0l24 24-24 24V36H0V12h40z","icon-arrow-2":"M49,32 H3 V22 h46 l-18,-18 h12 l23,23 L43,50 h-12 l18,-18 z ","icon-arrow-3":"M43.349998,27 L17.354,53 H1.949999 l25.996,-26 L1.949999,1 h15.404 L43.349998,27 z ","icon-star":"M35,54.557999 l-19.912001,10.468 l3.804,-22.172001 l-16.108,-15.7 l22.26,-3.236 L35,3.746 l9.956,20.172001 l22.26,3.236 l-16.108,15.7 l3.804,22.172001 z ","icon-star-2":"M17,31.212 l-7.194,4.08 l-4.728,-6.83 l-8.234,0.524 l-1.328,-8.226 l-7.644,-3.14 l2.338,-7.992 l-5.54,-6.18 l5.54,-6.176 l-2.338,-7.994 l7.644,-3.138 l1.328,-8.226 l8.234,0.522 l4.728,-6.83 L17,-24.312 l7.194,-4.08 l4.728,6.83 l8.234,-0.522 l1.328,8.226 l7.644,3.14 l-2.338,7.992 l5.54,6.178 l-5.54,6.178 l2.338,7.992 l-7.644,3.14 l-1.328,8.226 l-8.234,-0.524 l-4.728,6.83 z ","icon-polygon":"M3,31 L19,3 h32 l16,28 l-16,28 H19 z ","icon-location":"M24 62C8 45.503 0 32.837 0 24 0 10.745 10.745 0 24 0s24 10.745 24 24c0 8.837-8 21.503-24 38zm0-28c5.523 0 10-4.477 10-10s-4.477-10-10-10-10 4.477-10 10 4.477 10 10 10z","icon-heart":"M49.994999,91.349998 l-6.96,-6.333 C18.324001,62.606995 2.01,47.829002 2.01,29.690998 C2.01,14.912998 13.619999,3.299999 28.401001,3.299999 c8.349,0 16.362,5.859 21.594,12 c5.229,-6.141 13.242001,-12 21.591,-12 c14.778,0 26.390999,11.61 26.390999,26.390999 c0,18.138 -16.314001,32.916 -41.025002,55.374001 l-6.96,6.285 z ","icon-bubble":"M44 48L34 58V48H12C5.373 48 0 42.627 0 36V12C0 5.373 5.373 0 12 0h40c6.627 0 12 5.373 12 12v24c0 6.627-5.373 12-12 12h-8z"},defaultRotateRangeValus:{realTimeEvent:!0,min:-360,max:360,value:0},defaultDrawRangeValus:{min:5,max:30,value:12},defaultShapeStrokeValus:{realTimeEvent:!1,min:2,max:300,value:3},defaultTextRangeValus:{realTimeEvent:!0,min:10,max:100,value:50},defaultFilterRangeValus:{tintOpacityRange:{min:0,max:1,value:.7},removewhiteThresholdRange:{min:0,max:255,value:60},removewhiteDistanceRange:{min:0,max:255,value:10},gradientTransparencyRange:{min:0,max:255,value:100},brightnessRange:{min:-255,max:255,value:100},noiseRange:{min:0,max:1e3,value:100},pixelateRange:{min:2,max:20,value:4},colorfilterThresholeRange:{min:0,max:255,value:45}}}},function(e,t,n){n(144),n(146),n(147),n(145),e.exports=n(16).Promise},function(t,n){t.exports=e},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e){var t=l[e];if(t){for(var n=arguments.length,i=Array(n>1?n-1:0),o=1;on&&(i=t,t=n,n=i),r(t,o(e,n))},keyMirror:function(){for(var e={},t=arguments.length,n=Array(t),o=0;o1&&void 0!==arguments[1]?arguments[1]:"#7e7e7e",i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"up";o(this,e);var r=t.getAttribute("title");this._show=!1,this._colorpickerElement=t,this._toggleDirection=i,this._makePickerButtonElement(t,n),this._makePickerLayerElement(t,r),this._color=n,this.picker=c.default.create({container:this.pickerElement,preset:u,color:n}),this._addEvent(t)}return r(e,[{key:"_changeColorElement",value:function(e){e?(this.colorElement.classList.remove("transparent"),this.colorElement.style.backgroundColor=e):(this.colorElement.style.backgroundColor="#fff",this.colorElement.classList.add("transparent"))}},{key:"_makePickerButtonElement",value:function(e,t){e.classList.add("tui-image-editor-button"),this.colorElement=document.createElement("div"),this.colorElement.className="color-picker-value",t?this.colorElement.style.backgroundColor=t:this.colorElement.classList.add("transparent")}},{key:"_makePickerLayerElement",value:function(e,t){var n=document.createElement("label"),i=document.createElement("div");this.pickerControl=document.createElement("div"),this.pickerControl.className="color-picker-control",this.pickerElement=document.createElement("div"),this.pickerElement.className="color-picker",n.innerHTML=t,i.className="triangle",this.pickerControl.appendChild(this.pickerElement),this.pickerControl.appendChild(i),e.appendChild(this.pickerControl),e.appendChild(this.colorElement),e.appendChild(n)}},{key:"_addEvent",value:function(e){var t=this;this.picker.on("selectColor",function(e){t._changeColorElement(e.color),t._color=e.color,t.fire("change",e.color)}),e.addEventListener("click",function(e){t._show=!t._show,t.pickerControl.style.display=t._show?"block":"none",t._setPickerControlPosition(),t.fire("changeShow",t),e.stopPropagation()}),document.body.addEventListener("click",function(){t.hide()})}},{key:"hide",value:function(){this._show=!1,this.pickerControl.style.display="none"}},{key:"_setPickerControlPosition",value:function(){var e=this.pickerControl.style,t=this._colorpickerElement.clientWidth/2+2,n=this.pickerControl.offsetWidth/2-t,i=(this.pickerControl.offsetHeight+10)*-1;"down"===this._toggleDirection&&(i=30),e.top=i+"px",e.left="-"+n+"px"}},{key:"color",get:function(){return this._color},set:function(e){this._color=e,this._changeColorElement(e)}}]),e}();s.default.CustomEvents.mixin(d),t.default=d},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var r=function(){function e(e,t){for(var n=0;n1&&void 0!==arguments[1]?arguments[1]:{};o(this,e),this._value=n.value||0,this.rangeElement=t,this._drawRangeElement(),this.rangeWidth=(0,l.toInteger)(window.getComputedStyle(t,null).width)-12,this._min=n.min||0,this._max=n.max||100,this._absMax=this._min*-1+this._max,this.realTimeEvent=n.realTimeEvent||!1,this._addClickEvent(),this._addDragEvent(),this.value=n.value,this.trigger("change")}return r(e,[{key:"trigger",value:function(e){this.fire(e,this._value)}},{key:"_drawRangeElement",value:function(){this.rangeElement.classList.add("tui-image-editor-range"),this.bar=document.createElement("div"),this.bar.className="tui-image-editor-virtual-range-bar",this.subbar=document.createElement("div"),this.subbar.className="tui-image-editor-virtual-range-subbar",this.pointer=document.createElement("div"),this.pointer.className="tui-image-editor-virtual-range-pointer",this.bar.appendChild(this.subbar),this.bar.appendChild(this.pointer),this.rangeElement.appendChild(this.bar)}},{key:"_addClickEvent",value:function(){var e=this;this.rangeElement.addEventListener("click",function(t){if(t.stopPropagation(),"tui-image-editor-range"===t.target.className){var n=t.offsetX,i=n/e.rangeWidth,o=e._absMax*i+e._min;e.pointer.style.left=i*e.rangeWidth+"px",e.subbar.style.right=(1-i)*e.rangeWidth+"px",e._value=o,e.fire("change",o)}})}},{key:"_addDragEvent",value:function(){var e=this;this.pointer.addEventListener("mousedown",function(t){e.firstPosition=t.screenX,e.firstLeft=(0,l.toInteger)(e.pointer.style.left)||0,e.dragEventHandler={changeAngle:e._changeAngle.bind(e),stopChangingAngle:e._stopChangingAngle.bind(e)},document.addEventListener("mousemove",e.dragEventHandler.changeAngle),document.addEventListener("mouseup",e.dragEventHandler.stopChangingAngle)})}},{key:"_changeAngle",value:function(e){var t=e.screenX,n=t-this.firstPosition,i=this.firstLeft+n;i=i>this.rangeWidth?this.rangeWidth:i,i=i<0?0:i,this.pointer.style.left=i+"px",this.subbar.style.right=this.rangeWidth-i+"px";var o=i/this.rangeWidth,r=this._absMax*o+this._min;this._value=r,this.realTimeEvent&&this.fire("change",r)}},{key:"_stopChangingAngle",value:function(){this.fire("change",this._value),document.removeEventListener("mousemove",this.dragEventHandler.changeAngle),document.removeEventListener("mouseup",this.dragEventHandler.stopChangingAngle)}},{key:"max",set:function(e){this._max=e,this._absMax=this._min*-1+this._max,this.value=this._value},get:function(){return this._max}},{key:"value",get:function(){return this._value},set:function(e){var t=e-this._min,n=t*this.rangeWidth/this._absMax;this.rangeWidth0?i:n)(e)}},function(e,t,n){var i=n(122),o=n(25);e.exports=function(e){return i(o(e))}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(3),r=i(o),a=n(5),s=(0,a.keyMirror)("UN_IMPLEMENTATION","NO_COMPONENT_NAME"),l={UN_IMPLEMENTATION:"Should implement a method: ",NO_COMPONENT_NAME:"Should set a component name"},c={UN_IMPLEMENTATION:function(e){return l.UN_IMPLEMENTATION+e},NO_COMPONENT_NAME:function(){return l.NO_COMPONENT_NAME}};e.exports={types:r.default.extend({},s),create:function(e){e=e.toLowerCase();for(var t=c[e],n=arguments.length,i=Array(n>1?n-1:0),o=1;on;)t.push(arguments[n++]);return v[++g]=function(){s("function"==typeof e?e:Function(e),t)},i(g),g},f=function(e){delete v[e]},"process"==n(19)(d)?i=function(e){d.nextTick(a(b,e,1))}:p?(o=new p,r=o.port2,o.port1.onmessage=y,i=a(r.postMessage,r,1)):u.addEventListener&&"function"==typeof postMessage&&!u.importScripts?(i=function(e){u.postMessage(e+"","*")},u.addEventListener("message",y,!1)):i=m in c("script")?function(e){l.appendChild(c("script"))[m]=function(){l.removeChild(this),b.call(e)}}:function(e){setTimeout(a(b,e,1),0)}),e.exports={set:h,clear:f}},function(e,t,n){var i=n(29),o=Math.min;e.exports=function(e){return e>0?o(i(e),9007199254740991):0}},function(e,t){var n=0,i=Math.random();e.exports=function(e){return"Symbol(".concat(void 0===e?"":e,")_",(++n+i).toString(36))}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0});var o=n(3),r=n(5),a=i(r),s=n(86),l=i(s);t.default={getActions:function(){return{main:this._mainAction(),shape:this._shapeAction(),crop:this._cropAction(),flip:this._flipAction(),rotate:this._rotateAction(),text:this._textAction(),mask:this._maskAction(),draw:this._drawAction(),icon:this._iconAction(),filter:this._filterAction()}},_mainAction:function(){var e=this,t=function(){"crop"===e.ui.submenu&&(e.stopDrawingMode(),e.ui.changeMenu("crop"))};return(0,o.extend)({initLoadImage:function(n,i){return e.loadImageFromURL(n,i).then(function(i){t(),e.ui.initializeImgUrl=n,e.ui.resizeEditor({imageSize:i}),e.clearUndoStack()})},undo:function(){e.isEmptyUndoStack()||(t(),e.undo())},redo:function(){e.isEmptyRedoStack()||(t(),e.redo())},reset:function(){t(),e.loadImageFromURL(e.ui.initializeImgUrl,"resetImage").then(function(n){t(),e.ui.resizeEditor({imageSize:n}),e.clearUndoStack()})},delete:function(){e.ui.changeDeleteButtonEnabled(!1),t(),e.removeActiveObject(),e.activeObjectId=null},deleteAll:function(){t(),e.clearObjects(),e.ui.changeDeleteButtonEnabled(!1),e.ui.changeDeleteAllButtonEnabled(!1)},load:function(n){a.default.isSupportFileApi()||alert("This browser does not support file-api"),e.ui.initializeImgUrl=URL.createObjectURL(n),e.loadImageFromFile(n).then(function(n){t(),e.clearUndoStack(),e.ui.activeMenuEvent(),e.ui.resizeEditor({imageSize:n})}).catch(function(e){return Promise.reject(e)})},download:function(){var t=e.toDataURL(),n=e.getImageName(),i=void 0,o=void 0,r=void 0;a.default.isSupportFileApi()&&window.saveAs?(i=a.default.base64ToBlob(t),o=i.type.split("/")[1],n.split(".").pop()!==o&&(n+="."+o),saveAs(i,n)):(r=window.open(),r.document.body.innerHTML="")}},this._commonAction())},_iconAction:function(){var e=this,t=void 0,n=void 0,i=void 0,r=void 0,a=void 0,s=void 0,c=void 0;this.on({iconCreateResize:function(t){var n=t.moveOriginPointer,o=(n.x-i)/a,l=(n.y-r)/s;e.setObjectPropertiesQuietly(c,{scaleX:Math.abs(2*o),scaleY:Math.abs(2*l)})},iconCreateEnd:function(){e.ui.icon.clearIconType(),e.changeSelectableAll(!0)}});var u=function(o,l){i=l.x,r=l.y,e.addIcon(t,{left:l.x,top:l.y,fill:n}).then(function(e){c=e.id,a=e.width,s=e.height})};return(0,o.extend)({changeColor:function(t){e.activeObjectId&&e.changeIconColor(e.activeObjectId,t)},addIcon:function(i,o){t=i,n=o,e.changeCursor("crosshair"),e.off("mousedown"),e.once("mousedown",u.bind(e))},cancelAddIcon:function(){e.off("mousedown"),e.ui.icon.clearIconType(),e.changeSelectableAll(!0),e.changeCursor("default")},registDefalutIcons:function(t,n){var i={};i[t]=n,e.registerIcons(i)},registCustomIcon:function(t,n){var i=new l.default;i.imageToSVG(t,function(t){var i=t.match(/path[^>]*d="([^"]*)"/),o=i[1],r={};r[n.name]=o,e.registerIcons(r),e.addIcon(n.name,{left:100,top:100})},l.default.tracerDefaultOption())}},this._commonAction())},_drawAction:function(){var e=this;return(0,o.extend)({setDrawMode:function(t,n){e.stopDrawingMode(),"free"===t?e.startDrawingMode("FREE_DRAWING",n):e.startDrawingMode("LINE_DRAWING",n)},setColor:function(t){e.setBrush({color:t})}},this._commonAction())},_maskAction:function(){var e=this;return(0,o.extend)({loadImageFromURL:function(t,n){return e.loadImageFromURL(e.toDataURL(),"FilterImage").then(function(){e.addImageObject(t).then(function(){URL.revokeObjectURL(n)})})},applyFilter:function(){e.applyFilter("mask",{maskObjId:e.activeObjectId})}},this._commonAction())},_textAction:function(){var e=this;return(0,o.extend)({changeTextStyle:function(t){e.activeObjectId&&e.changeTextStyle(e.activeObjectId,t)}},this._commonAction())},_rotateAction:function(){var e=this;return(0,o.extend)({rotate:function(t){e.rotate(t),e.ui.resizeEditor()},setAngle:function(t){e.setAngle(t),e.ui.resizeEditor()}},this._commonAction())},_shapeAction:function(){var e=this;return(0,o.extend)({changeShape:function(t){e.activeObjectId&&e.changeShape(e.activeObjectId,t)},setDrawingShape:function(t){e.setDrawingShape(t)}},this._commonAction())},_cropAction:function(){var e=this;return(0,o.extend)({crop:function(){var t=e.getCropzoneRect();t&&e.crop(t).then(function(){e.stopDrawingMode(),e.ui.resizeEditor(),e.ui.changeMenu("crop")}).catch(function(e){return Promise.reject(e)})},cancel:function(){e.stopDrawingMode(),e.ui.changeMenu("crop")}},this._commonAction())},_flipAction:function(){var e=this;return(0,o.extend)({flip:function(t){return e[t]()}},this._commonAction())},_filterAction:function(){var e=this;return(0,o.extend)({applyFilter:function(t,n,i){t?e.applyFilter(n,i):e.hasFilter(n)&&e.removeFilter(n)}},this._commonAction())},setReAction:function(){var e=this;this.on({undoStackChanged:function(t){t?(e.ui.changeUndoButtonStatus(!0),e.ui.changeResetButtonStatus(!0)):(e.ui.changeUndoButtonStatus(!1),e.ui.changeResetButtonStatus(!1)),e.ui.resizeEditor()},redoStackChanged:function(t){t?e.ui.changeRedoButtonStatus(!0):e.ui.changeRedoButtonStatus(!1),e.ui.resizeEditor()},objectActivated:function(t){e.activeObjectId=t.id,e.ui.changeDeleteButtonEnabled(!0),e.ui.changeDeleteAllButtonEnabled(!0),"cropzone"===t.type?e.ui.crop.changeApplyButtonStatus(!0):["rect","circle","triangle"].indexOf(t.type)>-1?(e.stopDrawingMode(),"shape"!==e.ui.submenu&&e.ui.changeMenu("shape",!1,!1),e.ui.shape.setShapeStatus({strokeColor:t.stroke,strokeWidth:t.strokeWidth,fillColor:t.fill}),e.ui.shape.setMaxStrokeValue(Math.min(t.width,t.height))):"path"===t.type||"line"===t.type?"draw"!==e.ui.submenu&&(e.ui.changeMenu("draw",!1,!1),e.ui.draw.changeStandbyMode()):["i-text","text"].indexOf(t.type)>-1?"text"!==e.ui.submenu&&e.ui.changeMenu("text",!1,!1):"icon"===t.type&&(e.stopDrawingMode(),"icon"!==e.ui.submenu&&e.ui.changeMenu("icon",!1,!1),e.ui.icon.setIconPickerColor(t.fill))},addText:function(t){e.addText("Double Click",{position:t.originPosition,styles:{fill:e.ui.text.textColor,fontSize:a.default.toInteger(e.ui.text.fontSize),fontFamily:"Noto Sans"}}).then(function(){e.changeCursor("default")})},addObjectAfter:function(t){["rect","circle","triangle"].indexOf(t.type)>-1&&(e.ui.shape.setMaxStrokeValue(Math.min(t.width,t.height)),e.ui.shape.changeStandbyMode())},objectScaled:function(t){if(["i-text","text"].indexOf(t.type)>-1)e.ui.text.fontSize=a.default.toInteger(t.fontSize);else if(["rect","circle","triangle"].indexOf(t.type)>=0){var n=t.width,i=t.height,o=e.ui.shape.getStrokeValue();nv&&(r.remove(),r.set(this._calcRectDimensionFromPoint(i,o)),t.add(r))}},{key:"_calcRectDimensionFromPoint",value:function(e,t){var n=this.getCanvas(),i=n.getWidth(),o=n.getHeight(),r=this._startX,a=this._startY,s=(0,g.clamp)(e,0,r),l=(0,g.clamp)(t,0,a),c=(0,g.clamp)(e,r,i)-s,u=(0,g.clamp)(t,a,o)-l;return this._withShiftKey&&(c>u?u=c:u>c&&(c=u),r>=e&&(s=r-c),a>=t&&(l=a-u)),{left:s,top:l,width:c,height:u}}},{key:"_onFabricMouseUp",value:function(){var e=this._cropzone,t=this._listeners,n=this.getCanvas();n.setActiveObject(e),n.off({"mouse:move":t.mousemove,"mouse:up":t.mouseup})}},{key:"getCroppedImageData",value:function(e){var t=this.getCanvas(),n=t.contains(this._cropzone);if(!e)return null;n&&this._cropzone.remove();var i={imageName:this.getImageName(),url:t.toDataURL(e)};return n&&t.add(this._cropzone),i}},{key:"getCropzoneRect",value:function(){var e=this._cropzone;return e.isValid()?{left:e.getLeft(),top:e.getTop(),width:e.getWidth(),height:e.getHeight()}:null}},{key:"_onKeyDown",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!0)}},{key:"_onKeyUp",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!1)}}]),t}(d.default);e.exports=m},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;n=0,c=n.useDragAddIcon&&l,u=a?n._createIcon(a):null;u||o(y.invalidParameters),u.set(d.default.extend({type:"icon",fill:n._oColor},s,t,n.graphics.controlStyle)),r.add(u).setActiveObject(u),c&&n._addWithDragEvent(r),i(n.graphics.createObjectProperties(u))})}},{key:"_addWithDragEvent",value:function(e){var t=this;e.on({"mouse:move":function(n){e.selection=!1,t.fire(b.ICON_CREATE_RESIZE,{moveOriginPointer:e.getPointer(n.e)})},"mouse:up":function(n){t.fire(b.ICON_CREATE_END,{moveOriginPointer:e.getPointer(n.e)}),e.defaultCursor="default",e.off("mouse:up"),e.off("mouse:move"),e.selection=!0}})}},{key:"registerPaths",value:function(e){var t=this;d.default.forEach(e,function(e,n){t._pathMap[n]=e},this)}},{key:"setColor",value:function(e,t){this._oColor=e,t&&"icon"===t.get("type")&&(t.setFill(this._oColor),this.getCanvas().renderAll())}},{key:"getColor",value:function(e){return e.fill}},{key:"_createIcon",value:function(e){return new c.default.Path(e)}}]),t}(g.default);e.exports=k},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;nn},_getColor:function(e,t,n){var i=[0,0,0,0],o=e.data,r=e.width,a=4,s=(r*n+t)*a;return i[0]=o[s],i[1]=o[s+1],i[2]=o[s+2],i[3]=o[s+3],i}});e.exports=a},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(3),r=i(o),a=n(6),s=i(a),l=n(5),c="tl",u="tr",d="mt",h="ml",f="mr",p="mb",g="bl",v="br",m=s.default.util.createClass(s.default.Rect,{initialize:function(e,t){e=r.default.extend(e,t),e.type="cropzone",this.callSuper("initialize",e),this.options=e,this.on({moving:this._onMoving,scaling:this._onScaling})},_render:function(e){var t=7,n=7;this.callSuper("_render",e);var i=this.flipX?-1:1,o=this.flipY?-1:1,r=i/this.scaleX,a=o/this.scaleY;e.scale(r,a),this._fillOuterRect(e,"rgba(0, 0, 0, 0.55)"),this.options.lineWidth?(this._fillInnerRect(e),this._strokeBorder(e,"rgb(255, 255, 255)",{lineWidth:this.options.lineWidth})):(this._strokeBorder(e,"rgb(0, 0, 0)",{lineDashWidth:t}),this._strokeBorder(e,"rgb(255, 255, 255)",{lineDashWidth:t,lineDashOffset:n})),e.scale(1/r,1/a)},_fillOuterRect:function(e,t){var n=this._getCoordinates(e),i=n.x,o=n.y;e.save(),e.fillStyle=t,e.beginPath(),e.moveTo(i[0]-1,o[0]-1),e.lineTo(i[3]+1,o[0]-1),e.lineTo(i[3]+1,o[3]+1),e.lineTo(i[0]-1,o[3]+1),e.lineTo(i[0]-1,o[0]-1),e.closePath(),e.moveTo(i[1],o[1]),e.lineTo(i[1],o[2]),e.lineTo(i[2],o[2]),e.lineTo(i[2],o[1]),e.lineTo(i[1],o[1]),e.closePath(),e.fill(),e.restore()},_fillInnerRect:function(e){var t=this._getCoordinates(e),n=t.x,i=t.y,o=this._caculateInnerPosition(n,(n[2]-n[1])/3),r=this._caculateInnerPosition(i,(i[2]-i[1])/3);e.save(),e.strokeStyle="rgba(255, 255, 255, 0.7)",e.lineWidth=this.options.lineWidth,e.beginPath(),e.moveTo(o[0],r[1]),e.lineTo(o[3],r[1]),e.moveTo(o[0],r[2]),e.lineTo(o[3],r[2]),e.moveTo(o[1],r[0]),e.lineTo(o[1],r[3]),e.moveTo(o[2],r[0]),e.lineTo(o[2],r[3]),e.stroke(),e.closePath(),e.restore()},_caculateInnerPosition:function(e,t){var n=[];return n[0]=e[1],n[1]=e[1]+t,n[2]=e[1]+2*t,n[3]=e[2],n},_getCoordinates:function(e){var t=this.getWidth(),n=this.getHeight(),i=t/2,o=n/2,a=this.getLeft(),s=this.getTop(),l=e.canvas;return{x:r.default.map([-(i+a),-i,i,i+(l.width-a-t)],Math.ceil),y:r.default.map([-(o+s),-o,o,o+(l.height-s-n)],Math.ceil)}},_strokeBorder:function(e,t,n){var i=n.lineDashWidth,o=n.lineDashOffset,r=n.lineWidth,a=this.getWidth()/2,s=this.getHeight()/2;e.save(),e.strokeStyle=t,e.setLineDash&&e.setLineDash([i,i]),o&&(e.lineDashOffset=o),r&&(e.lineWidth=r),e.beginPath(),e.moveTo(-a,-s),e.lineTo(a,-s),e.lineTo(a,s),e.lineTo(-a,s),e.lineTo(-a,-s),e.stroke(),e.restore()},_onMoving:function(){var e=this.getLeft(),t=this.getTop(),n=this.getWidth(),i=this.getHeight(),o=this.canvas.getWidth()-n,r=this.canvas.getHeight()-i;this.setLeft((0,l.clamp)(e,0,o)),this.setTop((0,l.clamp)(t,0,r))},_onScaling:function(e){var t=this.canvas.getPointer(e.e),n=this._calcScalingSizeFromPointer(t);this.scale(1).set(n)},_calcScalingSizeFromPointer:function(e){var t=e.x,n=e.y,i=this._calcTopLeftScalingSizeFromPointer(t,n),o=this._calcBottomRightScalingSizeFromPointer(t,n);return this._makeScalingSettings(i,o)},_calcTopLeftScalingSizeFromPointer:function(e,t){var n=this.getHeight()+this.top,i=this.getWidth()+this.left,o=(0,l.clamp)(t,0,n-1),r=(0,l.clamp)(e,0,i-1);return{top:o,left:r,width:i-r,height:n-o}},_calcBottomRightScalingSizeFromPointer:function(e,t){var n=this.canvas,i=n.width,o=n.height,r=this.left,a=this.top;return{width:(0,l.clamp)(e,r+1,i)-r,height:(0,l.clamp)(t,a+1,o)-a}},_makeScalingSettings:function(e,t){var n=e.width,i=e.height,o=t.height,r=t.width,a=e.left,s=e.top,l=void 0;switch(this.__corner){case c:l=e;break;case u:l={width:r,height:i,top:s};break;case g:l={width:n,height:o,left:a};break;case v:l=t;break;case h:l={width:n,left:a};break;case d:l={height:i,top:s};break;case f:l={width:r};break;case p:l={height:o}}return l},isValid:function(){return this.left>=0&&this.top>=0&&this.width>0&&this.height>0}});e.exports=m},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(6),r=i(o),a=r.default.util.createClass(r.default.Image.filters.Convolute,{type:"Emboss",initialize:function(){var e=[1,1,1,1,.7,-1,-1,-1,-1];this.matrix=e}});e.exports=a},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(6),r=i(o),a=r.default.util.createClass(r.default.Image.filters.Mask,{applyTo:function(e){if(this.mask){var t=e.width,n=e.height,i=this._createCanvasOfMask(t,n),o=e.getContext("2d"),r=i.getContext("2d"),a=o.getImageData(0,0,t,n);this._drawMask(r,e,o),this._mapData(r,a,t,n),o.putImageData(a,0,0)}},_createCanvasOfMask:function(e,t){var n=r.default.util.createCanvasElement();return n.width=e,n.height=t,n},_drawMask:function(e){var t=this.mask,n=t.getElement(),i=t.getLeft(),o=t.getTop(),r=t.getAngle();e.save(),e.translate(i,o),e.rotate(r*Math.PI/180),e.scale(t.scaleX,t.scaleY),e.drawImage(n,-n.width/2,-n.height/2),e.restore()},_mapData:function(e,t,n,i){for(var o=t.data,r=e.getImageData(0,0,n,i).data,a=this.channel,s=t.width*t.height*4,l=0;l1&&void 0!==arguments[1]?arguments[1]:{},i=n.cssMaxWidth,r=n.cssMaxHeight,a=n.useItext,s=void 0!==a&&a,l=n.useDragAddIcon,c=void 0!==l&&l;o(this,e),this.canvasImage=null,this.cssMaxWidth=i||ie,this.cssMaxHeight=r||oe,this.useItext=s,this.useDragAddIcon=c,this.cropSelectionStyle={},this.imageName="",this._objects={},this._canvas=null,this._drawingMode=q.NORMAL,this._drawingModeMap={},this._componentMap={},this._handler={onMouseDown:this._onMouseDown.bind(this),onObjectAdded:this._onObjectAdded.bind(this),onObjectRemoved:this._onObjectRemoved.bind(this),onObjectMoved:this._onObjectMoved.bind(this),onObjectScaled:this._onObjectScaled.bind(this),onObjectSelected:this._onObjectSelected.bind(this),onPathCreated:this._onPathCreated.bind(this),onSelectionCleared:this._onSelectionCleared.bind(this),onSelectionCreated:this._onSelectionCreated.bind(this)},this._setCanvasElement(t),this._createDrawingModeInstances(),this._createComponents(),this._attachCanvasEvents()}return r(e,[{key:"destroy",value:function(){var e=this._canvas.wrapperEl;this._canvas.clear(),e.parentNode.removeChild(e)}},{key:"deactivateAll",value:function(){return this._canvas.deactivateAll(),this}},{key:"renderAll",value:function(){return this._canvas.renderAll(),this}},{key:"add",value:function(e){var t,n=[];$(e)?n=e:n.push(e),(t=this._canvas).add.apply(t,n)}},{key:"contains",value:function(e){return this._canvas.contains(e)}},{key:"getObjects",value:function(){return this._canvas.getObjects().slice()}},{key:"getObject",value:function(e){return this._objects[e]}},{key:"remove",value:function(e){this._canvas.remove(e)}},{key:"removeAll",value:function(e){var t=this._canvas,n=t.getObjects().slice();return t.remove.apply(t,this._canvas.getObjects()),e&&t.clear(),n}},{key:"removeObjectById",value:function(e){var t=[],n=this._canvas,i=this.getObject(e),o=i&&i.isType("group")&&!i.isEmpty();return o?(n.discardActiveGroup(),i.forEachObject(function(e){t.push(e),e.remove()})):n.contains(i)&&(t.push(i),i.remove()),t}},{key:"getObjectId",value:function(e){var t=null;for(t in this._objects)if(this._objects.hasOwnProperty(t)&&e===this._objects[t])return t;return null}},{key:"getActiveObject",value:function(){return this._canvas.getActiveObject()}},{key:"getActiveGroupObject",value:function(){return this._canvas.getActiveGroup()}},{key:"setActiveObject",value:function(e){this._canvas.setActiveObject(e)}},{key:"setCropSelectionStyle",value:function(e){this.cropSelectionStyle=e}},{key:"getComponent",value:function(e){return this._componentMap[e]}},{key:"getDrawingMode",value:function(){return this._drawingMode}},{key:"startDrawingMode",value:function(e,t){if(this._isSameDrawingMode(e))return!0;this.stopDrawingMode();var n=this._getDrawingModeInstance(e);return n&&n.start&&(n.start(this,t),this._drawingMode=e),!!n}},{key:"stopDrawingMode",value:function(){if(!this._isSameDrawingMode(q.NORMAL)){var e=this._getDrawingModeInstance(this.getDrawingMode());e&&e.end&&e.end(this),this._drawingMode=q.NORMAL}}},{key:"toDataURL",value:function(e){return this._canvas&&this._canvas.toDataURL(e)}},{key:"setCanvasImage",value:function(e,t){t&&Z(t),this.imageName=e,this.canvasImage=t}},{key:"setCssMaxDimension",value:function(e){this.cssMaxWidth=e.width||this.cssMaxWidth,this.cssMaxHeight=e.height||this.cssMaxHeight}},{key:"adjustCanvasDimension",value:function(){var e=this.canvasImage.scale(1),t=e.getBoundingRect(),n=t.width,i=t.height,o=this._calcMaxDimension(n,i);this.setCanvasCssDimension({width:"100%",height:"100%","max-width":o.width+"px","max-height":o.height+"px"}),this.setCanvasBackstoreDimension({width:n,height:i}),this._canvas.centerObject(e)}},{key:"setCanvasCssDimension",value:function(e){this._canvas.setDimensions(e,re)}},{key:"setCanvasBackstoreDimension",value:function(e){this._canvas.setDimensions(e,ae)}},{key:"setImageProperties",value:function(e,t){var n=this.canvasImage;n&&(n.set(e).setCoords(),t&&this._canvas.renderAll())}},{key:"getCanvasElement",value:function(){return this._canvas.getElement()}},{key:"getCanvas",value:function(){return this._canvas}},{key:"getCanvasImage",value:function(){return this.canvasImage}},{key:"getImageName",value:function(){return this.imageName}},{key:"addImageObject",value:function(e){var t=this,n=this._callbackAfterLoadingImageObject.bind(this);return new c.default(function(i){d.default.Image.fromURL(e,function(e){n(e),i(t.createObjectProperties(e))},{crossOrigin:"Anonymous"})})}},{key:"getCenter",value:function(){return this._canvas.getCenter()}},{key:"getCropzoneRect",value:function(){return this.getComponent(G.CROPPER).getCropzoneRect()}},{key:"getCroppedImageData",value:function(e){return this.getComponent(G.CROPPER).getCroppedImageData(e)}},{key:"setBrush",value:function(e){var t=this._drawingMode,n=G.FREE_DRAWING;t===q.LINE&&(n=q.LINE),this.getComponent(n).setBrush(e)}},{key:"setDrawingShape",value:function(e,t){this.getComponent(G.SHAPE).setStates(e,t)}},{key:"registerPaths",value:function(e){this.getComponent(G.ICON).registerPaths(e)}},{key:"changeCursor",value:function(e){var t=this.getCanvas();t.defaultCursor=e,t.renderAll()}},{key:"hasFilter",value:function(e){return this.getComponent(G.FILTER).hasFilter(e)}},{key:"setSelectionStyle",value:function(e){J(K.SELECTION_STYLE,e)}},{key:"setObjectProperties",value:function(e,t){var n=this.getObject(e),i=J({},t);return n.set(i),n.setCoords(),this.getCanvas().renderAll(),i}},{key:"getObjectProperties",value:function(e,t){var n=this.getObject(e),i={};return Q(t)?i[t]=n[t]:$(t)?ee(t,function(e){i[e]=n[e]}):te(t,function(e,t){i[t]=n[t]}),i}},{key:"getObjectPosition",value:function(e,t,n){var i=this.getObject(e);return i?i.getPointByOrigin(t,n):null}},{key:"setObjectPosition",value:function(e,t){var n=this.getObject(e),i=t.x,o=t.y,r=t.originX,a=t.originY;if(!n)return!1;var s=n.getPointByOrigin(r,a),l=n.getPointByOrigin("center","center"),c=l.x-s.x,u=l.y-s.y;return n.set({left:i+c,top:o+u}),n.setCoords(),!0}},{key:"getCanvasSize",value:function(){var e=this.getCanvasImage();return{width:e?e.width:0,height:e?e.height:0}}},{key:"_getDrawingModeInstance",value:function(e){return this._drawingModeMap[e]}},{key:"_setCanvasElement",value:function(e){var t=void 0,n=void 0;t=e.jquery?e[0]:e.nodeType?e:document.querySelector(e),"CANVAS"!==t.nodeName.toUpperCase()&&(n=document.createElement("canvas"),t.appendChild(n)),this._canvas=new d.default.Canvas(n,{containerClass:"tui-image-editor-canvas-container",enableRetinaScaling:!1})}},{key:"_createDrawingModeInstances",value:function(){this._register(this._drawingModeMap,new D.default),this._register(this._drawingModeMap,new R.default),this._register(this._drawingModeMap,new N.default),this._register(this._drawingModeMap,new F.default),this._register(this._drawingModeMap,new z.default)}},{key:"_createComponents",value:function(){this._register(this._componentMap,new f.default(this)),this._register(this._componentMap,new g.default(this)),this._register(this._componentMap,new m.default(this)),this._register(this._componentMap,new y.default(this)),this._register(this._componentMap,new k.default(this)),this._register(this._componentMap,new x.default(this)),this._register(this._componentMap,new C.default(this)),this._register(this._componentMap,new S.default(this)),this._register(this._componentMap,new j.default(this)),this._register(this._componentMap,new P.default(this))}},{key:"_register",value:function(e,t){e[t.getName()]=t}},{key:"_isSameDrawingMode",value:function(e){return this.getDrawingMode()===e}},{key:"_calcMaxDimension",value:function(e,t){var n=this.cssMaxWidth/e,i=this.cssMaxHeight/t,o=Math.min(e,this.cssMaxWidth),r=Math.min(t,this.cssMaxHeight); return n<1&&n-1&&J(n,this._createTextProperties(e,n)),n}},{key:"_createTextProperties",value:function(e){var t=["text","fontFamily","fontSize","fontStyle","textAlign","textDecoration"],n={};return J(n,X.default.getProperties(e,t)),n}},{key:"_addFabricObject",value:function(e){var t=Z(e);return this._objects[t]=e,t}},{key:"_removeFabricObject",value:function(e){delete this._objects[e]}}]),e}();ne.mixin(se),e.exports=se},function(e,t){"use strict";function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n0&&(e=this.blur(e,t.blurradius,t.blurdelta)),h=0;h0)for(d=0;d0&&(f[d]={r:Math.floor(s[d].r/s[d].n),g:Math.floor(s[d].g/s[d].n),b:Math.floor(s[d].b/s[d].n),a:Math.floor(s[d].a/s[d].n)}),s[d].n/ln[i].boundingbox[2]&&(n[i].boundingbox[2]=r-1),a-1n[i].boundingbox[3]&&(n[i].boundingbox[3]=a-1),h=this.pathscan_combined_lookup[e[a][r]][c],e[a][r]=h[0],c=h[1],r+=h[2],a+=h[3],r-1===n[i].points[0].x&&a-1===n[i].points[0].y)if(u=!0,n[i].points.lengtht[2]&&e[3]>t[3]}},{key:"batchpathscan",value:function(e,t){var n=[];for(var i in e)e.hasOwnProperty(i)&&(n[i]=this.pathscan(e[i],t));return n}},{key:"internodes",value:function(e,t){var n=[],i=0,o=0,r=0,a=0,s=0,l=void 0,c=void 0;for(l=0;l0&&(n[l].points[n[l].points.length-1].linesegment=this.getdirection(n[l].points[n[l].points.length-1].x,n[l].points[n[l].points.length-1].y,e[l].points[c].x,e[l].points[c].y)),n[l].points.push({x:e[l].points[c].x,y:e[l].points[c].y,linesegment:this.getdirection(e[l].points[c].x,e[l].points[c].y,(e[l].points[c].x+e[l].points[o].x)/2,(e[l].points[c].y+e[l].points[o].y)/2)})),n[l].points.push({x:(e[l].points[c].x+e[l].points[o].x)/2,y:(e[l].points[c].y+e[l].points[o].y)/2,linesegment:this.getdirection((e[l].points[c].x+e[l].points[o].x)/2,(e[l].points[c].y+e[l].points[o].y)/2,(e[l].points[o].x+e[l].points[r].x)/2,(e[l].points[o].y+e[l].points[r].y)/2)});return n}},{key:"testrightangle",value:function(e,t,n,i,o,r){return e.points[i].x===e.points[t].x&&e.points[i].x===e.points[n].x&&e.points[i].y===e.points[o].y&&e.points[i].y===e.points[r].y||e.points[i].y===e.points[t].y&&e.points[i].y===e.points[n].y&&e.points[i].x===e.points[o].x&&e.points[i].x===e.points[r].x}},{key:"getdirection",value:function(e,t,n,i){var o=8;return o=ei?7:0:e>n?ti?5:4:ti?6:8}},{key:"batchinternodes",value:function(e,t){var n=[];for(var i in e)e.hasOwnProperty(i)&&(n[i]=this.internodes(e[i],t));return n}},{key:"tracepath",value:function(e,t,n){var i=0,o=void 0,r=void 0,a=void 0,s={};for(s.segments=[],s.boundingbox=e.boundingbox,s.holechildren=e.holechildren,s.isholepath=e.isholepath;i0?a:e.points.length}return s}},{key:"fitseq",value:function(e,t,n,i,o){if(o>e.points.length||o<0)return[];var r=i,a=0,s=!0,l=void 0,c=void 0,u=void 0,d=o-i;d<0&&(d+=e.points.length);for(var h=(e.points[o].x-e.points[i].x)/d,f=(e.points[o].y-e.points[i].y)/d,p=(i+1)%e.points.length,g=void 0;p!=o;)g=p-i,g<0&&(g+=e.points.length),l=e.points[i].x+h*g,c=e.points[i].y+f*g,u=(e.points[p].x-l)*(e.points[p].x-l)+(e.points[p].y-c)*(e.points[p].y-c),u>t&&(s=!1),u>a&&(r=p,a=u),p=(p+1)%e.points.length;if(s)return[{type:"L",x1:e.points[i].x,y1:e.points[i].y,x2:e.points[o].x,y2:e.points[o].y}];var v=r;s=!0,a=0;var m=(v-i)/d,b=(1-m)*(1-m),y=2*(1-m)*m,_=m*m,k=(b*e.points[i].x+_*e.points[o].x-e.points[v].x)/-y,w=(b*e.points[i].y+_*e.points[o].y-e.points[v].y)/-y;for(p=i+1;p!=o;)m=(p-i)/d,b=(1-m)*(1-m),y=2*(1-m)*m,_=m*m,l=b*e.points[i].x+y*k+_*e.points[o].x,c=b*e.points[i].y+y*w+_*e.points[o].y,u=(e.points[p].x-l)*(e.points[p].x-l)+(e.points[p].y-c)*(e.points[p].y-c),u>n&&(s=!1),u>a&&(r=p,a=u),p=(p+1)%e.points.length;if(s)return[{type:"Q",x1:e.points[i].x,y1:e.points[i].y,x2:k,y2:w,x3:e.points[o].x,y3:e.points[o].y}];var x=v;return this.fitseq(e,t,n,i,x).concat(this.fitseq(e,t,n,x,o))}},{key:"batchtracepaths",value:function(e,t,n){var i=[];for(var o in e)e.hasOwnProperty(o)&&i.push(this.tracepath(e[o],t,n));return i}},{key:"batchtracelayers",value:function(e,t,n){var i=[];for(var o in e)e.hasOwnProperty(o)&&(i[o]=this.batchtracepaths(e[o],t,n));return i}},{key:"roundtodec",value:function(e,t){return Number(e.toFixed(t))}},{key:"svgpathstring",value:function(e,t,n,i){var o=e.layers[t],r=o[n],a="",s=void 0;if(i.linefilter&&r.segments.length<3)return a;if(a="=0;s--)a+=c.segments[s].type+" ",c.segments[s].hasOwnProperty("x3")&&(a+=c.segments[s].x2*i.scale+" "+c.segments[s].y2*i.scale+" "),a+=c.segments[s].x1*i.scale+" "+c.segments[s].y1*i.scale+" ";else for(a+=c.segments[c.segments.length-1].hasOwnProperty("x3")?"M "+this.roundtodec(c.segments[c.segments.length-1].x3*i.scale)+" "+this.roundtodec(c.segments[c.segments.length-1].y3*i.scale)+" ":"M "+this.roundtodec(c.segments[c.segments.length-1].x2*i.scale)+" "+this.roundtodec(c.segments[c.segments.length-1].y2*i.scale)+" ",s=c.segments.length-1;s>=0;s--)a+=c.segments[s].type+" ",c.segments[s].hasOwnProperty("x3")&&(a+=this.roundtodec(c.segments[s].x2*i.scale)+" "+this.roundtodec(c.segments[s].y2*i.scale)+" "),a+=this.roundtodec(c.segments[s].x1*i.scale)+" "+this.roundtodec(c.segments[s].y1*i.scale)+" ";a+="Z "}if(a+='" />',i.lcpr||i.qcpr){for(s=0;s',a+='',a+='',a+=''),!r.segments[s].hasOwnProperty("x3")&&i.lcpr&&(a+='');for(var l=0;l',a+='',a+='',a+=''),!c.segments[s].hasOwnProperty("x3")&&i.lcpr&&(a+='')}}return a}},{key:"getsvgstring",value:function(e,t){t=this.checkoptions(t);for(var n=e.width*t.scale,i=e.height*t.scale,o="',r=0;r5&&(t=5),n=Math.abs(n),n>1024&&(n=1024);var p=this.gks[t-1];for(o=0;o0&&i+r0&&o+rn&&(f.data[s]=e.data[s],f.data[s+1]=e.data[s+1],f.data[s+2]=e.data[s+2],f.data[s+3]=e.data[s+3]);return f}},{key:"loadImage",value:function(e,t,n){var i=new Image;n&&n.corsenabled&&(i.crossOrigin="Anonymous"),i.src=e,i.onload=function(){var e=document.createElement("canvas");e.width=i.width,e.height=i.height;var n=e.getContext("2d");n.drawImage(i,0,0),t(e)}}},{key:"getImgdata",value:function(e){var t=e.getContext("2d");return t.getImageData(0,0,e.width,e.height)}},{key:"drawLayers",value:function(e,t,n,i){n=n||1;var o=void 0,r=void 0,a=void 0,s=void 0,l=void 0,c=void 0;i?(c=document.getElementById(i),c||(c=document.createElement("div"),c.id=i,document.body.appendChild(c))):(c=document.createElement("div"),document.body.appendChild(c));for(l in e)if(e.hasOwnProperty(l)){o=e[l][0].length,r=e[l].length;var u=document.createElement("canvas");u.width=o*n,u.height=r*n;var d=u.getContext("2d");for(s=0;sl?"right":"left",originY:o>c?"bottom":"top"}}function o(e){return"center"===e.getOriginX()&&"center"===e.getOriginY()}function r(e,t){var n=t.getPointByOrigin("center","center"),o=-t.getAngle(),r=i(n,e,o),a=r.originX,s=r.originY,l=t.getPointByOrigin(a,s),c=t.getLeft()-(n.x-l.x),u=t.getTop()-(n.x-l.y);t.set({originX:a,originY:s,left:c,top:u}),t.setCoords()}function a(e,t){var n=t.startPoint,o=-t.getAngle(),r=i(n,e,o),a=r.originX,s=r.originY;t.setPositionByOrigin(n,a,s)}function s(e){var t=e.type,n=e.scaleX,i=e.scaleY,o=u[t],r=e[o.w]*n,a=e[o.h]*i;if(e.isRegular){var s=Math.max(n,i);r=e[o.w]*s,a=e[o.h]*s}var l={hasControls:!1,hasBorders:!1,scaleX:1,scaleY:1};l[o.w]=r,l[o.h]=a,e.set(l)}function l(e,t){var n=t.type,i=t.strokeWidth,o=t.startPoint,r=c[n],a=u[n],s=!("triangle"!==t.type),l={},d=Math.abs(o.x-e.x)/r,h=Math.abs(o.y-e.y)/r;d>i&&(d-=i/r),h>i&&(h-=i/r),t.isRegular&&(d=h=Math.max(d,h),s&&(h=Math.sqrt(3)/2*d)),l[a.w]=d,l[a.h]=h,t.set(l)}var c={rect:1,circle:2,triangle:1},u={rect:{w:"width",h:"height"},circle:{w:"rx",h:"ry"},triangle:{w:"width",h:"height"}};e.exports={setOrigins:function(e){var t=e.getPointByOrigin("left","top"),n=e.getPointByOrigin("right","top"),i=e.getPointByOrigin("right","bottom"),o=e.getPointByOrigin("left","bottom");e.origins={lt:t,rt:n,rb:i,lb:o}},resize:function(e,t,i){o(e)&&(r(t,e),n(e)),i?s(e,t):l(t,e),a(t,e)},adjustOriginToCenter:function(e){var t=e.getPointByOrigin("center","center"),n=e.getOriginX(),i=e.getOriginY(),o=e.getPointByOrigin(n,i),r=e.getLeft()+(t.x-o.x),a=e.getTop()+(t.y-o.y);e.set({hasControls:!0,hasBorders:!0,originX:"center",originY:"center",left:r,top:a}),e.setCoords()}}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var r=function(){function e(e,t){for(var n=0;n1?n-1:0),o=1;o0&&void 0!==arguments[0]?arguments[0]:{},t=e.uiSize,n=e.imageSize,i=void 0===n?this.imageSize:n;i!==this.imageSize&&(this.imageSize=i),t&&this._setUiSize(t);var o=this._getEditorDimension(),r=o.width,a=o.height,s=this._editorElement.style,l=this.options.menuBarPosition;s.height=a+"px",s.width=r+"px",this._setEditorPosition(l),this._editorElementWrap.style.bottom="0px",this._editorElementWrap.style.top="0px",this._editorElementWrap.style.left="0px",this._editorElementWrap.style.width="100%";var c=this._selectedElement.classList;"top"===l&&this._selectedElement.offsetWidth0&&void 0!==arguments[0]?arguments[0]:this.options.uiSize,t=this._selectedElement.style;t.width=e.width,t.height=e.height}},{key:"_makeSubMenu",value:function(){var e=this;s.default.forEach(this.options.menu,function(t){var n=I[t.replace(/^[a-z]/,function(e){return e.toUpperCase()})];e._makeMenuElement(t),e._els[t]=e._menuElement.querySelector("#tie-btn-"+t),e[t]=new n(e._subMenuElement,{iconStyle:e.theme.getStyle("submenu.icon"),menuBarPosition:e.options.menuBarPosition})})}},{key:"_makeUiElement",value:function(e){var t=void 0;window.snippet=s.default,t=e.jquery?e[0]:e.nodeType?e:document.querySelector(e);var n=c.default.getSelector(t);t.classList.add("tui-image-editor-container"),t.innerHTML=(0,f.default)({biImage:this.theme.getStyle("common.bi"),iconStyle:this.theme.getStyle("menu.icon"),loadButtonStyle:this.theme.getStyle("loadButton"),downloadButtonStyle:this.theme.getStyle("downloadButton")})+(0,d.default)({biImage:this.theme.getStyle("common.bi"),commonStyle:this.theme.getStyle("common"),headerStyle:this.theme.getStyle("header"),loadButtonStyle:this.theme.getStyle("loadButton"),downloadButtonStyle:this.theme.getStyle("downloadButton"),submenuStyle:this.theme.getStyle("submenu")}),this._selectedElement=t,this._selectedElement.classList.add(this.options.menuBarPosition),this._mainElement=n(".tui-image-editor-main"),this._editorElementWrap=n(".tui-image-editor-wrap"),this._editorElement=n(".tui-image-editor"),this._menuElement=n(".tui-image-editor-menu"),this._subMenuElement=n(".tui-image-editor-submenu")}},{key:"_makeMenuElement",value:function(e){var t=document.createElement("li"),n=this.theme.getStyle("menu.icon"),i=n.normal,o=n.active,r=n.hover,a='\n \n \n \n \n \n ';t.id="tie-btn-"+e,t.className="tui-image-editor-item normal",t.title=e.replace(/^[a-z]/g,function(e){return e.toUpperCase()}),t.innerHTML=a,this._menuElement.appendChild(t)}},{key:"_addHelpActionEvent",value:function(e){var t=this;this._els[e].addEventListener("click",function(){t._actions.main[e]()})}},{key:"_addDownloadEvent",value:function(){var e=this;s.default.forEach(this._els.download,function(t){t.addEventListener("click",function(){e._actions.main.download()})})}},{key:"_addLoadEvent",value:function(){var e=this;s.default.forEach(this._els.load,function(t){t.addEventListener("change",function(t){e._actions.main.load(t.target.files[0])})})}},{key:"_addMenuEvent",value:function(e){var t=this;this._els[e].addEventListener("click",function(){t.changeMenu(e)})}},{key:"_addSubMenuEvent",value:function(e){this[e].addEvent(this._actions[e])}},{key:"getEditorArea",value:function(){return this._editorElement}},{key:"initCanvas",value:function(){var e=this,t=this._getLoadImage();t&&this._actions.main.initLoadImage(t.path,t.name).then(function(){e._addHelpActionEvent("undo"),e._addHelpActionEvent("redo"),e._addHelpActionEvent("reset"),e._addHelpActionEvent("delete"),e._addHelpActionEvent("deleteAll"),e._addDownloadEvent(),e._addLoadEvent(),s.default.forEach(e.options.menu,function(t){e._addMenuEvent(t),e._addSubMenuEvent(t)}),e._initMenu()});var n=document.createElement("div");n.className="tui-image-editor-grid-visual";var i='\n \n \n \n
    ';n.innerHTML=i,this._editorContainerElement=this._editorElement.querySelector(".tui-image-editor-canvas-container"),this._editorContainerElement.appendChild(n)}},{key:"_getLoadImage",value:function(){return this.options.loadImage}},{key:"changeMenu",value:function(e){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],n=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];this._submenuChangeTransection||(this._submenuChangeTransection=!0,this._changeMenu(e,t,n),this._submenuChangeTransection=!1)}},{key:"_changeMenu",value:function(e,t,n){this.submenu&&(this._els[this.submenu].classList.remove("active"),this._mainElement.classList.remove("tui-image-editor-menu-"+this.submenu),n&&this._actions.main.discardSelection(),this._actions.main.changeSelectableAll(!0),this[this.submenu].changeStandbyMode()),this.submenu===e&&t?this.submenu=null:(this._els[e].classList.add("active"),this._mainElement.classList.add("tui-image-editor-menu-"+e),this.submenu=e,this[this.submenu].changeStartMode()),this.resizeEditor()}},{key:"_initMenu",value:function(){if(this.options.initMenu){var e=document.createEvent("MouseEvents");e.initEvent("click",!0,!1),this._els[this.options.initMenu].dispatchEvent(e),this.icon&&this.icon.registDefaultIcon()}}},{key:"_getEditorDimension",value:function(){var e=parseFloat(this._editorContainerElement.style.maxHeight),t=this.imageSize.newHeight>e?e:this.imageSize.newHeight,n=parseFloat(this._editorContainerElement.style.maxWidth),i=this.imageSize.newWidth>n?n:this.imageSize.newWidth;return{width:i,height:t}}},{key:"_setEditorPosition",value:function(e){var t=this._getEditorDimension(),n=t.width,i=t.height,o=this._editorElement.style,r=0,a=0;this.submenu&&("bottom"===e?r=i>this._editorElementWrap.scrollHeight-150?(i-this._editorElementWrap.scrollHeight)/2:-75:"top"===e?r=i>this._editorElementWrap.offsetHeight-150?75-(i-(this._editorElementWrap.offsetHeight-150))/2:75:"left"===e?a=n>this._editorElementWrap.offsetWidth-248?124-(n-(this._editorElementWrap.offsetWidth-248))/2:124:"right"===e&&(a=n>this._editorElementWrap.scrollWidth-248?(n-this._editorElementWrap.scrollWidth)/2:-124)),o.top=r+"px",o.left=a+"px"}}]),e}();t.default=L},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n\n \n
      \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    \n\n
    \n \n \n
    \n \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.biImage,n=e.commonStyle,i=e.headerStyle,o=e.loadButtonStyle,r=e.downloadButtonStyle,a=e.submenuStyle;return'\n
    \n
    \n \n
    \n \n \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.subMenuLabelActive,n=e.subMenuLabelNormal,i=e.subMenuRangeTitle,o=e.submenuPartitionVertical,r=e.submenuPartitionHorizontal,a=e.submenuCheckbox,s=e.submenuRangePointer,l=e.submenuRangeValue,c=e.submenuColorpickerTitle,u=e.submenuColorpickerButton,d=e.submenuRangeBar,h=e.submenuRangeSubbar,f=e.submenuDisabledRangePointer,p=e.submenuDisabledRangeBar,g=e.submenuDisabledRangeSubbar,v=e.submenuIconSize,m=e.menuIconSize,b=e.biSize;return'\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype="icon-bubble"] label,\n #tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype="icon-heart"] label,\n #tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype="icon-location"] label,\n #tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype="icon-polygon"] label,\n #tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype="icon-star"] label,\n #tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype="icon-arrow-3"] label,\n #tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype="icon-arrow-2"] label,\n #tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype="icon-arrow"] label,\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype="icon-bubble"] label,\n #tie-draw-line-select-button.line .tui-image-editor-button.line label,\n #tie-draw-line-select-button.free .tui-image-editor-button.free label,\n #tie-flip-button.flipX .tui-image-editor-button.flipX label,\n #tie-flip-button.flipY .tui-image-editor-button.flipY label,\n #tie-flip-button.resetFlip .tui-image-editor-button.resetFlip label,\n #tie-crop-button .tui-image-editor-button.apply.active label,\n #tie-shape-button.rect .tui-image-editor-button.rect label,\n #tie-shape-button.circle .tui-image-editor-button.circle label,\n #tie-shape-button.triangle .tui-image-editor-button.triangle label,\n #tie-text-effect-button .tui-image-editor-button.active label,\n #tie-text-align-button.left .tui-image-editor-button.left label,\n #tie-text-align-button.center .tui-image-editor-button.center label,\n #tie-text-align-button.right .tui-image-editor-button.right label,\n #tie-mask-apply.apply.active .tui-image-editor-button.apply label,\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover > label,\n .tui-image-editor-container .tui-image-editor-checkbox input + label {\n '+t+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button > label,\n .tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label {\n "+n+"\n }\n .tui-image-editor-container .tui-image-editor-range-wrap label {\n "+i+"\n }\n .tui-image-editor-container .tui-image-editor-partition > div {\n "+o+"\n }\n .tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition > div,\n .tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition > div {\n "+r+"\n }\n .tui-image-editor-container .tui-image-editor-checkbox input + label:before {\n "+a+"\n }\n .tui-image-editor-container .tui-image-editor-checkbox input:checked + label:before {\n border: 0;\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-pointer {\n "+s+"\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-bar {\n "+d+"\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-subbar {\n "+h+"\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-pointer {\n "+f+"\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-subbar {\n "+g+"\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-bar {\n "+p+"\n }\n .tui-image-editor-container .tui-image-editor-range-value {\n "+l+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value + label {\n "+c+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value {\n "+u+"\n }\n .tui-image-editor-container .svg_ic-menu {\n "+m+"\n }\n .tui-image-editor-container .svg_ic-submenu {\n "+v+"\n }\n .tui-image-editor-container .tui-image-editor-controls-logo > img,\n .tui-image-editor-container .tui-image-editor-header-logo > img {\n "+b+"\n }\n\n"}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n \n \n \n \n \n
      \n
      \n \n \n \n \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(){return'\n
      \n
    • \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n\n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    \n'; -}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n \n \n \n \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n-1&&"none"!==e&&(e="url("+e+")"),n.push(t._toUnderScore(i)+": "+e)}),n.join(";")}},{key:"_toUnderScore",value:function(e){return e.replace(/([A-Z])/g,function(e,t){return"-"+t.toLowerCase()})}}]),e}();t.default=h},function(e,t){e.exports=function(){}},function(e,t){e.exports=function(e,t,n,i){if(!(e instanceof t)||void 0!==i&&i in e)throw TypeError(n+": incorrect invocation!");return e}},function(e,t,n){var i=n(30),o=n(42),r=n(139);e.exports=function(e){return function(t,n,a){var s,l=i(t),c=o(l.length),u=r(a,c);if(e&&n!=n){for(;c>u;)if(s=l[u++],s!=s)return!0}else for(;c>u;u++)if((e||u in l)&&l[u]===n)return e||u||0;return!e&&-1}}},function(e,t,n){var i=n(20),o=n(124),r=n(123),a=n(11),s=n(42),l=n(142),c={},u={},t=e.exports=function(e,t,n,d,h){var f,p,g,v,m=h?function(){return e}:l(e),b=i(n,d,t?2:1),y=0;if("function"!=typeof m)throw TypeError(e+" is not iterable!");if(r(m)){for(f=s(e.length);f>y;y++)if(v=t?b(a(p=e[y])[0],p[1]):b(e[y]),v===c||v===u)return v}else for(g=m.call(e);!(p=g.next()).done;)if(v=o(g,b,p.value,t),v===c||v===u)return v};t.BREAK=c,t.RETURN=u},function(e,t,n){e.exports=!n(17)&&!n(35)(function(){return 7!=Object.defineProperty(n(26)("div"),"a",{get:function(){return 7}}).a})},function(e,t){e.exports=function(e,t,n){var i=void 0===n;switch(t.length){case 0:return i?e():e.call(n);case 1:return i?e(t[0]):e.call(n,t[0]);case 2:return i?e(t[0],t[1]):e.call(n,t[0],t[1]);case 3:return i?e(t[0],t[1],t[2]):e.call(n,t[0],t[1],t[2]);case 4:return i?e(t[0],t[1],t[2],t[3]):e.call(n,t[0],t[1],t[2],t[3])}return e.apply(n,t)}},function(e,t,n){var i=n(19);e.exports=Object("z").propertyIsEnumerable(0)?Object:function(e){return"String"==i(e)?e.split(""):Object(e)}},function(e,t,n){var i=n(18),o=n(7)("iterator"),r=Array.prototype;e.exports=function(e){return void 0!==e&&(i.Array===e||r[o]===e)}},function(e,t,n){var i=n(11);e.exports=function(e,t,n,o){try{return o?t(i(n)[0],n[1]):t(n)}catch(t){var r=e.return;throw void 0!==r&&i(r.call(e)),t}}},function(e,t,n){"use strict";var i=n(129),o=n(39),r=n(27),a={};n(12)(a,n(7)("iterator"),function(){return this}),e.exports=function(e,t,n){e.prototype=i(a,{next:o(1,n)}),r(e,t+" Iterator")}},function(e,t,n){var i=n(7)("iterator"),o=!1;try{var r=[7][i]();r.return=function(){o=!0},Array.from(r,function(){throw 2})}catch(e){}e.exports=function(e,t){if(!t&&!o)return!1;var n=!1;try{var r=[7],a=r[i]();a.next=function(){return{done:n=!0}},r[i]=function(){return a},e(r)}catch(e){}return n}},function(e,t){e.exports=function(e,t){return{value:t,done:!!e}}},function(e,t,n){var i=n(9),o=n(41).set,r=i.MutationObserver||i.WebKitMutationObserver,a=i.process,s=i.Promise,l="process"==n(19)(a);e.exports=function(){var e,t,n,c=function(){var i,o;for(l&&(i=a.domain)&&i.exit();e;){o=e.fn,e=e.next;try{o()}catch(i){throw e?n():t=void 0,i}}t=void 0,i&&i.enter()};if(l)n=function(){a.nextTick(c)};else if(r){var u=!0,d=document.createTextNode("");new r(c).observe(d,{characterData:!0}),n=function(){d.data=u=!u}}else if(s&&s.resolve){var h=s.resolve();n=function(){h.then(c)}}else n=function(){o.call(i,c)};return function(i){var o={fn:i,next:void 0};t&&(t.next=o),e||(e=o,n()),t=o}}},function(e,t,n){var i=n(11),o=n(130),r=n(33),a=n(28)("IE_PROTO"),s=function(){},l="prototype",c=function(){var e,t=n(26)("iframe"),i=r.length,o="<",a=">";for(t.style.display="none",n(36).appendChild(t),t.src="javascript:",e=t.contentWindow.document,e.open(),e.write(o+"script"+a+"document.F=Object"+o+"/script"+a),e.close(),c=e.F;i--;)delete c[l][r[i]];return c()};e.exports=Object.create||function(e,t){var n;return null!==e?(s[l]=i(e),n=new s,s[l]=null,n[a]=e):n=c(),void 0===t?n:o(n,t)}},function(e,t,n){var i=n(23),o=n(11),r=n(133);e.exports=n(17)?Object.defineProperties:function(e,t){o(e);for(var n,a=r(t),s=a.length,l=0;s>l;)i.f(e,n=a[l++],t[n]);return e}},function(e,t,n){var i=n(21),o=n(140),r=n(28)("IE_PROTO"),a=Object.prototype;e.exports=Object.getPrototypeOf||function(e){return e=o(e),i(e,r)?e[r]:"function"==typeof e.constructor&&e instanceof e.constructor?e.constructor.prototype:e instanceof Object?a:null}},function(e,t,n){var i=n(21),o=n(30),r=n(118)(!1),a=n(28)("IE_PROTO");e.exports=function(e,t){var n,s=o(e),l=0,c=[];for(n in s)n!=a&&i(s,n)&&c.push(n);for(;t.length>l;)i(s,n=t[l++])&&(~r(c,n)||c.push(n));return c}},function(e,t,n){var i=n(132),o=n(33);e.exports=Object.keys||function(e){return i(e,o)}},function(e,t,n){var i=n(12);e.exports=function(e,t,n){for(var o in t)n&&e[o]?e[o]=t[o]:i(e,o,t[o]);return e}},function(e,t,n){e.exports=n(12)},function(e,t,n){"use strict";var i=n(9),o=n(16),r=n(23),a=n(17),s=n(7)("species");e.exports=function(e){var t="function"==typeof o[e]?o[e]:i[e];a&&t&&!t[s]&&r.f(t,s,{configurable:!0,get:function(){return this}})}},function(e,t,n){var i=n(11),o=n(24),r=n(7)("species");e.exports=function(e,t){var n,a=i(e).constructor;return void 0===a||void 0==(n=i(a)[r])?t:o(n)}},function(e,t,n){var i=n(29),o=n(25);e.exports=function(e){return function(t,n){var r,a,s=String(o(t)),l=i(n),c=s.length;return l<0||l>=c?e?"":void 0:(r=s.charCodeAt(l),r<55296||r>56319||l+1===c||(a=s.charCodeAt(l+1))<56320||a>57343?e?s.charAt(l):r:e?s.slice(l,l+2):(r-55296<<10)+(a-56320)+65536)}}},function(e,t,n){var i=n(29),o=Math.max,r=Math.min;e.exports=function(e,t){return e=i(e),e<0?o(e+t,0):r(e,t)}},function(e,t,n){var i=n(25);e.exports=function(e){return Object(i(e))}},function(e,t,n){var i=n(22);e.exports=function(e,t){if(!i(e))return e;var n,o;if(t&&"function"==typeof(n=e.toString)&&!i(o=n.call(e)))return o;if("function"==typeof(n=e.valueOf)&&!i(o=n.call(e)))return o;if(!t&&"function"==typeof(n=e.toString)&&!i(o=n.call(e)))return o;throw TypeError("Can't convert object to primitive value")}},function(e,t,n){var i=n(32),o=n(7)("iterator"),r=n(18);e.exports=n(16).getIteratorMethod=function(e){if(void 0!=e)return e[o]||e["@@iterator"]||r[i(e)]}},function(e,t,n){"use strict";var i=n(116),o=n(127),r=n(18),a=n(30);e.exports=n(37)(Array,"Array",function(e,t){this._t=a(e),this._i=0,this._k=t},function(){var e=this._t,t=this._k,n=this._i++;return!e||n>=e.length?(this._t=void 0,o(1)):"keys"==t?o(0,n):"values"==t?o(0,e[n]):o(0,[n,e[n]])},"values"),r.Arguments=r.Array,i("keys"),i("values"),i("entries")},function(e,t){},function(e,t,n){"use strict";var i,o,r,a=n(38),s=n(9),l=n(20),c=n(32),u=n(34),d=n(22),h=n(24),f=n(117),p=n(119),g=n(137),v=n(41).set,m=n(128)(),b="Promise",y=s.TypeError,_=s.process,k=s[b],_=s.process,w="process"==c(_),x=function(){},E=!!function(){try{var e=k.resolve(1),t=(e.constructor={})[n(7)("species")]=function(e){e(x,x)};return(w||"function"==typeof PromiseRejectionEvent)&&e.then(x)instanceof t}catch(e){}}(),C=function(e,t){return e===t||e===k&&t===r},O=function(e){var t;return!(!d(e)||"function"!=typeof(t=e.then))&&t},S=function(e){return C(k,e)?new M(e):new o(e)},M=o=function(e){var t,n;this.promise=new e(function(e,i){if(void 0!==t||void 0!==n)throw y("Bad Promise constructor");t=e,n=i}),this.resolve=h(t),this.reject=h(n)},j=function(e){try{e()}catch(e){return{error:e}}},T=function(e,t){if(!e._n){e._n=!0;var n=e._c;m(function(){for(var i=e._v,o=1==e._s,r=0,a=function(t){var n,r,a=o?t.ok:t.fail,s=t.resolve,l=t.reject,c=t.domain;try{a?(o||(2==e._h&&D(e),e._h=1),a===!0?n=i:(c&&c.enter(),n=a(i),c&&c.exit()),n===t.promise?l(y("Promise-chain cycle")):(r=O(n))?r.call(n,s,l):s(n)):l(i)}catch(e){l(e)}};n.length>r;)a(n[r++]);e._c=[],e._n=!1,t&&!e._h&&P(e)})}},P=function(e){v.call(s,function(){var t,n,i,o=e._v;if(A(e)&&(t=j(function(){w?_.emit("unhandledRejection",o,e):(n=s.onunhandledrejection)?n({promise:e,reason:o}):(i=s.console)&&i.error&&i.error("Unhandled promise rejection",o)}),e._h=w||A(e)?2:1),e._a=void 0,t)throw t.error})},A=function(e){if(1==e._h)return!1;for(var t,n=e._a||e._c,i=0;n.length>i;)if(t=n[i++],t.fail||!A(t.promise))return!1;return!0},D=function(e){v.call(s,function(){var t;w?_.emit("rejectionHandled",e):(t=s.onrejectionhandled)&&t({promise:e,reason:e._v})})},I=function(e){var t=this;t._d||(t._d=!0,t=t._w||t,t._v=e,t._s=2,t._a||(t._a=t._c.slice()),T(t,!0))},R=function(e){var t,n=this;if(!n._d){n._d=!0,n=n._w||n;try{if(n===e)throw y("Promise can't be resolved itself");(t=O(e))?m(function(){var i={_w:n,_d:!1};try{t.call(e,l(R,i,1),l(I,i,1))}catch(e){I.call(i,e)}}):(n._v=e,n._s=1,T(n,!1))}catch(e){I.call({_w:n,_d:!1},e)}}};E||(k=function(e){f(this,k,b,"_h"),h(e),i.call(this);try{e(l(R,this,1),l(I,this,1))}catch(e){I.call(this,e)}},i=function(e){this._c=[],this._a=void 0,this._s=0,this._d=!1,this._v=void 0,this._h=0,this._n=!1},i.prototype=n(134)(k.prototype,{then:function(e,t){var n=S(g(this,k));return n.ok="function"!=typeof e||e,n.fail="function"==typeof t&&t,n.domain=w?_.domain:void 0,this._c.push(n),this._a&&this._a.push(n),this._s&&T(this,!1),n.promise},catch:function(e){return this.then(void 0,e)}}),M=function(){var e=new i;this.promise=e,this.resolve=l(R,e,1),this.reject=l(I,e,1)}),u(u.G+u.W+u.F*!E,{Promise:k}),n(27)(k,b),n(136)(b),r=n(16)[b],u(u.S+u.F*!E,b,{reject:function(e){var t=S(this),n=t.reject;return n(e),t.promise}}),u(u.S+u.F*(a||!E),b,{resolve:function(e){if(e instanceof k&&C(e.constructor,this))return e;var t=S(this),n=t.resolve;return n(e),t.promise}}),u(u.S+u.F*!(E&&n(126)(function(e){k.all(e).catch(x)})),b,{all:function(e){var t=this,n=S(t),i=n.resolve,o=n.reject,r=j(function(){var n=[],r=0,a=1;p(e,!1,function(e){var s=r++,l=!1;n.push(void 0),a++,t.resolve(e).then(function(e){l||(l=!0,n[s]=e,--a||i(n))},o)}),--a||i(n)});return r&&o(r.error),n.promise},race:function(e){var t=this,n=S(t),i=n.reject,o=j(function(){p(e,!1,function(e){t.resolve(e).then(n.resolve,i)})});return o&&i(o.error),n.promise}})},function(e,t,n){"use strict";var i=n(138)(!0);n(37)(String,"String",function(e){this._t=String(e),this._i=0},function(){var e,t=this._t,n=this._i;return n>=t.length?{value:void 0,done:!0}:(e=i(t,n),this._i+=e.length,{value:e,done:!1})})},function(e,t,n){n(143);for(var i=n(9),o=n(12),r=n(18),a=n(7)("toStringTag"),s=["NodeList","DOMTokenList","MediaList","StyleSheetList","CSSRuleList"],l=0;l<5;l++){var c=s[l],u=i[c],d=u&&u.prototype;d&&!d[a]&&o(d,a,c),r[c]=r.Array}},function(e,t){},function(e,t,n){/*! +function(){if("undefined"!=typeof window&&window.addEventListener){var e,t,n=Object.create(null),i=function(){clearTimeout(t),t=setTimeout(e,100)},o=function(){},r=function(){var e;window.addEventListener("resize",i,!1),window.addEventListener("orientationchange",i,!1),window.MutationObserver?(e=new MutationObserver(i),e.observe(document.documentElement,{childList:!0,subtree:!0,attributes:!0}),o=function(){try{e.disconnect(),window.removeEventListener("resize",i,!1),window.removeEventListener("orientationchange",i,!1)}catch(e){}}):(document.documentElement.addEventListener("DOMSubtreeModified",i,!1),o=function(){document.documentElement.removeEventListener("DOMSubtreeModified",i,!1),window.removeEventListener("resize",i,!1),window.removeEventListener("orientationchange",i,!1)})},a=function(e){function t(e){var t;return void 0!==e.protocol?t=e:(t=document.createElement("a"),t.href=e),t.protocol.replace(/:/g,"")+t.host}var n,i,o;return window.XMLHttpRequest&&(n=new XMLHttpRequest,i=t(location),o=t(e),n=void 0===n.withCredentials&&""!==o&&o!==i?XDomainRequest||void 0:XMLHttpRequest),n},s="http://www.w3.org/1999/xlink";e=function(){function e(){_-=1,0===_&&(o(),r())}function t(e){return function(){n[e.base]!==!0&&(e.useEl.setAttributeNS(s,"xlink:href","#"+e.hash),e.useEl.hasAttribute("href")&&e.useEl.setAttribute("href","#"+e.hash))}}function i(t){return function(){var n,i=document.body,o=document.createElement("x");t.onload=null,o.innerHTML=t.responseText,n=o.getElementsByTagName("svg")[0],n&&(n.setAttribute("aria-hidden","true"),n.style.position="absolute",n.style.width=0,n.style.height=0,n.style.overflow="hidden",i.insertBefore(n,i.firstChild)),e()}}function l(t){return function(){t.onerror=null,t.ontimeout=null,e()}}var c,u,d,h,f,p,g,v,m,b,y="",_=0;for(o(),m=document.getElementsByTagName("use"),f=0;f0&&void 0!==arguments[0]?arguments[0]:{},t=e.uiSize,n=e.imageSize,i=void 0===n?this.imageSize:n;i!==this.imageSize&&(this.imageSize=i),t&&this._setUiSize(t);var o=this._getEditorDimension(),r=o.width,a=o.height,s=this._editorElement.style,l=this.options.menuBarPosition;s.height=a+"px",s.width=r+"px",this._setEditorPosition(l),this._editorElementWrap.style.bottom="0px",this._editorElementWrap.style.top="0px",this._editorElementWrap.style.left="0px",this._editorElementWrap.style.width="100%";var c=this._selectedElement.classList;"top"===l&&this._selectedElement.offsetWidth0&&void 0!==arguments[0]?arguments[0]:this.options.uiSize,t=this._selectedElement.style;t.width=e.width,t.height=e.height}},{key:"_makeSubMenu",value:function(){var e=this;s.default.forEach(this.options.menu,function(t){var n=I[t.replace(/^[a-z]/,function(e){return e.toUpperCase()})];e._makeMenuElement(t),e._els[t]=e._menuElement.querySelector("#tie-btn-"+t),e[t]=new n(e._subMenuElement,{iconStyle:e.theme.getStyle("submenu.icon"),menuBarPosition:e.options.menuBarPosition})})}},{key:"_makeUiElement",value:function(e){var t=void 0;window.snippet=s.default,t=e.jquery?e[0]:e.nodeType?e:document.querySelector(e);var n=c.default.getSelector(t);t.classList.add("tui-image-editor-container"),t.innerHTML=(0,f.default)({biImage:this.theme.getStyle("common.bi"),iconStyle:this.theme.getStyle("menu.icon"),loadButtonStyle:this.theme.getStyle("loadButton"),downloadButtonStyle:this.theme.getStyle("downloadButton")})+(0,d.default)({biImage:this.theme.getStyle("common.bi"),commonStyle:this.theme.getStyle("common"),headerStyle:this.theme.getStyle("header"),loadButtonStyle:this.theme.getStyle("loadButton"),downloadButtonStyle:this.theme.getStyle("downloadButton"),submenuStyle:this.theme.getStyle("submenu")}),this._selectedElement=t,this._selectedElement.classList.add(this.options.menuBarPosition),this._mainElement=n(".tui-image-editor-main"),this._editorElementWrap=n(".tui-image-editor-wrap"),this._editorElement=n(".tui-image-editor"),this._menuElement=n(".tui-image-editor-menu"),this._subMenuElement=n(".tui-image-editor-submenu")}},{key:"_makeMenuElement",value:function(e){var t=document.createElement("li"),n=this.theme.getStyle("menu.icon"),i=n.normal,o=n.active,r=n.hover,a='\n \n \n \n \n \n ';t.id="tie-btn-"+e,t.className="tui-image-editor-item normal",t.title=e.replace(/^[a-z]/g,function(e){return e.toUpperCase()}),t.innerHTML=a,this._menuElement.appendChild(t)}},{key:"_addHelpActionEvent",value:function(e){var t=this;this._els[e].addEventListener("click",function(){t._actions.main[e]()})}},{key:"_addDownloadEvent",value:function(){var e=this;s.default.forEach(this._els.download,function(t){t.addEventListener("click",function(){e._actions.main.download()})})}},{key:"_addLoadEvent",value:function(){var e=this;s.default.forEach(this._els.load,function(t){t.addEventListener("change",function(t){e._actions.main.load(t.target.files[0])})})}},{key:"_addMenuEvent",value:function(e){var t=this;this._els[e].addEventListener("click",function(){t.changeMenu(e)})}},{key:"_addSubMenuEvent",value:function(e){this[e].addEvent(this._actions[e])}},{key:"getEditorArea",value:function(){return this._editorElement}},{key:"activeMenuEvent",value:function(){var e=this;this._initMenuEvent||(this._addHelpActionEvent("undo"),this._addHelpActionEvent("redo"),this._addHelpActionEvent("reset"),this._addHelpActionEvent("delete"),this._addHelpActionEvent("deleteAll"),this._addDownloadEvent(),s.default.forEach(this.options.menu,function(t){e._addMenuEvent(t),e._addSubMenuEvent(t)}),this._initMenu(),this._initMenuEvent=!0)}},{key:"initCanvas",value:function(){var e=this,t=this._getLoadImage();t.path&&this._actions.main.initLoadImage(t.path,t.name).then(function(){e.activeMenuEvent()}),this._addLoadEvent();var n=document.createElement("div");n.className="tui-image-editor-grid-visual";var i='\n \n \n \n
    ';n.innerHTML=i,this._editorContainerElement=this._editorElement.querySelector(".tui-image-editor-canvas-container"),this._editorContainerElement.appendChild(n)}},{key:"_getLoadImage",value:function(){return this.options.loadImage}},{key:"changeMenu",value:function(e){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],n=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];this._submenuChangeTransection||(this._submenuChangeTransection=!0,this._changeMenu(e,t,n),this._submenuChangeTransection=!1)}},{key:"_changeMenu",value:function(e,t,n){this.submenu&&(this._els[this.submenu].classList.remove("active"),this._mainElement.classList.remove("tui-image-editor-menu-"+this.submenu),n&&this._actions.main.discardSelection(),this._actions.main.changeSelectableAll(!0),this[this.submenu].changeStandbyMode()),this.submenu===e&&t?this.submenu=null:(this._els[e].classList.add("active"),this._mainElement.classList.add("tui-image-editor-menu-"+e),this.submenu=e,this[this.submenu].changeStartMode()),this.resizeEditor()}},{key:"_initMenu",value:function(){if(this.options.initMenu){var e=document.createEvent("MouseEvents");e.initEvent("click",!0,!1),this._els[this.options.initMenu].dispatchEvent(e),this.icon&&this.icon.registDefaultIcon()}}},{key:"_getEditorDimension",value:function(){var e=parseFloat(this._editorContainerElement.style.maxHeight),t=this.imageSize.newHeight>e?e:this.imageSize.newHeight,n=parseFloat(this._editorContainerElement.style.maxWidth),i=this.imageSize.newWidth>n?n:this.imageSize.newWidth;return{width:i,height:t}}},{key:"_setEditorPosition",value:function(e){var t=this._getEditorDimension(),n=t.width,i=t.height,o=this._editorElement.style,r=0,a=0;this.submenu&&("bottom"===e?r=i>this._editorElementWrap.scrollHeight-150?(i-this._editorElementWrap.scrollHeight)/2:-75:"top"===e?r=i>this._editorElementWrap.offsetHeight-150?75-(i-(this._editorElementWrap.offsetHeight-150))/2:75:"left"===e?a=n>this._editorElementWrap.offsetWidth-248?124-(n-(this._editorElementWrap.offsetWidth-248))/2:124:"right"===e&&(a=n>this._editorElementWrap.scrollWidth-248?(n-this._editorElementWrap.scrollWidth)/2:-124)),o.top=r+"px",o.left=a+"px"}}]),e}();t.default=L},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n\n \n
      \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    \n\n
    \n \n \n
    \n \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.biImage,n=e.commonStyle,i=e.headerStyle,o=e.loadButtonStyle,r=e.downloadButtonStyle,a=e.submenuStyle;return'\n
    \n
    \n \n
    \n \n \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.subMenuLabelActive,n=e.subMenuLabelNormal,i=e.subMenuRangeTitle,o=e.submenuPartitionVertical,r=e.submenuPartitionHorizontal,a=e.submenuCheckbox,s=e.submenuRangePointer,l=e.submenuRangeValue,c=e.submenuColorpickerTitle,u=e.submenuColorpickerButton,d=e.submenuRangeBar,h=e.submenuRangeSubbar,f=e.submenuDisabledRangePointer,p=e.submenuDisabledRangeBar,g=e.submenuDisabledRangeSubbar,v=e.submenuIconSize,m=e.menuIconSize,b=e.biSize;return'\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype="icon-bubble"] label,\n #tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype="icon-heart"] label,\n #tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype="icon-location"] label,\n #tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype="icon-polygon"] label,\n #tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype="icon-star"] label,\n #tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype="icon-arrow-3"] label,\n #tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype="icon-arrow-2"] label,\n #tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype="icon-arrow"] label,\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype="icon-bubble"] label,\n #tie-draw-line-select-button.line .tui-image-editor-button.line label,\n #tie-draw-line-select-button.free .tui-image-editor-button.free label,\n #tie-flip-button.flipX .tui-image-editor-button.flipX label,\n #tie-flip-button.flipY .tui-image-editor-button.flipY label,\n #tie-flip-button.resetFlip .tui-image-editor-button.resetFlip label,\n #tie-crop-button .tui-image-editor-button.apply.active label,\n #tie-shape-button.rect .tui-image-editor-button.rect label,\n #tie-shape-button.circle .tui-image-editor-button.circle label,\n #tie-shape-button.triangle .tui-image-editor-button.triangle label,\n #tie-text-effect-button .tui-image-editor-button.active label,\n #tie-text-align-button.left .tui-image-editor-button.left label,\n #tie-text-align-button.center .tui-image-editor-button.center label,\n #tie-text-align-button.right .tui-image-editor-button.right label,\n #tie-mask-apply.apply.active .tui-image-editor-button.apply label,\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover > label,\n .tui-image-editor-container .tui-image-editor-checkbox input + label {\n '+t+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button > label,\n .tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label {\n "+n+"\n }\n .tui-image-editor-container .tui-image-editor-range-wrap label {\n "+i+"\n }\n .tui-image-editor-container .tui-image-editor-partition > div {\n "+o+"\n }\n .tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition > div,\n .tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition > div {\n "+r+"\n }\n .tui-image-editor-container .tui-image-editor-checkbox input + label:before {\n "+a+"\n }\n .tui-image-editor-container .tui-image-editor-checkbox input:checked + label:before {\n border: 0;\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-pointer {\n "+s+"\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-bar {\n "+d+"\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-subbar {\n "+h+"\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-pointer {\n "+f+"\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-subbar {\n "+g+"\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-bar {\n "+p+"\n }\n .tui-image-editor-container .tui-image-editor-range-value {\n "+l+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value + label {\n "+c+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value {\n "+u+"\n }\n .tui-image-editor-container .svg_ic-menu {\n "+m+"\n }\n .tui-image-editor-container .svg_ic-submenu {\n "+v+"\n }\n .tui-image-editor-container .tui-image-editor-controls-logo > img,\n .tui-image-editor-container .tui-image-editor-header-logo > img {\n "+b+"\n }\n\n"}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n \n \n \n \n \n
      \n
      \n \n \n \n \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(){return'\n
      \n
    • \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n\n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    \n'; +}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n \n \n \n \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n-1&&"none"!==e&&(e="url("+e+")"),n.push(t._toUnderScore(i)+": "+e)}),n.join(";")}},{key:"_toUnderScore",value:function(e){return e.replace(/([A-Z])/g,function(e,t){return"-"+t.toLowerCase()})}}]),e}();t.default=h},function(e,t){e.exports=function(){}},function(e,t){e.exports=function(e,t,n,i){if(!(e instanceof t)||void 0!==i&&i in e)throw TypeError(n+": incorrect invocation!");return e}},function(e,t,n){var i=n(30),o=n(42),r=n(139);e.exports=function(e){return function(t,n,a){var s,l=i(t),c=o(l.length),u=r(a,c);if(e&&n!=n){for(;c>u;)if(s=l[u++],s!=s)return!0}else for(;c>u;u++)if((e||u in l)&&l[u]===n)return e||u||0;return!e&&-1}}},function(e,t,n){var i=n(20),o=n(124),r=n(123),a=n(11),s=n(42),l=n(142),c={},u={},t=e.exports=function(e,t,n,d,h){var f,p,g,v,m=h?function(){return e}:l(e),b=i(n,d,t?2:1),y=0;if("function"!=typeof m)throw TypeError(e+" is not iterable!");if(r(m)){for(f=s(e.length);f>y;y++)if(v=t?b(a(p=e[y])[0],p[1]):b(e[y]),v===c||v===u)return v}else for(g=m.call(e);!(p=g.next()).done;)if(v=o(g,b,p.value,t),v===c||v===u)return v};t.BREAK=c,t.RETURN=u},function(e,t,n){e.exports=!n(17)&&!n(35)(function(){return 7!=Object.defineProperty(n(26)("div"),"a",{get:function(){return 7}}).a})},function(e,t){e.exports=function(e,t,n){var i=void 0===n;switch(t.length){case 0:return i?e():e.call(n);case 1:return i?e(t[0]):e.call(n,t[0]);case 2:return i?e(t[0],t[1]):e.call(n,t[0],t[1]);case 3:return i?e(t[0],t[1],t[2]):e.call(n,t[0],t[1],t[2]);case 4:return i?e(t[0],t[1],t[2],t[3]):e.call(n,t[0],t[1],t[2],t[3])}return e.apply(n,t)}},function(e,t,n){var i=n(19);e.exports=Object("z").propertyIsEnumerable(0)?Object:function(e){return"String"==i(e)?e.split(""):Object(e)}},function(e,t,n){var i=n(18),o=n(7)("iterator"),r=Array.prototype;e.exports=function(e){return void 0!==e&&(i.Array===e||r[o]===e)}},function(e,t,n){var i=n(11);e.exports=function(e,t,n,o){try{return o?t(i(n)[0],n[1]):t(n)}catch(t){var r=e.return;throw void 0!==r&&i(r.call(e)),t}}},function(e,t,n){"use strict";var i=n(129),o=n(39),r=n(27),a={};n(12)(a,n(7)("iterator"),function(){return this}),e.exports=function(e,t,n){e.prototype=i(a,{next:o(1,n)}),r(e,t+" Iterator")}},function(e,t,n){var i=n(7)("iterator"),o=!1;try{var r=[7][i]();r.return=function(){o=!0},Array.from(r,function(){throw 2})}catch(e){}e.exports=function(e,t){if(!t&&!o)return!1;var n=!1;try{var r=[7],a=r[i]();a.next=function(){return{done:n=!0}},r[i]=function(){return a},e(r)}catch(e){}return n}},function(e,t){e.exports=function(e,t){return{value:t,done:!!e}}},function(e,t,n){var i=n(9),o=n(41).set,r=i.MutationObserver||i.WebKitMutationObserver,a=i.process,s=i.Promise,l="process"==n(19)(a);e.exports=function(){var e,t,n,c=function(){var i,o;for(l&&(i=a.domain)&&i.exit();e;){o=e.fn,e=e.next;try{o()}catch(i){throw e?n():t=void 0,i}}t=void 0,i&&i.enter()};if(l)n=function(){a.nextTick(c)};else if(r){var u=!0,d=document.createTextNode("");new r(c).observe(d,{characterData:!0}),n=function(){d.data=u=!u}}else if(s&&s.resolve){var h=s.resolve();n=function(){h.then(c)}}else n=function(){o.call(i,c)};return function(i){var o={fn:i,next:void 0};t&&(t.next=o),e||(e=o,n()),t=o}}},function(e,t,n){var i=n(11),o=n(130),r=n(33),a=n(28)("IE_PROTO"),s=function(){},l="prototype",c=function(){var e,t=n(26)("iframe"),i=r.length,o="<",a=">";for(t.style.display="none",n(36).appendChild(t),t.src="javascript:",e=t.contentWindow.document,e.open(),e.write(o+"script"+a+"document.F=Object"+o+"/script"+a),e.close(),c=e.F;i--;)delete c[l][r[i]];return c()};e.exports=Object.create||function(e,t){var n;return null!==e?(s[l]=i(e),n=new s,s[l]=null,n[a]=e):n=c(),void 0===t?n:o(n,t)}},function(e,t,n){var i=n(23),o=n(11),r=n(133);e.exports=n(17)?Object.defineProperties:function(e,t){o(e);for(var n,a=r(t),s=a.length,l=0;s>l;)i.f(e,n=a[l++],t[n]);return e}},function(e,t,n){var i=n(21),o=n(140),r=n(28)("IE_PROTO"),a=Object.prototype;e.exports=Object.getPrototypeOf||function(e){return e=o(e),i(e,r)?e[r]:"function"==typeof e.constructor&&e instanceof e.constructor?e.constructor.prototype:e instanceof Object?a:null}},function(e,t,n){var i=n(21),o=n(30),r=n(118)(!1),a=n(28)("IE_PROTO");e.exports=function(e,t){var n,s=o(e),l=0,c=[];for(n in s)n!=a&&i(s,n)&&c.push(n);for(;t.length>l;)i(s,n=t[l++])&&(~r(c,n)||c.push(n));return c}},function(e,t,n){var i=n(132),o=n(33);e.exports=Object.keys||function(e){return i(e,o)}},function(e,t,n){var i=n(12);e.exports=function(e,t,n){for(var o in t)n&&e[o]?e[o]=t[o]:i(e,o,t[o]);return e}},function(e,t,n){e.exports=n(12)},function(e,t,n){"use strict";var i=n(9),o=n(16),r=n(23),a=n(17),s=n(7)("species");e.exports=function(e){var t="function"==typeof o[e]?o[e]:i[e];a&&t&&!t[s]&&r.f(t,s,{configurable:!0,get:function(){return this}})}},function(e,t,n){var i=n(11),o=n(24),r=n(7)("species");e.exports=function(e,t){var n,a=i(e).constructor;return void 0===a||void 0==(n=i(a)[r])?t:o(n)}},function(e,t,n){var i=n(29),o=n(25);e.exports=function(e){return function(t,n){var r,a,s=String(o(t)),l=i(n),c=s.length;return l<0||l>=c?e?"":void 0:(r=s.charCodeAt(l),r<55296||r>56319||l+1===c||(a=s.charCodeAt(l+1))<56320||a>57343?e?s.charAt(l):r:e?s.slice(l,l+2):(r-55296<<10)+(a-56320)+65536)}}},function(e,t,n){var i=n(29),o=Math.max,r=Math.min;e.exports=function(e,t){return e=i(e),e<0?o(e+t,0):r(e,t)}},function(e,t,n){var i=n(25);e.exports=function(e){return Object(i(e))}},function(e,t,n){var i=n(22);e.exports=function(e,t){if(!i(e))return e;var n,o;if(t&&"function"==typeof(n=e.toString)&&!i(o=n.call(e)))return o;if("function"==typeof(n=e.valueOf)&&!i(o=n.call(e)))return o;if(!t&&"function"==typeof(n=e.toString)&&!i(o=n.call(e)))return o;throw TypeError("Can't convert object to primitive value")}},function(e,t,n){var i=n(32),o=n(7)("iterator"),r=n(18);e.exports=n(16).getIteratorMethod=function(e){if(void 0!=e)return e[o]||e["@@iterator"]||r[i(e)]}},function(e,t,n){"use strict";var i=n(116),o=n(127),r=n(18),a=n(30);e.exports=n(37)(Array,"Array",function(e,t){this._t=a(e),this._i=0,this._k=t},function(){var e=this._t,t=this._k,n=this._i++;return!e||n>=e.length?(this._t=void 0,o(1)):"keys"==t?o(0,n):"values"==t?o(0,e[n]):o(0,[n,e[n]])},"values"),r.Arguments=r.Array,i("keys"),i("values"),i("entries")},function(e,t){},function(e,t,n){"use strict";var i,o,r,a=n(38),s=n(9),l=n(20),c=n(32),u=n(34),d=n(22),h=n(24),f=n(117),p=n(119),g=n(137),v=n(41).set,m=n(128)(),b="Promise",y=s.TypeError,_=s.process,k=s[b],_=s.process,w="process"==c(_),x=function(){},E=!!function(){try{var e=k.resolve(1),t=(e.constructor={})[n(7)("species")]=function(e){e(x,x)};return(w||"function"==typeof PromiseRejectionEvent)&&e.then(x)instanceof t}catch(e){}}(),C=function(e,t){return e===t||e===k&&t===r},O=function(e){var t;return!(!d(e)||"function"!=typeof(t=e.then))&&t},S=function(e){return C(k,e)?new M(e):new o(e)},M=o=function(e){var t,n;this.promise=new e(function(e,i){if(void 0!==t||void 0!==n)throw y("Bad Promise constructor");t=e,n=i}),this.resolve=h(t),this.reject=h(n)},j=function(e){try{e()}catch(e){return{error:e}}},T=function(e,t){if(!e._n){e._n=!0;var n=e._c;m(function(){for(var i=e._v,o=1==e._s,r=0,a=function(t){var n,r,a=o?t.ok:t.fail,s=t.resolve,l=t.reject,c=t.domain;try{a?(o||(2==e._h&&D(e),e._h=1),a===!0?n=i:(c&&c.enter(),n=a(i),c&&c.exit()),n===t.promise?l(y("Promise-chain cycle")):(r=O(n))?r.call(n,s,l):s(n)):l(i)}catch(e){l(e)}};n.length>r;)a(n[r++]);e._c=[],e._n=!1,t&&!e._h&&P(e)})}},P=function(e){v.call(s,function(){var t,n,i,o=e._v;if(A(e)&&(t=j(function(){w?_.emit("unhandledRejection",o,e):(n=s.onunhandledrejection)?n({promise:e,reason:o}):(i=s.console)&&i.error&&i.error("Unhandled promise rejection",o)}),e._h=w||A(e)?2:1),e._a=void 0,t)throw t.error})},A=function(e){if(1==e._h)return!1;for(var t,n=e._a||e._c,i=0;n.length>i;)if(t=n[i++],t.fail||!A(t.promise))return!1;return!0},D=function(e){v.call(s,function(){var t;w?_.emit("rejectionHandled",e):(t=s.onrejectionhandled)&&t({promise:e,reason:e._v})})},I=function(e){var t=this;t._d||(t._d=!0,t=t._w||t,t._v=e,t._s=2,t._a||(t._a=t._c.slice()),T(t,!0))},R=function(e){var t,n=this;if(!n._d){n._d=!0,n=n._w||n;try{if(n===e)throw y("Promise can't be resolved itself");(t=O(e))?m(function(){var i={_w:n,_d:!1};try{t.call(e,l(R,i,1),l(I,i,1))}catch(e){I.call(i,e)}}):(n._v=e,n._s=1,T(n,!1))}catch(e){I.call({_w:n,_d:!1},e)}}};E||(k=function(e){f(this,k,b,"_h"),h(e),i.call(this);try{e(l(R,this,1),l(I,this,1))}catch(e){I.call(this,e)}},i=function(e){this._c=[],this._a=void 0,this._s=0,this._d=!1,this._v=void 0,this._h=0,this._n=!1},i.prototype=n(134)(k.prototype,{then:function(e,t){var n=S(g(this,k));return n.ok="function"!=typeof e||e,n.fail="function"==typeof t&&t,n.domain=w?_.domain:void 0,this._c.push(n),this._a&&this._a.push(n),this._s&&T(this,!1),n.promise},catch:function(e){return this.then(void 0,e)}}),M=function(){var e=new i;this.promise=e,this.resolve=l(R,e,1),this.reject=l(I,e,1)}),u(u.G+u.W+u.F*!E,{Promise:k}),n(27)(k,b),n(136)(b),r=n(16)[b],u(u.S+u.F*!E,b,{reject:function(e){var t=S(this),n=t.reject;return n(e),t.promise}}),u(u.S+u.F*(a||!E),b,{resolve:function(e){if(e instanceof k&&C(e.constructor,this))return e;var t=S(this),n=t.resolve;return n(e),t.promise}}),u(u.S+u.F*!(E&&n(126)(function(e){k.all(e).catch(x)})),b,{all:function(e){var t=this,n=S(t),i=n.resolve,o=n.reject,r=j(function(){var n=[],r=0,a=1;p(e,!1,function(e){var s=r++,l=!1;n.push(void 0),a++,t.resolve(e).then(function(e){l||(l=!0,n[s]=e,--a||i(n))},o)}),--a||i(n)});return r&&o(r.error),n.promise},race:function(e){var t=this,n=S(t),i=n.reject,o=j(function(){p(e,!1,function(e){t.resolve(e).then(n.resolve,i)})});return o&&i(o.error),n.promise}})},function(e,t,n){"use strict";var i=n(138)(!0);n(37)(String,"String",function(e){this._t=String(e),this._i=0},function(){var e,t=this._t,n=this._i;return n>=t.length?{value:void 0,done:!0}:(e=i(t,n),this._i+=e.length,{value:e,done:!1})})},function(e,t,n){n(143);for(var i=n(9),o=n(12),r=n(18),a=n(7)("toStringTag"),s=["NodeList","DOMTokenList","MediaList","StyleSheetList","CSSRuleList"],l=0;l<5;l++){var c=s[l],u=i[c],d=u&&u.prototype;d&&!d[a]&&o(d,a,c),r[c]=r.Array}},function(e,t){},function(e,t,n){/*! * Toast UI Colorpicker * @version 2.2.0 * @author NHNEnt FE Development Team From 103f8b3960c88ba9499a0731797a86caf9b7b12d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B9=80=EC=A7=84=EC=9A=B0?= Date: Fri, 7 Dec 2018 12:00:44 +0900 Subject: [PATCH 08/10] chore: version up dist file --- dist/tui-image-editor.css | 15 ++- dist/tui-image-editor.js | 196 ++++++++++++++++++++++++++++++++-- dist/tui-image-editor.min.css | 4 +- dist/tui-image-editor.min.js | 21 ++-- 4 files changed, 215 insertions(+), 21 deletions(-) diff --git a/dist/tui-image-editor.css b/dist/tui-image-editor.css index a6a3ab6fb..5284cdf75 100644 --- a/dist/tui-image-editor.css +++ b/dist/tui-image-editor.css @@ -1,6 +1,6 @@ /*! * tui-image-editor.js - * @version 3.2.2 + * @version 3.3.0 * @author NHNEnt FE Development Lab * @license MIT */ @@ -255,6 +255,9 @@ body > textarea { font-size: 11px; margin: 0 9px 0 9px; } +.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.preset { + margin: 0 9px 20px 5px; +} .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item label { display: inline-block; cursor: pointer; @@ -884,10 +887,16 @@ body > textarea { #tie-mask-apply.apply.active .tui-image-editor-button.apply svg > use.active { display: block; } -#tie-crop-button .tui-image-editor-button.apply { +#tie-crop-button .tui-image-editor-button.apply, +#tie-crop-preset-button .tui-image-editor-button.apply { margin-right: 24px; } -#tie-crop-button .tui-image-editor-button.apply.active svg > use.active { +#tie-crop-button .tui-image-editor-button.preset.active svg > use.active, +#tie-crop-preset-button .tui-image-editor-button.preset.active svg > use.active { + display: block; +} +#tie-crop-button .tui-image-editor-button.apply.active svg > use.active, +#tie-crop-preset-button .tui-image-editor-button.apply.active svg > use.active { display: block; } #tie-shape-button.rect .tui-image-editor-button.rect svg > use.normal, diff --git a/dist/tui-image-editor.js b/dist/tui-image-editor.js index adbcff886..ab405406f 100644 --- a/dist/tui-image-editor.js +++ b/dist/tui-image-editor.js @@ -1,6 +1,6 @@ /*! * tui-image-editor.js - * @version 3.2.2 + * @version 3.3.0 * @author NHNEnt FE Development Lab * @license MIT */ @@ -1384,6 +1384,18 @@ return /******/ (function(modules) { // webpackBootstrap return this._graphics.getCropzoneRect(); } + /** + * Set the cropping rect + * @param {Object} mode crop rect mode [1, 1.5, 1.3333333333333333, 1.25, 1.7777777777777777] + * @returns {Object} {{left: number, top: number, width: number, height: number}} rect + */ + + }, { + key: 'setCropzoneRect', + value: function setCropzoneRect(mode) { + return this._graphics.setCropzoneRect(mode); + } + /** * Flip * @returns {Promise} @@ -4575,7 +4587,7 @@ return /******/ (function(modules) { // webpackBootstrap } hostnameSent = true; - (0, _tuiCodeSnippet.sendHostname)('image-editor'); + (0, _tuiCodeSnippet.sendHostname)('image-editor', 'UA-129999381-1'); }, @@ -5898,7 +5910,7 @@ return /******/ (function(modules) { // webpackBootstrap submenuIconSize = _ref.submenuIconSize, menuIconSize = _ref.menuIconSize, biSize = _ref.biSize; - return "\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype=\"icon-bubble\"] label,\n #tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype=\"icon-heart\"] label,\n #tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype=\"icon-location\"] label,\n #tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype=\"icon-polygon\"] label,\n #tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype=\"icon-star\"] label,\n #tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype=\"icon-arrow-3\"] label,\n #tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype=\"icon-arrow-2\"] label,\n #tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype=\"icon-arrow\"] label,\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype=\"icon-bubble\"] label,\n #tie-draw-line-select-button.line .tui-image-editor-button.line label,\n #tie-draw-line-select-button.free .tui-image-editor-button.free label,\n #tie-flip-button.flipX .tui-image-editor-button.flipX label,\n #tie-flip-button.flipY .tui-image-editor-button.flipY label,\n #tie-flip-button.resetFlip .tui-image-editor-button.resetFlip label,\n #tie-crop-button .tui-image-editor-button.apply.active label,\n #tie-shape-button.rect .tui-image-editor-button.rect label,\n #tie-shape-button.circle .tui-image-editor-button.circle label,\n #tie-shape-button.triangle .tui-image-editor-button.triangle label,\n #tie-text-effect-button .tui-image-editor-button.active label,\n #tie-text-align-button.left .tui-image-editor-button.left label,\n #tie-text-align-button.center .tui-image-editor-button.center label,\n #tie-text-align-button.right .tui-image-editor-button.right label,\n #tie-mask-apply.apply.active .tui-image-editor-button.apply label,\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover > label,\n .tui-image-editor-container .tui-image-editor-checkbox input + label {\n " + subMenuLabelActive + "\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button > label,\n .tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label {\n " + subMenuLabelNormal + "\n }\n .tui-image-editor-container .tui-image-editor-range-wrap label {\n " + subMenuRangeTitle + "\n }\n .tui-image-editor-container .tui-image-editor-partition > div {\n " + submenuPartitionVertical + "\n }\n .tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition > div,\n .tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition > div {\n " + submenuPartitionHorizontal + "\n }\n .tui-image-editor-container .tui-image-editor-checkbox input + label:before {\n " + submenuCheckbox + "\n }\n .tui-image-editor-container .tui-image-editor-checkbox input:checked + label:before {\n border: 0;\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-pointer {\n " + submenuRangePointer + "\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-bar {\n " + submenuRangeBar + "\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-subbar {\n " + submenuRangeSubbar + "\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-pointer {\n " + submenuDisabledRangePointer + "\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-subbar {\n " + submenuDisabledRangeSubbar + "\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-bar {\n " + submenuDisabledRangeBar + "\n }\n .tui-image-editor-container .tui-image-editor-range-value {\n " + submenuRangeValue + "\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value + label {\n " + submenuColorpickerTitle + "\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value {\n " + submenuColorpickerButton + "\n }\n .tui-image-editor-container .svg_ic-menu {\n " + menuIconSize + "\n }\n .tui-image-editor-container .svg_ic-submenu {\n " + submenuIconSize + "\n }\n .tui-image-editor-container .tui-image-editor-controls-logo > img,\n .tui-image-editor-container .tui-image-editor-header-logo > img {\n " + biSize + "\n }\n\n"; + return "\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype=\"icon-bubble\"] label,\n #tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype=\"icon-heart\"] label,\n #tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype=\"icon-location\"] label,\n #tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype=\"icon-polygon\"] label,\n #tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype=\"icon-star\"] label,\n #tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype=\"icon-arrow-3\"] label,\n #tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype=\"icon-arrow-2\"] label,\n #tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype=\"icon-arrow\"] label,\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype=\"icon-bubble\"] label,\n #tie-draw-line-select-button.line .tui-image-editor-button.line label,\n #tie-draw-line-select-button.free .tui-image-editor-button.free label,\n #tie-flip-button.flipX .tui-image-editor-button.flipX label,\n #tie-flip-button.flipY .tui-image-editor-button.flipY label,\n #tie-flip-button.resetFlip .tui-image-editor-button.resetFlip label,\n #tie-crop-button .tui-image-editor-button.apply.active label,\n #tie-crop-preset-button .tui-image-editor-button.preset.active label,\n #tie-shape-button.rect .tui-image-editor-button.rect label,\n #tie-shape-button.circle .tui-image-editor-button.circle label,\n #tie-shape-button.triangle .tui-image-editor-button.triangle label,\n #tie-text-effect-button .tui-image-editor-button.active label,\n #tie-text-align-button.left .tui-image-editor-button.left label,\n #tie-text-align-button.center .tui-image-editor-button.center label,\n #tie-text-align-button.right .tui-image-editor-button.right label,\n #tie-mask-apply.apply.active .tui-image-editor-button.apply label,\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover > label,\n .tui-image-editor-container .tui-image-editor-checkbox input + label {\n " + subMenuLabelActive + "\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button > label,\n .tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label {\n " + subMenuLabelNormal + "\n }\n .tui-image-editor-container .tui-image-editor-range-wrap label {\n " + subMenuRangeTitle + "\n }\n .tui-image-editor-container .tui-image-editor-partition > div {\n " + submenuPartitionVertical + "\n }\n .tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition > div,\n .tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition > div {\n " + submenuPartitionHorizontal + "\n }\n .tui-image-editor-container .tui-image-editor-checkbox input + label:before {\n " + submenuCheckbox + "\n }\n .tui-image-editor-container .tui-image-editor-checkbox input:checked + label:before {\n border: 0;\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-pointer {\n " + submenuRangePointer + "\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-bar {\n " + submenuRangeBar + "\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-subbar {\n " + submenuRangeSubbar + "\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-pointer {\n " + submenuDisabledRangePointer + "\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-subbar {\n " + submenuDisabledRangeSubbar + "\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-bar {\n " + submenuDisabledRangeBar + "\n }\n .tui-image-editor-container .tui-image-editor-range-value {\n " + submenuRangeValue + "\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value + label {\n " + submenuColorpickerTitle + "\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value {\n " + submenuColorpickerButton + "\n }\n .tui-image-editor-container .svg_ic-menu {\n " + menuIconSize + "\n }\n .tui-image-editor-container .svg_ic-submenu {\n " + submenuIconSize + "\n }\n .tui-image-editor-container .tui-image-editor-controls-logo > img,\n .tui-image-editor-container .tui-image-editor-header-logo > img {\n " + biSize + "\n }\n\n"; }; /***/ }), @@ -10215,6 +10227,10 @@ return /******/ (function(modules) { // webpackBootstrap var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + var _tuiCodeSnippet = __webpack_require__(3); + + var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + var _submenuBase = __webpack_require__(84); var _submenuBase2 = _interopRequireDefault(_submenuBase); @@ -10253,10 +10269,14 @@ return /******/ (function(modules) { // webpackBootstrap })); _this.status = 'active'; + _this._els = { apply: _this.selector('#tie-crop-button .apply'), - cancel: _this.selector('#tie-crop-button .cancel') + cancel: _this.selector('#tie-crop-button .cancel'), + preset: _this.selector('#tie-crop-preset-button') }; + + _this.defaultPresetButton = _this._els.preset.querySelector('.preset-none'); return _this; } @@ -10265,6 +10285,7 @@ return /******/ (function(modules) { // webpackBootstrap * @param {Object} actions - actions for crop * @param {Function} actions.crop - crop action * @param {Function} actions.cancel - cancel action + * @param {Function} actions.preset - draw rectzone at a predefined ratio */ @@ -10283,6 +10304,17 @@ return /******/ (function(modules) { // webpackBootstrap _this2.actions.cancel(); _this2._els.apply.classList.remove('active'); }); + + this._els.preset.addEventListener('click', function (event) { + var button = event.target.closest('.tui-image-editor-button.preset'); + if (button) { + var _button$className$mat = button.className.match(/preset-[^\s]+/), + presetType = _button$className$mat[0]; + + _this2._setPresetButtonActive(button); + _this2.actions.preset(presetType); + } + }); } /** @@ -10303,6 +10335,7 @@ return /******/ (function(modules) { // webpackBootstrap key: 'changeStandbyMode', value: function changeStandbyMode() { this.actions.stopDrawingMode(); + this._setPresetButtonActive(); } /** @@ -10319,6 +10352,26 @@ return /******/ (function(modules) { // webpackBootstrap this._els.apply.classList.remove('active'); } } + + /** + * Set preset button to active status + * @param {HTMLElement} button - event target element + * @private + */ + + }, { + key: '_setPresetButtonActive', + value: function _setPresetButtonActive() { + var button = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.defaultPresetButton; + + _tuiCodeSnippet2.default.forEach([].slice.call(this._els.preset.querySelectorAll('.preset')), function (presetButton) { + presetButton.classList.remove('active'); + }); + + if (button) { + button.classList.add('active'); + } + } }]); return Crop; @@ -10340,7 +10393,7 @@ return /******/ (function(modules) { // webpackBootstrap var _ref$iconStyle = _ref.iconStyle, normal = _ref$iconStyle.normal, active = _ref$iconStyle.active; - return "\n
      \n
    • \n
      \n \n \n \n \n \n
      \n
      \n \n \n \n \n \n
      \n
      • \n
    \n"; + return "\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n \n \n \n \n \n
      \n
      \n \n \n \n \n \n
      \n
      • \n
    \n"; }; /***/ }), @@ -12225,6 +12278,32 @@ return /******/ (function(modules) { // webpackBootstrap cancel: function cancel() { _this8.stopDrawingMode(); _this8.ui.changeMenu('crop'); + }, + preset: function preset(presetType) { + switch (presetType) { + case 'preset-square': + _this8.setCropzoneRect(1 / 1); + break; + case 'preset-3-2': + _this8.setCropzoneRect(3 / 2); + break; + case 'preset-4-3': + _this8.setCropzoneRect(4 / 3); + break; + case 'preset-5-4': + _this8.setCropzoneRect(5 / 4); + break; + case 'preset-7-5': + _this8.setCropzoneRect(7 / 5); + break; + case 'preset-16-9': + _this8.setCropzoneRect(16 / 9); + break; + default: + _this8.setCropzoneRect(); + _this8.ui.crop.changeApplyButtonStatus(false); + break; + } } }, this._commonAction()); }, @@ -14321,6 +14400,18 @@ return /******/ (function(modules) { // webpackBootstrap return this.getComponent(components.CROPPER).getCropzoneRect(); } + /** + * Get cropped rect + * @param {Object} mode cropzone rect mode + * @returns {Object} rect + */ + + }, { + key: 'setCropzoneRect', + value: function setCropzoneRect(mode) { + return this.getComponent(components.CROPPER).setCropzoneRect(mode); + } + /** * Get cropped image data * @param {Object} cropRect cropzone rect @@ -15299,6 +15390,10 @@ return /******/ (function(modules) { // webpackBootstrap var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + var _tuiCodeSnippet = __webpack_require__(3); + + var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); + var _fabric = __webpack_require__(105); var _fabric2 = _interopRequireDefault(_fabric); @@ -15328,6 +15423,12 @@ return /******/ (function(modules) { // webpackBootstrap var MOUSE_MOVE_THRESHOLD = 10; + var DEFAULT_OPTION = { + top: -10, + left: -10, + height: 1, + width: 1 + }; /** * Cropper components @@ -15631,6 +15732,81 @@ return /******/ (function(modules) { // webpackBootstrap }; } + /** + * Set a cropzone square + * @param {number} [presetRatio] - preset ratio + */ + + }, { + key: 'setCropzoneRect', + value: function setCropzoneRect(presetRatio) { + var canvas = this.getCanvas(); + var cropzone = this._cropzone; + + canvas.deactivateAll(); + canvas.selection = false; + cropzone.remove(); + + cropzone.set(presetRatio ? this._getPresetCropSizePosition(presetRatio) : DEFAULT_OPTION); + + canvas.add(cropzone); + canvas.selection = true; + + if (presetRatio) { + canvas.setActiveObject(cropzone); + } + } + + /** + * Set a cropzone square + * @param {number} presetRatio - preset ratio + * @returns {{left: number, top: number, width: number, height: number}} + * @private + */ + + }, { + key: '_getPresetCropSizePosition', + value: function _getPresetCropSizePosition(presetRatio) { + var canvas = this.getCanvas(); + var originalWidth = canvas.getWidth(); + var originalHeight = canvas.getHeight(); + + var standardSize = originalWidth >= originalHeight ? originalWidth : originalHeight; + var getScale = function getScale(value, orignalValue) { + return value > orignalValue ? orignalValue / value : 1; + }; + + var width = standardSize * presetRatio; + var height = standardSize; + + var scaleWidth = getScale(width, originalWidth); + + var _snippet$map = _tuiCodeSnippet2.default.map([width, height], function (sizeValue) { + return sizeValue * scaleWidth; + }); + + width = _snippet$map[0]; + height = _snippet$map[1]; + + + var scaleHeight = getScale(height, originalHeight); + + var _snippet$map2 = _tuiCodeSnippet2.default.map([width, height], function (sizeValue) { + return sizeValue * scaleHeight; + }); + + width = _snippet$map2[0]; + height = _snippet$map2[1]; + + + return { + top: (originalHeight - height) / 2, + left: (originalWidth - width) / 2, + width: width, + height: height + }; + } + /** * Keydown event handler * @param {KeyboardEvent} e - Event object @@ -20687,11 +20863,18 @@ return /******/ (function(modules) { // webpackBootstrap var prevImage = loader.getCanvasImage(); var prevImageWidth = prevImage ? prevImage.width : 0; var prevImageHeight = prevImage ? prevImage.height : 0; + var objects = graphics.removeAll(true).filter(function (objectItem) { + return objectItem.type !== 'cropzone'; + }); + + objects.forEach(function (objectItem) { + objectItem.evented = true; + }); this.undoData = { name: loader.getImageName(), image: prevImage, - objects: graphics.removeAll(true) + objects: objects }; return loader.load(imageName, imgUrl).then(function (newImage) { @@ -20704,6 +20887,7 @@ return /******/ (function(modules) { // webpackBootstrap }); }, + /** * @param {Graphics} graphics - Graphics instance * @returns {Promise} diff --git a/dist/tui-image-editor.min.css b/dist/tui-image-editor.min.css index 4e62444ea..f66cd3ffa 100644 --- a/dist/tui-image-editor.min.css +++ b/dist/tui-image-editor.min.css @@ -1,7 +1,7 @@ /*! * tui-image-editor.min.js - * @version 3.2.2 + * @version 3.3.0 * @author NHNEnt FE Development Lab * @license MIT */ -body>textarea{position:fixed!important}.tui-image-editor-container{marign:0;padding:0;box-sizing:border-box;min-height:300px;height:100%;position:relative;background-color:#282828;overflow:hidden;letter-spacing:.3px}.tui-image-editor-container div,.tui-image-editor-container input,.tui-image-editor-container label,.tui-image-editor-container li,.tui-image-editor-container ul{box-sizing:border-box;margin:0;padding:0;-ms-user-select:none;-moz-user-select:-moz-none;-khtml-user-select:none;-webkit-user-select:none;user-select:none}.tui-image-editor-container .tui-image-editor-header{min-width:533px;position:absolute;background-color:#151515;top:0;width:100%}.tui-image-editor-container .tui-image-editor-controls-buttons,.tui-image-editor-container .tui-image-editor-header-buttons{float:right;margin:8px}.tui-image-editor-container .tui-image-editor-controls-logo,.tui-image-editor-container .tui-image-editor-header-logo{float:left;width:30%;padding:17px}.tui-image-editor-container .tui-image-editor-controls-buttons,.tui-image-editor-container .tui-image-editor-controls-logo{width:270px;height:100%;display:none}.tui-image-editor-container .tui-image-editor-controls-buttons button,.tui-image-editor-container .tui-image-editor-header-buttons button{position:relative;width:120px;height:40px;padding:0;line-height:40px;outline:none;border-radius:20px;border:1px solid #ddd;font-family:Noto Sans,sans-serif;font-size:12px;font-weight:700;cursor:pointer;vertical-align:middle;letter-spacing:.3px}.tui-image-editor-container .tui-image-editor-download-btn{background-color:#fdba3b;border-color:#fdba3b;color:#fff}.tui-image-editor-container .tui-image-editor-load-btn{position:absolute;left:0;right:0;display:inline-block;top:0;bottom:0;width:100%;cursor:pointer;opacity:0}.tui-image-editor-container .tui-image-editor-main-container{position:absolute;width:100%;top:0;bottom:64px}.tui-image-editor-container .tui-image-editor-main{position:absolute;text-align:center;top:64px;bottom:0;right:0;left:0}.tui-image-editor-container .tui-image-editor-wrap{bottom:0;width:100%;overflow:auto}.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap{display:table;width:100%;height:100%}.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap .tui-image-editor-align-wrap{display:table-cell;vertical-align:middle}.tui-image-editor-container .tui-image-editor{position:relative;display:inline-block}.tui-image-editor-container .tui-image-editor-menu{width:auto;list-style:none;padding:0;margin:0 auto;display:table-cell;text-align:center;vertical-align:middle;white-space:nowrap}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item{position:relative;display:inline-block;border-radius:2px;padding:7px 8px 3px;cursor:pointer;margin:0 4px}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item[title]:hover:before{content:"";display:inline-block;margin:0 auto;width:0;height:0;border-right:7px solid transparent;border-top:7px solid #2f2f2f;border-left:7px solid transparent;position:absolute;left:13px;top:-2px}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item[title]:hover:after{content:attr(title);position:absolute;display:inline-block;background-color:#2f2f2f;color:#fff;padding:5px 8px;font-size:11px;font-weight:lighter;border-radius:3px;max-height:23px;top:-22px;left:0;min-width:24px}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item.active{background-color:#fff;transition:all .3s ease}.tui-image-editor-container .tui-image-editor-wrap{position:absolute}.tui-image-editor-container .tui-image-editor-grid-visual{display:none;position:absolute;width:100%;height:100%;border:1px solid hsla(0,0%,100%,.7)}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor{transition:none}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-grid-visual,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-grid-visual{display:block}.tui-image-editor-container .tui-image-editor-grid-visual table{width:100%;height:100%;border-collapse:collapse}.tui-image-editor-container .tui-image-editor-grid-visual table td{border:1px solid hsla(0,0%,100%,.3)}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot:before{content:"";position:absolute;box-sizing:border-box;width:10px;height:10px;border:0;box-shadow:0 0 1px 0 rgba(0,0,0,.3);border-radius:100%;background-color:#fff}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-top:before{top:-5px;left:-5px}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-top:before{top:-5px;right:-5px}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-bottom:before{bottom:-5px;left:-5px}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-bottom:before{bottom:-5px;right:-5px}.tui-image-editor-container .tui-image-editor-submenu{display:none;position:absolute;bottom:0;width:100%;height:150px;white-space:nowrap;z-index:2}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover svg>use.active{display:block}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item li{display:inline-block;vertical-align:top}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-newline{display:block;margin-top:0}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button{position:relative;cursor:pointer;display:inline-block;font-weight:400;font-size:11px;margin:0 9px}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item label{display:inline-block;cursor:pointer;padding-top:5px;font-family:Noto Sans,sans-serif;font-size:11px}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.apply label,.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.cancel label{vertical-align:7px}.tui-image-editor-container .tui-image-editor-submenu>div{display:none;vertical-align:bottom}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-style{opacity:.95;z-index:-1;position:absolute;top:0;bottom:0;left:0;right:0;display:block}.tui-image-editor-container .tui-image-editor-partition>div{width:1px;height:52px;border-left:1px solid #3c3c3c;margin:0 8px}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-partition>div{height:108px;margin:0 29px 0 0}.tui-image-editor-container .tui-image-editor-submenu-align{text-align:left;margin-right:30px}.tui-image-editor-container .tui-image-editor-submenu-align label{width:55px;white-space:nowrap}.tui-image-editor-container .tui-image-editor-submenu-align:first-child{margin-right:0}.tui-image-editor-container .tui-image-editor-submenu-align:first-child label{width:70px}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-crop .tui-image-editor-submenu>div.tui-image-editor-menu-crop,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-draw .tui-image-editor-submenu>div.tui-image-editor-menu-draw,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-submenu>div.tui-image-editor-menu-filter,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-submenu>div.tui-image-editor-menu-flip,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-icon .tui-image-editor-submenu>div.tui-image-editor-menu-icon,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-mask .tui-image-editor-submenu>div.tui-image-editor-menu-mask,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-submenu>div.tui-image-editor-menu-rotate,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-shape .tui-image-editor-submenu>div.tui-image-editor-menu-shape,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-text .tui-image-editor-submenu>div.tui-image-editor-menu-text{display:table-cell}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-crop .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-draw .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-icon .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-mask .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-shape .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-text .tui-image-editor-submenu{display:table}.tui-image-editor-container .filter-color-item{display:inline-block}.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox{display:block}.tui-image-editor-container .tui-image-editor-checkbox-wrap{display:inline-block!important;text-align:left}.tui-image-editor-container .tui-image-editor-checkbox-wrap.fixed-width{width:187px;white-space:normal}.tui-image-editor-container .tui-image-editor-checkbox{display:inline-block;margin:1px 0}.tui-image-editor-container .tui-image-editor-checkbox input{width:14px;height:14px;opacity:0}.tui-image-editor-container .tui-image-editor-checkbox input+label{color:#fff;height:14px;position:relative}.tui-image-editor-container .tui-image-editor-checkbox input+label:before{content:"";position:absolute;width:14px;height:14px;background-color:#fff;top:6px;left:-19px;display:inline-block;margin:0;text-align:center;font-size:11px;border:0;border-radius:2px;padding-top:1px;box-sizing:border-box}.tui-image-editor-container .tui-image-editor-checkbox input[type=checkbox]:checked+label:before{background-size:cover;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAMBJREFUKBWVkjEOwjAMRe2WgZW7IIHEDdhghhuwcQ42rlJugAQS54Cxa5cq1QM5TUpByZfS2j9+dlJVt/tX5ZxbS4ZU9VLkQvSHKTIGRaVJYFmKrBbTCJxE2UgCdDzMZDkHrOV6b95V0US6UmgKodujEZbJg0B0ZgEModO5lrY1TMQf1TpyJGBEjD+E2NPN7ukIUDiF/BfEXgRiGEw8NgkffYGYwCi808fpn/6OvfUfsDr/Vc1IfRf8sKnFVqeiVQfDu0tf/nWH9gAAAABJRU5ErkJggg==")}.tui-image-editor-container .tui-image-editor-selectlist-wrap{position:relative}.tui-image-editor-container .tui-image-editor-selectlist-wrap select{width:100%;height:28px;margin-top:4px;border:0;outline:0;border-radius:0;border:1px solid #cbdbdb;background-color:#fff;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0 7px 0 10px}.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist{display:none;position:relative;top:-1px;border:1px solid #ccc;background-color:#fff;border-top:0;padding:4px 0}.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist li{display:block;text-align:left;padding:7px 10px;font-family:Noto Sans,sans-serif}.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist li:hover{background-color:rgba(81,92,230,.05)}.tui-image-editor-container .tui-image-editor-selectlist-wrap:before{content:"";position:absolute;display:inline-block;width:14px;height:14px;right:5px;top:10px;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAHlJREFUKBVjYBgFOEOAEVkmPDxc89+/f6eAYjzI4kD2FyYmJrOVK1deh4kzwRggGiQBVJCELAZig8SQNYHEmEEEMrh69eo1HR0dfqCYJUickZGxf9WqVf3IakBsFBthklpaWmVA9mEQhrJhUoTp0NBQCRAmrHL4qgAAuu4cWZOZIGsAAAAASUVORK5CYII=");background-size:cover}.tui-image-editor-container .tui-image-editor-selectlist-wrap select::-ms-expand{display:none}.tui-image-editor-container .tui-image-editor-virtual-range-bar .tui-image-editor-disabled,.tui-image-editor-container .tui-image-editor-virtual-range-pointer .tui-image-editor-disabled,.tui-image-editor-container .tui-image-editor-virtual-range-subbar .tui-image-editor-disabled{backbround-color:red}.tui-image-editor-container .tui-image-editor-range{position:relative;top:5px;width:166px;height:17px;display:inline-block}.tui-image-editor-container .tui-image-editor-virtual-range-bar{top:7px;position:absolute;width:100%;height:2px;background-color:#666}.tui-image-editor-container .tui-image-editor-virtual-range-subbar{position:absolute;height:100%;left:0;right:0;background-color:#d1d1d1}.tui-image-editor-container .tui-image-editor-virtual-range-pointer{position:absolute;cursor:pointer;top:-5px;left:0;width:12px;height:12px;background-color:#fff;border-radius:100%}.tui-image-editor-container .tui-image-editor-range-wrap{display:inline-block;margin-left:4px}.tui-image-editor-container .tui-image-editor-range-wrap.short .tui-image-editor-range{width:100px}.tui-image-editor-container .color-picker-control .tui-image-editor-range{width:108px;margin-left:10px}.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-pointer{background-color:#333}.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-bar{background-color:#ccc}.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-subbar{background-color:#606060}.tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short{margin-top:-2px;margin-left:19px}.tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label{color:#8e8e8e;font-weight:400}.tui-image-editor-container .tui-image-editor-range-wrap label{vertical-align:baseline;font-size:11px;margin-right:7px;color:#fff}.tui-image-editor-container .tui-image-editor-range-value{cursor:default;width:40px;height:24px;outline:none;border-radius:2px;box-shadow:none;border:1px solid #d5d5d5;text-align:center;background-color:#1c1c1c;color:#fff;font-weight:lighter;vertical-align:baseline;font-family:Noto Sans,sans-serif;margin-top:21px;margin-left:4px}.tui-image-editor-container .tui-image-editor-controls{position:absolute;background-color:#151515;width:100%;height:64px;display:table;bottom:0;z-index:2}.tui-image-editor-container .tui-image-editor-icpartition{display:inline-block;background-color:#282828;width:1px;height:24px}.tui-image-editor-container.left .tui-image-editor-menu>.tui-image-editor-item[title]:before{left:28px;top:11px;border-right:7px solid #2f2f2f;border-top:7px solid transparent;border-bottom:7px solid transparent}.tui-image-editor-container.left .tui-image-editor-menu>.tui-image-editor-item[title]:after{top:7px;left:39px;width:27px}.tui-image-editor-container.left .tui-image-editor-submenu{left:0;height:100%;width:248px}.tui-image-editor-container.left .tui-image-editor-main-container{left:64px;width:calc(100% - 64px);height:100%}.tui-image-editor-container.left .tui-image-editor-controls{width:64px;height:100%;display:table}.tui-image-editor-container.left .tui-image-editor-menu,.tui-image-editor-container.right .tui-image-editor-menu{white-space:inherit}.tui-image-editor-container.left .tui-image-editor-submenu,.tui-image-editor-container.right .tui-image-editor-submenu{white-space:normal}.tui-image-editor-container.left .tui-image-editor-submenu>div,.tui-image-editor-container.right .tui-image-editor-submenu>div{vertical-align:middle}.tui-image-editor-container.left .tui-image-editor-controls li,.tui-image-editor-container.right .tui-image-editor-controls li{display:inline-block;margin:4px auto}.tui-image-editor-container.left .tui-image-editor-icpartition,.tui-image-editor-container.right .tui-image-editor-icpartition{position:relative;top:-7px;width:24px;height:1px}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition{display:block;width:75%;margin:auto}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition>div,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition>div{border-left:0;height:10px;border-bottom:1px solid #3c3c3c;width:100%;margin:0}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-align,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-align{margin-right:0}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-item li,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-item li{margin-top:15px}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-colorpicker-clearfix li,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-colorpicker-clearfix li{margin-top:0}.tui-image-editor-container.left .tui-image-editor-checkbox-wrap.fixed-width,.tui-image-editor-container.right .tui-image-editor-checkbox-wrap.fixed-width{width:182px;white-space:normal}.tui-image-editor-container.left .tui-image-editor-range-wrap.tui-image-editor-newline label.range,.tui-image-editor-container.right .tui-image-editor-range-wrap.tui-image-editor-newline label.range{display:block;text-align:left;width:75%;margin:auto}.tui-image-editor-container.left .tui-image-editor-range,.tui-image-editor-container.right .tui-image-editor-range{width:136px}.tui-image-editor-container.right .tui-image-editor-menu>.tui-image-editor-item[title]:before{left:-3px;top:11px;border-left:7px solid #2f2f2f;border-top:7px solid transparent;border-bottom:7px solid transparent}.tui-image-editor-container.right .tui-image-editor-menu>.tui-image-editor-item[title]:after{top:7px;left:-44px;width:27px}.tui-image-editor-container.right .tui-image-editor-submenu{right:0;height:100%;width:248px}.tui-image-editor-container.right .tui-image-editor-main-container{right:64px;width:calc(100% - 64px);height:100%}.tui-image-editor-container.right .tui-image-editor-controls{right:0;width:64px;height:100%;display:table}.tui-image-editor-container.bottom .tui-image-editor-submenu .tui-image-editor-partition.only-left-right,.tui-image-editor-container.top .tui-image-editor-submenu .tui-image-editor-partition.only-left-right{display:none}.tui-image-editor-container.bottom .tui-image-editor-submenu>div{padding-bottom:24px}.tui-image-editor-container.top .color-picker-control .triangle{top:-8px;border-right:7px solid transparent;border-top:0;border-left:7px solid transparent;border-bottom:8px solid #fff}.tui-image-editor-container.top .tui-image-editor-size-wrap{height:100%}.tui-image-editor-container.top .tui-image-editor-main-container{bottom:0}.tui-image-editor-container.top .tui-image-editor-menu>.tui-image-editor-item[title]:before{left:13px;border-top:0;border-bottom:7px solid #2f2f2f;top:33px}.tui-image-editor-container.top .tui-image-editor-menu>.tui-image-editor-item[title]:after{top:38px}.tui-image-editor-container.top .tui-image-editor-submenu{top:0;bottom:inherit}.tui-image-editor-container.top .tui-image-editor-submenu>div{padding-top:24px;vertical-align:top}.tui-image-editor-container.top .tui-image-editor-controls-buttons,.tui-image-editor-container.top .tui-image-editor-controls-logo{display:table-cell}.tui-image-editor-container.top .tui-image-editor-main{top:64px;height:calc(100% - 64px)}.tui-image-editor-container.top .tui-image-editor-controls{top:0;bottom:inherit}.tui-image-editor-container #tie-icon-add-button .tui-image-editor-button{min-width:42px}.tui-image-editor-container .svg_ic-menu{width:24px;height:24px}.tui-image-editor-container .svg_ic-submenu{width:32px;height:32px}.tui-image-editor-container .svg_img-bi{width:257px;height:26px}.tui-image-editor-container .tui-image-editor-controls svg>use{display:none}.tui-image-editor-container .tui-image-editor-controls .enabled svg:hover>use.hover,.tui-image-editor-container .tui-image-editor-controls .normal svg:hover>use.hover{display:block}.tui-image-editor-container .tui-image-editor-controls .active svg:hover>use.hover{display:none}.tui-image-editor-container .tui-image-editor-controls .active svg>use.active,.tui-image-editor-container .tui-image-editor-controls .enabled svg>use.enabled,.tui-image-editor-container .tui-image-editor-controls svg>use.normal{display:block}.tui-image-editor-container .tui-image-editor-controls .active svg>use.normal,.tui-image-editor-container .tui-image-editor-controls .enabled svg>use.normal{display:none}.tui-image-editor-container .tui-image-editor-controls:hover{z-index:3}.tui-image-editor-container div.tui-colorpicker-clearfix{width:159px;height:28px;border:1px solid #d5d5d5;border-radius:2px;background-color:#f5f5f5;margin-top:6px;padding:4px 7px}.tui-image-editor-container .tui-colorpicker-palette-hex{width:114px;background-color:#f5f5f5;border:0;font-size:11px;margin-top:2px;font-family:Noto Sans,sans-serif}.tui-image-editor-container .tui-colorpicker-palette-hex[value=""]+.tui-colorpicker-palette-preview,.tui-image-editor-container .tui-colorpicker-palette-hex[value="#ffffff"]+.tui-colorpicker-palette-preview{border:1px solid #ccc}.tui-image-editor-container .tui-colorpicker-palette-hex[value=""]+.tui-colorpicker-palette-preview{background-size:cover;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAdBJREFUWAnFl0FuwjAQRZ0ukiugHqFSOQNdseuKW3ALzkA4BateICvUGyCxrtRFd4WuunH/TzykaYJrnLEYaTJJsP2+x8GZZCbQrLU5mj7Bn+EP8HvnCObd+R7xBV5lWfaNON4AnsA38E94qLEt+0yiFaBzAV/Bv+Cxxr4co7hKCDpw1q9wLeNYYdlAwyn8TYt8Hme3+8D5ozcTaMCZ68PXa2tnM2sbEcOZAJhrrpl2DAcTOGNjZPSfCdzkw6JrfbiMv+osBe4y9WOedhm4jZfhbENWuxS44H9Wz/xw4WzqLOAqh1+zycgAwzEMzr5k5gaHOa9ULBwuuDkFlHI1Kl4PJ66kgIpnoywOTmRFAYcbwYk9UMApWkD8zAV5ihcwHk4Rx7gl0IFTQL0EFc+CTQ9OZHWH3YhlVJiVpTHbrTGLhTHLZVgff6s9lyBsI9KduSS83oj+34rTwJutmBmCnMsvozRwZqB5GTkBw6/jdPDu69iJ6BYk6eCcfbcgcQIK/MByaaiMqm8rHcjol2TnpWDhyAKSGdA3FrxtJUToX0ODqatetfGE+8tyEUOV8GY5dGRwLP/MBS4RHQr4bT7NRAQjlcOTfZxmv2G+c4hI8nn+Ax5PG/zhI393AAAAAElFTkSuQmCC")}.tui-image-editor-container .tui-colorpicker-palette-preview{border-radius:100%;float:left;width:17px;height:17px;border:0}.tui-image-editor-container .color-picker-control{position:absolute;display:none;z-index:99;width:192px;background-color:#fff;box-shadow:0 3px 22px 6px rgba(0,0,0,.15);padding:16px;border-radius:2px}.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-toggle-slider{display:none}.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button{border:0;border-radius:100%;margin:2px;background-size:cover;font-size:1px}.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button[title=""],.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button[title="#ffffff"]{border:1px solid #ccc}.tui-image-editor-container .color-picker-control .triangle{width:0;height:0;border-right:7px solid transparent;border-top:8px solid #fff;border-left:7px solid transparent;position:absolute;bottom:-8px;left:84px}.tui-image-editor-container .color-picker-control .tui-colorpicker-container,.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-container,.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-container ul{width:100%;height:auto}.tui-image-editor-container .filter-color-item .color-picker-control label{font-color:#333;font-weight:400;margin-right:7pxleft}.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox{margin-top:0}.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox input+label:before{left:-16px}.tui-image-editor-container .color-picker{width:100%;height:auto}.tui-image-editor-container .color-picker-value{width:32px;height:32px;border:0;border-radius:100%;margin:auto;margin-bottom:1px}.tui-image-editor-container .color-picker-value.transparent{border:1px solid #cbcbcb;background-size:cover;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAdBJREFUWAnFl0FuwjAQRZ0ukiugHqFSOQNdseuKW3ALzkA4BateICvUGyCxrtRFd4WuunH/TzykaYJrnLEYaTJJsP2+x8GZZCbQrLU5mj7Bn+EP8HvnCObd+R7xBV5lWfaNON4AnsA38E94qLEt+0yiFaBzAV/Bv+Cxxr4co7hKCDpw1q9wLeNYYdlAwyn8TYt8Hme3+8D5ozcTaMCZ68PXa2tnM2sbEcOZAJhrrpl2DAcTOGNjZPSfCdzkw6JrfbiMv+osBe4y9WOedhm4jZfhbENWuxS44H9Wz/xw4WzqLOAqh1+zycgAwzEMzr5k5gaHOa9ULBwuuDkFlHI1Kl4PJ66kgIpnoywOTmRFAYcbwYk9UMApWkD8zAV5ihcwHk4Rx7gl0IFTQL0EFc+CTQ9OZHWH3YhlVJiVpTHbrTGLhTHLZVgff6s9lyBsI9KduSS83oj+34rTwJutmBmCnMsvozRwZqB5GTkBw6/jdPDu69iJ6BYk6eCcfbcgcQIK/MByaaiMqm8rHcjol2TnpWDhyAKSGdA3FrxtJUToX0ODqatetfGE+8tyEUOV8GY5dGRwLP/MBS4RHQr4bT7NRAQjlcOTfZxmv2G+c4hI8nn+Ax5PG/zhI393AAAAAElFTkSuQmCC")}.tui-image-editor-container .color-picker-value+label{color:#fff}.tui-image-editor-container .tui-image-editor-submenu svg>use{display:none}#tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype=icon-arrow-2] svg>use.active,#tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype=icon-arrow-3] svg>use.active,#tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype=icon-arrow] svg>use.active,#tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype=icon-bubble] svg>use.active,#tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype=icon-heart] svg>use.active,#tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype=icon-location] svg>use.active,#tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype=icon-polygon] svg>use.active,#tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype=icon-star] svg>use.active,.tui-image-editor-container .tui-image-editor-submenu svg>use.normal{display:block}#tie-draw-line-select-button.free .tui-image-editor-button.free svg>use.normal,#tie-draw-line-select-button.line .tui-image-editor-button.line svg>use.normal{display:none}#tie-draw-line-select-button.free .tui-image-editor-button.free svg>use.active,#tie-draw-line-select-button.line .tui-image-editor-button.line svg>use.active{display:block}#tie-flip-button.flipX .tui-image-editor-button.flipX svg>use.normal,#tie-flip-button.flipY .tui-image-editor-button.flipY svg>use.normal,#tie-flip-button.resetFlip .tui-image-editor-button.resetFlip svg>use.normal{display:none}#tie-flip-button.flipX .tui-image-editor-button.flipX svg>use.active,#tie-flip-button.flipY .tui-image-editor-button.flipY svg>use.active,#tie-flip-button.resetFlip .tui-image-editor-button.resetFlip svg>use.active{display:block}#tie-mask-apply.apply.active .tui-image-editor-button.apply label{color:#fff}#tie-mask-apply.apply.active .tui-image-editor-button.apply svg>use.active{display:block}#tie-crop-button .tui-image-editor-button.apply{margin-right:24px}#tie-crop-button .tui-image-editor-button.apply.active svg>use.active{display:block}#tie-shape-button.circle .tui-image-editor-button.circle svg>use.normal,#tie-shape-button.rect .tui-image-editor-button.rect svg>use.normal,#tie-shape-button.triangle .tui-image-editor-button.triangle svg>use.normal{display:none}#tie-shape-button.circle .tui-image-editor-button.circle svg>use.active,#tie-shape-button.rect .tui-image-editor-button.rect svg>use.active,#tie-shape-button.triangle .tui-image-editor-button.triangle svg>use.active,#tie-text-align-button.center .tui-image-editor-button.center svg>use.active,#tie-text-align-button.left .tui-image-editor-button.left svg>use.active,#tie-text-align-button.right .tui-image-editor-button.right svg>use.active,#tie-text-effect-button .tui-image-editor-button.active svg>use.active{display:block}#tie-icon-image-file,#tie-mask-image-file{opacity:0;position:absolute;width:100%;height:100%;border:1px solid green;cursor:inherit;left:0;top:0}.tui-image-editor-container.top.tui-image-editor-top-optimization .tui-image-editor-controls ul{text-align:right}.tui-image-editor-container.top.tui-image-editor-top-optimization .tui-image-editor-controls-logo{display:none} \ No newline at end of file +body>textarea{position:fixed!important}.tui-image-editor-container{marign:0;padding:0;box-sizing:border-box;min-height:300px;height:100%;position:relative;background-color:#282828;overflow:hidden;letter-spacing:.3px}.tui-image-editor-container div,.tui-image-editor-container input,.tui-image-editor-container label,.tui-image-editor-container li,.tui-image-editor-container ul{box-sizing:border-box;margin:0;padding:0;-ms-user-select:none;-moz-user-select:-moz-none;-khtml-user-select:none;-webkit-user-select:none;user-select:none}.tui-image-editor-container .tui-image-editor-header{min-width:533px;position:absolute;background-color:#151515;top:0;width:100%}.tui-image-editor-container .tui-image-editor-controls-buttons,.tui-image-editor-container .tui-image-editor-header-buttons{float:right;margin:8px}.tui-image-editor-container .tui-image-editor-controls-logo,.tui-image-editor-container .tui-image-editor-header-logo{float:left;width:30%;padding:17px}.tui-image-editor-container .tui-image-editor-controls-buttons,.tui-image-editor-container .tui-image-editor-controls-logo{width:270px;height:100%;display:none}.tui-image-editor-container .tui-image-editor-controls-buttons button,.tui-image-editor-container .tui-image-editor-header-buttons button{position:relative;width:120px;height:40px;padding:0;line-height:40px;outline:none;border-radius:20px;border:1px solid #ddd;font-family:Noto Sans,sans-serif;font-size:12px;font-weight:700;cursor:pointer;vertical-align:middle;letter-spacing:.3px}.tui-image-editor-container .tui-image-editor-download-btn{background-color:#fdba3b;border-color:#fdba3b;color:#fff}.tui-image-editor-container .tui-image-editor-load-btn{position:absolute;left:0;right:0;display:inline-block;top:0;bottom:0;width:100%;cursor:pointer;opacity:0}.tui-image-editor-container .tui-image-editor-main-container{position:absolute;width:100%;top:0;bottom:64px}.tui-image-editor-container .tui-image-editor-main{position:absolute;text-align:center;top:64px;bottom:0;right:0;left:0}.tui-image-editor-container .tui-image-editor-wrap{bottom:0;width:100%;overflow:auto}.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap{display:table;width:100%;height:100%}.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap .tui-image-editor-align-wrap{display:table-cell;vertical-align:middle}.tui-image-editor-container .tui-image-editor{position:relative;display:inline-block}.tui-image-editor-container .tui-image-editor-menu{width:auto;list-style:none;padding:0;margin:0 auto;display:table-cell;text-align:center;vertical-align:middle;white-space:nowrap}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item{position:relative;display:inline-block;border-radius:2px;padding:7px 8px 3px;cursor:pointer;margin:0 4px}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item[title]:hover:before{content:"";display:inline-block;margin:0 auto;width:0;height:0;border-right:7px solid transparent;border-top:7px solid #2f2f2f;border-left:7px solid transparent;position:absolute;left:13px;top:-2px}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item[title]:hover:after{content:attr(title);position:absolute;display:inline-block;background-color:#2f2f2f;color:#fff;padding:5px 8px;font-size:11px;font-weight:lighter;border-radius:3px;max-height:23px;top:-22px;left:0;min-width:24px}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item.active{background-color:#fff;transition:all .3s ease}.tui-image-editor-container .tui-image-editor-wrap{position:absolute}.tui-image-editor-container .tui-image-editor-grid-visual{display:none;position:absolute;width:100%;height:100%;border:1px solid hsla(0,0%,100%,.7)}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor{transition:none}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-grid-visual,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-grid-visual{display:block}.tui-image-editor-container .tui-image-editor-grid-visual table{width:100%;height:100%;border-collapse:collapse}.tui-image-editor-container .tui-image-editor-grid-visual table td{border:1px solid hsla(0,0%,100%,.3)}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot:before{content:"";position:absolute;box-sizing:border-box;width:10px;height:10px;border:0;box-shadow:0 0 1px 0 rgba(0,0,0,.3);border-radius:100%;background-color:#fff}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-top:before{top:-5px;left:-5px}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-top:before{top:-5px;right:-5px}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-bottom:before{bottom:-5px;left:-5px}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-bottom:before{bottom:-5px;right:-5px}.tui-image-editor-container .tui-image-editor-submenu{display:none;position:absolute;bottom:0;width:100%;height:150px;white-space:nowrap;z-index:2}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover svg>use.active{display:block}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item li{display:inline-block;vertical-align:top}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-newline{display:block;margin-top:0}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button{position:relative;cursor:pointer;display:inline-block;font-weight:400;font-size:11px;margin:0 9px}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.preset{margin:0 9px 20px 5px}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item label{display:inline-block;cursor:pointer;padding-top:5px;font-family:Noto Sans,sans-serif;font-size:11px}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.apply label,.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.cancel label{vertical-align:7px}.tui-image-editor-container .tui-image-editor-submenu>div{display:none;vertical-align:bottom}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-style{opacity:.95;z-index:-1;position:absolute;top:0;bottom:0;left:0;right:0;display:block}.tui-image-editor-container .tui-image-editor-partition>div{width:1px;height:52px;border-left:1px solid #3c3c3c;margin:0 8px}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-partition>div{height:108px;margin:0 29px 0 0}.tui-image-editor-container .tui-image-editor-submenu-align{text-align:left;margin-right:30px}.tui-image-editor-container .tui-image-editor-submenu-align label{width:55px;white-space:nowrap}.tui-image-editor-container .tui-image-editor-submenu-align:first-child{margin-right:0}.tui-image-editor-container .tui-image-editor-submenu-align:first-child label{width:70px}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-crop .tui-image-editor-submenu>div.tui-image-editor-menu-crop,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-draw .tui-image-editor-submenu>div.tui-image-editor-menu-draw,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-submenu>div.tui-image-editor-menu-filter,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-submenu>div.tui-image-editor-menu-flip,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-icon .tui-image-editor-submenu>div.tui-image-editor-menu-icon,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-mask .tui-image-editor-submenu>div.tui-image-editor-menu-mask,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-submenu>div.tui-image-editor-menu-rotate,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-shape .tui-image-editor-submenu>div.tui-image-editor-menu-shape,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-text .tui-image-editor-submenu>div.tui-image-editor-menu-text{display:table-cell}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-crop .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-draw .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-icon .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-mask .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-shape .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-text .tui-image-editor-submenu{display:table}.tui-image-editor-container .filter-color-item{display:inline-block}.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox{display:block}.tui-image-editor-container .tui-image-editor-checkbox-wrap{display:inline-block!important;text-align:left}.tui-image-editor-container .tui-image-editor-checkbox-wrap.fixed-width{width:187px;white-space:normal}.tui-image-editor-container .tui-image-editor-checkbox{display:inline-block;margin:1px 0}.tui-image-editor-container .tui-image-editor-checkbox input{width:14px;height:14px;opacity:0}.tui-image-editor-container .tui-image-editor-checkbox input+label{color:#fff;height:14px;position:relative}.tui-image-editor-container .tui-image-editor-checkbox input+label:before{content:"";position:absolute;width:14px;height:14px;background-color:#fff;top:6px;left:-19px;display:inline-block;margin:0;text-align:center;font-size:11px;border:0;border-radius:2px;padding-top:1px;box-sizing:border-box}.tui-image-editor-container .tui-image-editor-checkbox input[type=checkbox]:checked+label:before{background-size:cover;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAMBJREFUKBWVkjEOwjAMRe2WgZW7IIHEDdhghhuwcQ42rlJugAQS54Cxa5cq1QM5TUpByZfS2j9+dlJVt/tX5ZxbS4ZU9VLkQvSHKTIGRaVJYFmKrBbTCJxE2UgCdDzMZDkHrOV6b95V0US6UmgKodujEZbJg0B0ZgEModO5lrY1TMQf1TpyJGBEjD+E2NPN7ukIUDiF/BfEXgRiGEw8NgkffYGYwCi808fpn/6OvfUfsDr/Vc1IfRf8sKnFVqeiVQfDu0tf/nWH9gAAAABJRU5ErkJggg==")}.tui-image-editor-container .tui-image-editor-selectlist-wrap{position:relative}.tui-image-editor-container .tui-image-editor-selectlist-wrap select{width:100%;height:28px;margin-top:4px;border:0;outline:0;border-radius:0;border:1px solid #cbdbdb;background-color:#fff;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0 7px 0 10px}.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist{display:none;position:relative;top:-1px;border:1px solid #ccc;background-color:#fff;border-top:0;padding:4px 0}.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist li{display:block;text-align:left;padding:7px 10px;font-family:Noto Sans,sans-serif}.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist li:hover{background-color:rgba(81,92,230,.05)}.tui-image-editor-container .tui-image-editor-selectlist-wrap:before{content:"";position:absolute;display:inline-block;width:14px;height:14px;right:5px;top:10px;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAHlJREFUKBVjYBgFOEOAEVkmPDxc89+/f6eAYjzI4kD2FyYmJrOVK1deh4kzwRggGiQBVJCELAZig8SQNYHEmEEEMrh69eo1HR0dfqCYJUickZGxf9WqVf3IakBsFBthklpaWmVA9mEQhrJhUoTp0NBQCRAmrHL4qgAAuu4cWZOZIGsAAAAASUVORK5CYII=");background-size:cover}.tui-image-editor-container .tui-image-editor-selectlist-wrap select::-ms-expand{display:none}.tui-image-editor-container .tui-image-editor-virtual-range-bar .tui-image-editor-disabled,.tui-image-editor-container .tui-image-editor-virtual-range-pointer .tui-image-editor-disabled,.tui-image-editor-container .tui-image-editor-virtual-range-subbar .tui-image-editor-disabled{backbround-color:red}.tui-image-editor-container .tui-image-editor-range{position:relative;top:5px;width:166px;height:17px;display:inline-block}.tui-image-editor-container .tui-image-editor-virtual-range-bar{top:7px;position:absolute;width:100%;height:2px;background-color:#666}.tui-image-editor-container .tui-image-editor-virtual-range-subbar{position:absolute;height:100%;left:0;right:0;background-color:#d1d1d1}.tui-image-editor-container .tui-image-editor-virtual-range-pointer{position:absolute;cursor:pointer;top:-5px;left:0;width:12px;height:12px;background-color:#fff;border-radius:100%}.tui-image-editor-container .tui-image-editor-range-wrap{display:inline-block;margin-left:4px}.tui-image-editor-container .tui-image-editor-range-wrap.short .tui-image-editor-range{width:100px}.tui-image-editor-container .color-picker-control .tui-image-editor-range{width:108px;margin-left:10px}.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-pointer{background-color:#333}.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-bar{background-color:#ccc}.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-subbar{background-color:#606060}.tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short{margin-top:-2px;margin-left:19px}.tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label{color:#8e8e8e;font-weight:400}.tui-image-editor-container .tui-image-editor-range-wrap label{vertical-align:baseline;font-size:11px;margin-right:7px;color:#fff}.tui-image-editor-container .tui-image-editor-range-value{cursor:default;width:40px;height:24px;outline:none;border-radius:2px;box-shadow:none;border:1px solid #d5d5d5;text-align:center;background-color:#1c1c1c;color:#fff;font-weight:lighter;vertical-align:baseline;font-family:Noto Sans,sans-serif;margin-top:21px;margin-left:4px}.tui-image-editor-container .tui-image-editor-controls{position:absolute;background-color:#151515;width:100%;height:64px;display:table;bottom:0;z-index:2}.tui-image-editor-container .tui-image-editor-icpartition{display:inline-block;background-color:#282828;width:1px;height:24px}.tui-image-editor-container.left .tui-image-editor-menu>.tui-image-editor-item[title]:before{left:28px;top:11px;border-right:7px solid #2f2f2f;border-top:7px solid transparent;border-bottom:7px solid transparent}.tui-image-editor-container.left .tui-image-editor-menu>.tui-image-editor-item[title]:after{top:7px;left:39px;width:27px}.tui-image-editor-container.left .tui-image-editor-submenu{left:0;height:100%;width:248px}.tui-image-editor-container.left .tui-image-editor-main-container{left:64px;width:calc(100% - 64px);height:100%}.tui-image-editor-container.left .tui-image-editor-controls{width:64px;height:100%;display:table}.tui-image-editor-container.left .tui-image-editor-menu,.tui-image-editor-container.right .tui-image-editor-menu{white-space:inherit}.tui-image-editor-container.left .tui-image-editor-submenu,.tui-image-editor-container.right .tui-image-editor-submenu{white-space:normal}.tui-image-editor-container.left .tui-image-editor-submenu>div,.tui-image-editor-container.right .tui-image-editor-submenu>div{vertical-align:middle}.tui-image-editor-container.left .tui-image-editor-controls li,.tui-image-editor-container.right .tui-image-editor-controls li{display:inline-block;margin:4px auto}.tui-image-editor-container.left .tui-image-editor-icpartition,.tui-image-editor-container.right .tui-image-editor-icpartition{position:relative;top:-7px;width:24px;height:1px}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition{display:block;width:75%;margin:auto}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition>div,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition>div{border-left:0;height:10px;border-bottom:1px solid #3c3c3c;width:100%;margin:0}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-align,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-align{margin-right:0}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-item li,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-item li{margin-top:15px}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-colorpicker-clearfix li,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-colorpicker-clearfix li{margin-top:0}.tui-image-editor-container.left .tui-image-editor-checkbox-wrap.fixed-width,.tui-image-editor-container.right .tui-image-editor-checkbox-wrap.fixed-width{width:182px;white-space:normal}.tui-image-editor-container.left .tui-image-editor-range-wrap.tui-image-editor-newline label.range,.tui-image-editor-container.right .tui-image-editor-range-wrap.tui-image-editor-newline label.range{display:block;text-align:left;width:75%;margin:auto}.tui-image-editor-container.left .tui-image-editor-range,.tui-image-editor-container.right .tui-image-editor-range{width:136px}.tui-image-editor-container.right .tui-image-editor-menu>.tui-image-editor-item[title]:before{left:-3px;top:11px;border-left:7px solid #2f2f2f;border-top:7px solid transparent;border-bottom:7px solid transparent}.tui-image-editor-container.right .tui-image-editor-menu>.tui-image-editor-item[title]:after{top:7px;left:-44px;width:27px}.tui-image-editor-container.right .tui-image-editor-submenu{right:0;height:100%;width:248px}.tui-image-editor-container.right .tui-image-editor-main-container{right:64px;width:calc(100% - 64px);height:100%}.tui-image-editor-container.right .tui-image-editor-controls{right:0;width:64px;height:100%;display:table}.tui-image-editor-container.bottom .tui-image-editor-submenu .tui-image-editor-partition.only-left-right,.tui-image-editor-container.top .tui-image-editor-submenu .tui-image-editor-partition.only-left-right{display:none}.tui-image-editor-container.bottom .tui-image-editor-submenu>div{padding-bottom:24px}.tui-image-editor-container.top .color-picker-control .triangle{top:-8px;border-right:7px solid transparent;border-top:0;border-left:7px solid transparent;border-bottom:8px solid #fff}.tui-image-editor-container.top .tui-image-editor-size-wrap{height:100%}.tui-image-editor-container.top .tui-image-editor-main-container{bottom:0}.tui-image-editor-container.top .tui-image-editor-menu>.tui-image-editor-item[title]:before{left:13px;border-top:0;border-bottom:7px solid #2f2f2f;top:33px}.tui-image-editor-container.top .tui-image-editor-menu>.tui-image-editor-item[title]:after{top:38px}.tui-image-editor-container.top .tui-image-editor-submenu{top:0;bottom:inherit}.tui-image-editor-container.top .tui-image-editor-submenu>div{padding-top:24px;vertical-align:top}.tui-image-editor-container.top .tui-image-editor-controls-buttons,.tui-image-editor-container.top .tui-image-editor-controls-logo{display:table-cell}.tui-image-editor-container.top .tui-image-editor-main{top:64px;height:calc(100% - 64px)}.tui-image-editor-container.top .tui-image-editor-controls{top:0;bottom:inherit}.tui-image-editor-container #tie-icon-add-button .tui-image-editor-button{min-width:42px}.tui-image-editor-container .svg_ic-menu{width:24px;height:24px}.tui-image-editor-container .svg_ic-submenu{width:32px;height:32px}.tui-image-editor-container .svg_img-bi{width:257px;height:26px}.tui-image-editor-container .tui-image-editor-controls svg>use{display:none}.tui-image-editor-container .tui-image-editor-controls .enabled svg:hover>use.hover,.tui-image-editor-container .tui-image-editor-controls .normal svg:hover>use.hover{display:block}.tui-image-editor-container .tui-image-editor-controls .active svg:hover>use.hover{display:none}.tui-image-editor-container .tui-image-editor-controls .active svg>use.active,.tui-image-editor-container .tui-image-editor-controls .enabled svg>use.enabled,.tui-image-editor-container .tui-image-editor-controls svg>use.normal{display:block}.tui-image-editor-container .tui-image-editor-controls .active svg>use.normal,.tui-image-editor-container .tui-image-editor-controls .enabled svg>use.normal{display:none}.tui-image-editor-container .tui-image-editor-controls:hover{z-index:3}.tui-image-editor-container div.tui-colorpicker-clearfix{width:159px;height:28px;border:1px solid #d5d5d5;border-radius:2px;background-color:#f5f5f5;margin-top:6px;padding:4px 7px}.tui-image-editor-container .tui-colorpicker-palette-hex{width:114px;background-color:#f5f5f5;border:0;font-size:11px;margin-top:2px;font-family:Noto Sans,sans-serif}.tui-image-editor-container .tui-colorpicker-palette-hex[value=""]+.tui-colorpicker-palette-preview,.tui-image-editor-container .tui-colorpicker-palette-hex[value="#ffffff"]+.tui-colorpicker-palette-preview{border:1px solid #ccc}.tui-image-editor-container .tui-colorpicker-palette-hex[value=""]+.tui-colorpicker-palette-preview{background-size:cover;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAdBJREFUWAnFl0FuwjAQRZ0ukiugHqFSOQNdseuKW3ALzkA4BateICvUGyCxrtRFd4WuunH/TzykaYJrnLEYaTJJsP2+x8GZZCbQrLU5mj7Bn+EP8HvnCObd+R7xBV5lWfaNON4AnsA38E94qLEt+0yiFaBzAV/Bv+Cxxr4co7hKCDpw1q9wLeNYYdlAwyn8TYt8Hme3+8D5ozcTaMCZ68PXa2tnM2sbEcOZAJhrrpl2DAcTOGNjZPSfCdzkw6JrfbiMv+osBe4y9WOedhm4jZfhbENWuxS44H9Wz/xw4WzqLOAqh1+zycgAwzEMzr5k5gaHOa9ULBwuuDkFlHI1Kl4PJ66kgIpnoywOTmRFAYcbwYk9UMApWkD8zAV5ihcwHk4Rx7gl0IFTQL0EFc+CTQ9OZHWH3YhlVJiVpTHbrTGLhTHLZVgff6s9lyBsI9KduSS83oj+34rTwJutmBmCnMsvozRwZqB5GTkBw6/jdPDu69iJ6BYk6eCcfbcgcQIK/MByaaiMqm8rHcjol2TnpWDhyAKSGdA3FrxtJUToX0ODqatetfGE+8tyEUOV8GY5dGRwLP/MBS4RHQr4bT7NRAQjlcOTfZxmv2G+c4hI8nn+Ax5PG/zhI393AAAAAElFTkSuQmCC")}.tui-image-editor-container .tui-colorpicker-palette-preview{border-radius:100%;float:left;width:17px;height:17px;border:0}.tui-image-editor-container .color-picker-control{position:absolute;display:none;z-index:99;width:192px;background-color:#fff;box-shadow:0 3px 22px 6px rgba(0,0,0,.15);padding:16px;border-radius:2px}.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-toggle-slider{display:none}.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button{border:0;border-radius:100%;margin:2px;background-size:cover;font-size:1px}.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button[title=""],.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button[title="#ffffff"]{border:1px solid #ccc}.tui-image-editor-container .color-picker-control .triangle{width:0;height:0;border-right:7px solid transparent;border-top:8px solid #fff;border-left:7px solid transparent;position:absolute;bottom:-8px;left:84px}.tui-image-editor-container .color-picker-control .tui-colorpicker-container,.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-container,.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-container ul{width:100%;height:auto}.tui-image-editor-container .filter-color-item .color-picker-control label{font-color:#333;font-weight:400;margin-right:7pxleft}.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox{margin-top:0}.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox input+label:before{left:-16px}.tui-image-editor-container .color-picker{width:100%;height:auto}.tui-image-editor-container .color-picker-value{width:32px;height:32px;border:0;border-radius:100%;margin:auto;margin-bottom:1px}.tui-image-editor-container .color-picker-value.transparent{border:1px solid #cbcbcb;background-size:cover;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAdBJREFUWAnFl0FuwjAQRZ0ukiugHqFSOQNdseuKW3ALzkA4BateICvUGyCxrtRFd4WuunH/TzykaYJrnLEYaTJJsP2+x8GZZCbQrLU5mj7Bn+EP8HvnCObd+R7xBV5lWfaNON4AnsA38E94qLEt+0yiFaBzAV/Bv+Cxxr4co7hKCDpw1q9wLeNYYdlAwyn8TYt8Hme3+8D5ozcTaMCZ68PXa2tnM2sbEcOZAJhrrpl2DAcTOGNjZPSfCdzkw6JrfbiMv+osBe4y9WOedhm4jZfhbENWuxS44H9Wz/xw4WzqLOAqh1+zycgAwzEMzr5k5gaHOa9ULBwuuDkFlHI1Kl4PJ66kgIpnoywOTmRFAYcbwYk9UMApWkD8zAV5ihcwHk4Rx7gl0IFTQL0EFc+CTQ9OZHWH3YhlVJiVpTHbrTGLhTHLZVgff6s9lyBsI9KduSS83oj+34rTwJutmBmCnMsvozRwZqB5GTkBw6/jdPDu69iJ6BYk6eCcfbcgcQIK/MByaaiMqm8rHcjol2TnpWDhyAKSGdA3FrxtJUToX0ODqatetfGE+8tyEUOV8GY5dGRwLP/MBS4RHQr4bT7NRAQjlcOTfZxmv2G+c4hI8nn+Ax5PG/zhI393AAAAAElFTkSuQmCC")}.tui-image-editor-container .color-picker-value+label{color:#fff}.tui-image-editor-container .tui-image-editor-submenu svg>use{display:none}#tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype=icon-arrow-2] svg>use.active,#tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype=icon-arrow-3] svg>use.active,#tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype=icon-arrow] svg>use.active,#tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype=icon-bubble] svg>use.active,#tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype=icon-heart] svg>use.active,#tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype=icon-location] svg>use.active,#tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype=icon-polygon] svg>use.active,#tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype=icon-star] svg>use.active,.tui-image-editor-container .tui-image-editor-submenu svg>use.normal{display:block}#tie-draw-line-select-button.free .tui-image-editor-button.free svg>use.normal,#tie-draw-line-select-button.line .tui-image-editor-button.line svg>use.normal{display:none}#tie-draw-line-select-button.free .tui-image-editor-button.free svg>use.active,#tie-draw-line-select-button.line .tui-image-editor-button.line svg>use.active{display:block}#tie-flip-button.flipX .tui-image-editor-button.flipX svg>use.normal,#tie-flip-button.flipY .tui-image-editor-button.flipY svg>use.normal,#tie-flip-button.resetFlip .tui-image-editor-button.resetFlip svg>use.normal{display:none}#tie-flip-button.flipX .tui-image-editor-button.flipX svg>use.active,#tie-flip-button.flipY .tui-image-editor-button.flipY svg>use.active,#tie-flip-button.resetFlip .tui-image-editor-button.resetFlip svg>use.active{display:block}#tie-mask-apply.apply.active .tui-image-editor-button.apply label{color:#fff}#tie-mask-apply.apply.active .tui-image-editor-button.apply svg>use.active{display:block}#tie-crop-button .tui-image-editor-button.apply,#tie-crop-preset-button .tui-image-editor-button.apply{margin-right:24px}#tie-crop-button .tui-image-editor-button.apply.active svg>use.active,#tie-crop-button .tui-image-editor-button.preset.active svg>use.active,#tie-crop-preset-button .tui-image-editor-button.apply.active svg>use.active,#tie-crop-preset-button .tui-image-editor-button.preset.active svg>use.active{display:block}#tie-shape-button.circle .tui-image-editor-button.circle svg>use.normal,#tie-shape-button.rect .tui-image-editor-button.rect svg>use.normal,#tie-shape-button.triangle .tui-image-editor-button.triangle svg>use.normal{display:none}#tie-shape-button.circle .tui-image-editor-button.circle svg>use.active,#tie-shape-button.rect .tui-image-editor-button.rect svg>use.active,#tie-shape-button.triangle .tui-image-editor-button.triangle svg>use.active,#tie-text-align-button.center .tui-image-editor-button.center svg>use.active,#tie-text-align-button.left .tui-image-editor-button.left svg>use.active,#tie-text-align-button.right .tui-image-editor-button.right svg>use.active,#tie-text-effect-button .tui-image-editor-button.active svg>use.active{display:block}#tie-icon-image-file,#tie-mask-image-file{opacity:0;position:absolute;width:100%;height:100%;border:1px solid green;cursor:inherit;left:0;top:0}.tui-image-editor-container.top.tui-image-editor-top-optimization .tui-image-editor-controls ul{text-align:right}.tui-image-editor-container.top.tui-image-editor-top-optimization .tui-image-editor-controls-logo{display:none} \ No newline at end of file diff --git a/dist/tui-image-editor.min.js b/dist/tui-image-editor.min.js index 8e14ace93..ef75da260 100644 --- a/dist/tui-image-editor.min.js +++ b/dist/tui-image-editor.min.js @@ -1,28 +1,29 @@ /*! * tui-image-editor.min.js - * @version 3.2.2 + * @version 3.3.0 * @author NHNEnt FE Development Lab * @license MIT */ -!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("tui-code-snippet"),require("fabric/dist/fabric.require")):"function"==typeof define&&define.amd?define(["tui-code-snippet","fabric/dist/fabric.require"],t):"object"==typeof exports?exports.ImageEditor=t(require("tui-code-snippet"),require("fabric/dist/fabric.require")):(e.tui=e.tui||{},e.tui.ImageEditor=t(e.tui&&e.tui.util,e.fabric))}(this,function(e,t){return function(e){function t(i){if(n[i])return n[i].exports;var o=n[i]={exports:{},id:i,loaded:!1};return e[i].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var n={};return t.m=e,t.c=n,t.p="dist",t(0)}([function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}n(91);var o=n(88),r=i(o);n(148),n(45),n(46),n(47),n(48),n(49),n(50),n(51),n(52),n(53),n(54),n(55),n(56),n(57),n(58),n(59),n(60),n(61),n(63),n(62),e.exports=r.default},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(5),r=i(o);e.exports={componentNames:r.default.keyMirror("IMAGE_LOADER","CROPPER","FLIP","ROTATION","FREE_DRAWING","LINE","TEXT","ICON","FILTER","SHAPE"),commandNames:{CLEAR_OBJECTS:"clearObjects",LOAD_IMAGE:"loadImage",FLIP_IMAGE:"flip",ROTATE_IMAGE:"rotate",ADD_OBJECT:"addObject",REMOVE_OBJECT:"removeObject",APPLY_FILTER:"applyFilter",REMOVE_FILTER:"removeFilter",ADD_ICON:"addIcon",CHANGE_ICON_COLOR:"changeIconColor",ADD_SHAPE:"addShape",CHANGE_SHAPE:"changeShape",ADD_TEXT:"addText",CHANGE_TEXT:"changeText",CHANGE_TEXT_STYLE:"changeTextStyle",ADD_IMAGE_OBJECT:"addImageObject",RESIZE_CANVAS_DIMENSION:"resizeCanvasDimension",SET_OBJECT_PROPERTIES:"setObjectProperties",SET_OBJECT_POSITION:"setObjectPosition"},eventNames:{OBJECT_ACTIVATED:"objectActivated",OBJECT_MOVED:"objectMoved",OBJECT_SCALED:"objectScaled",OBJECT_CREATED:"objectCreated",TEXT_EDITING:"textEditing",TEXT_CHANGED:"textChanged",ICON_CREATE_RESIZE:"iconCreateResize",ICON_CREATE_END:"iconCreateEnd",ADD_TEXT:"addText",ADD_OBJECT:"addObject",ADD_OBJECT_AFTER:"addObjectAfter",MOUSE_DOWN:"mousedown",MOUSE_UP:"mouseup",MOUSE_MOVE:"mousemove",REDO_STACK_CHANGED:"redoStackChanged",UNDO_STACK_CHANGED:"undoStackChanged",SELECTION_CLEARED:"selectionCleared",SELECTION_CREATED:"selectionCreated"},drawingModes:r.default.keyMirror("NORMAL","CROPPER","FREE_DRAWING","LINE_DRAWING","TEXT","SHAPE"),keyCodes:{Z:90,Y:89,SHIFT:16,BACKSPACE:8,DEL:46},fObjectOptions:{SELECTION_STYLE:{borderColor:"red",cornerColor:"green",cornerSize:10,originX:"center",originY:"center",transparentCorners:!1}},rejectMessages:{flip:"The flipX and flipY setting values are not changed.",rotation:"The current angle is same the old angle.",loadImage:"The background image is empty.",isLock:"The executing command state is locked.",undo:"The promise of undo command is reject.",redo:"The promise of redo command is reject.",invalidDrawingMode:"This operation is not supported in the drawing mode",invalidParameters:"Invalid parameters",noActiveObject:"There is no active object.",unsupportedType:"Unsupported object type",noObject:"The object is not in canvas.",addedObject:"The object is already added."},defaultIconPath:{"icon-arrow":"M40 12V0l24 24-24 24V36H0V12h40z","icon-arrow-2":"M49,32 H3 V22 h46 l-18,-18 h12 l23,23 L43,50 h-12 l18,-18 z ","icon-arrow-3":"M43.349998,27 L17.354,53 H1.949999 l25.996,-26 L1.949999,1 h15.404 L43.349998,27 z ","icon-star":"M35,54.557999 l-19.912001,10.468 l3.804,-22.172001 l-16.108,-15.7 l22.26,-3.236 L35,3.746 l9.956,20.172001 l22.26,3.236 l-16.108,15.7 l3.804,22.172001 z ","icon-star-2":"M17,31.212 l-7.194,4.08 l-4.728,-6.83 l-8.234,0.524 l-1.328,-8.226 l-7.644,-3.14 l2.338,-7.992 l-5.54,-6.18 l5.54,-6.176 l-2.338,-7.994 l7.644,-3.138 l1.328,-8.226 l8.234,0.522 l4.728,-6.83 L17,-24.312 l7.194,-4.08 l4.728,6.83 l8.234,-0.522 l1.328,8.226 l7.644,3.14 l-2.338,7.992 l5.54,6.178 l-5.54,6.178 l2.338,7.992 l-7.644,3.14 l-1.328,8.226 l-8.234,-0.524 l-4.728,6.83 z ","icon-polygon":"M3,31 L19,3 h32 l16,28 l-16,28 H19 z ","icon-location":"M24 62C8 45.503 0 32.837 0 24 0 10.745 10.745 0 24 0s24 10.745 24 24c0 8.837-8 21.503-24 38zm0-28c5.523 0 10-4.477 10-10s-4.477-10-10-10-10 4.477-10 10 4.477 10 10 10z","icon-heart":"M49.994999,91.349998 l-6.96,-6.333 C18.324001,62.606995 2.01,47.829002 2.01,29.690998 C2.01,14.912998 13.619999,3.299999 28.401001,3.299999 c8.349,0 16.362,5.859 21.594,12 c5.229,-6.141 13.242001,-12 21.591,-12 c14.778,0 26.390999,11.61 26.390999,26.390999 c0,18.138 -16.314001,32.916 -41.025002,55.374001 l-6.96,6.285 z ","icon-bubble":"M44 48L34 58V48H12C5.373 48 0 42.627 0 36V12C0 5.373 5.373 0 12 0h40c6.627 0 12 5.373 12 12v24c0 6.627-5.373 12-12 12h-8z"},defaultRotateRangeValus:{realTimeEvent:!0,min:-360,max:360,value:0},defaultDrawRangeValus:{min:5,max:30,value:12},defaultShapeStrokeValus:{realTimeEvent:!1,min:2,max:300,value:3},defaultTextRangeValus:{realTimeEvent:!0,min:10,max:100,value:50},defaultFilterRangeValus:{tintOpacityRange:{min:0,max:1,value:.7},removewhiteThresholdRange:{min:0,max:255,value:60},removewhiteDistanceRange:{min:0,max:255,value:10},gradientTransparencyRange:{min:0,max:255,value:100},brightnessRange:{min:-255,max:255,value:100},noiseRange:{min:0,max:1e3,value:100},pixelateRange:{min:2,max:20,value:4},colorfilterThresholeRange:{min:0,max:255,value:45}}}},function(e,t,n){n(144),n(146),n(147),n(145),e.exports=n(16).Promise},function(t,n){t.exports=e},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e){var t=l[e];if(t){for(var n=arguments.length,i=Array(n>1?n-1:0),o=1;on&&(i=t,t=n,n=i),r(t,o(e,n))},keyMirror:function(){for(var e={},t=arguments.length,n=Array(t),o=0;o1&&void 0!==arguments[1]?arguments[1]:"#7e7e7e",i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"up";o(this,e);var r=t.getAttribute("title");this._show=!1,this._colorpickerElement=t,this._toggleDirection=i,this._makePickerButtonElement(t,n),this._makePickerLayerElement(t,r),this._color=n,this.picker=c.default.create({container:this.pickerElement,preset:u,color:n}),this._addEvent(t)}return r(e,[{key:"_changeColorElement",value:function(e){e?(this.colorElement.classList.remove("transparent"),this.colorElement.style.backgroundColor=e):(this.colorElement.style.backgroundColor="#fff",this.colorElement.classList.add("transparent"))}},{key:"_makePickerButtonElement",value:function(e,t){e.classList.add("tui-image-editor-button"),this.colorElement=document.createElement("div"),this.colorElement.className="color-picker-value",t?this.colorElement.style.backgroundColor=t:this.colorElement.classList.add("transparent")}},{key:"_makePickerLayerElement",value:function(e,t){var n=document.createElement("label"),i=document.createElement("div");this.pickerControl=document.createElement("div"),this.pickerControl.className="color-picker-control",this.pickerElement=document.createElement("div"),this.pickerElement.className="color-picker",n.innerHTML=t,i.className="triangle",this.pickerControl.appendChild(this.pickerElement),this.pickerControl.appendChild(i),e.appendChild(this.pickerControl),e.appendChild(this.colorElement),e.appendChild(n)}},{key:"_addEvent",value:function(e){var t=this;this.picker.on("selectColor",function(e){t._changeColorElement(e.color),t._color=e.color,t.fire("change",e.color)}),e.addEventListener("click",function(e){t._show=!t._show,t.pickerControl.style.display=t._show?"block":"none",t._setPickerControlPosition(),t.fire("changeShow",t),e.stopPropagation()}),document.body.addEventListener("click",function(){t.hide()})}},{key:"hide",value:function(){this._show=!1,this.pickerControl.style.display="none"}},{key:"_setPickerControlPosition",value:function(){var e=this.pickerControl.style,t=this._colorpickerElement.clientWidth/2+2,n=this.pickerControl.offsetWidth/2-t,i=(this.pickerControl.offsetHeight+10)*-1;"down"===this._toggleDirection&&(i=30),e.top=i+"px",e.left="-"+n+"px"}},{key:"color",get:function(){return this._color},set:function(e){this._color=e,this._changeColorElement(e)}}]),e}();s.default.CustomEvents.mixin(d),t.default=d},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var r=function(){function e(e,t){for(var n=0;n1&&void 0!==arguments[1]?arguments[1]:{};o(this,e),this._value=n.value||0,this.rangeElement=t,this._drawRangeElement(),this.rangeWidth=(0,l.toInteger)(window.getComputedStyle(t,null).width)-12,this._min=n.min||0,this._max=n.max||100,this._absMax=this._min*-1+this._max,this.realTimeEvent=n.realTimeEvent||!1,this._addClickEvent(),this._addDragEvent(),this.value=n.value,this.trigger("change")}return r(e,[{key:"trigger",value:function(e){this.fire(e,this._value)}},{key:"_drawRangeElement",value:function(){this.rangeElement.classList.add("tui-image-editor-range"),this.bar=document.createElement("div"),this.bar.className="tui-image-editor-virtual-range-bar",this.subbar=document.createElement("div"),this.subbar.className="tui-image-editor-virtual-range-subbar",this.pointer=document.createElement("div"),this.pointer.className="tui-image-editor-virtual-range-pointer",this.bar.appendChild(this.subbar),this.bar.appendChild(this.pointer),this.rangeElement.appendChild(this.bar)}},{key:"_addClickEvent",value:function(){var e=this;this.rangeElement.addEventListener("click",function(t){if(t.stopPropagation(),"tui-image-editor-range"===t.target.className){var n=t.offsetX,i=n/e.rangeWidth,o=e._absMax*i+e._min;e.pointer.style.left=i*e.rangeWidth+"px",e.subbar.style.right=(1-i)*e.rangeWidth+"px",e._value=o,e.fire("change",o)}})}},{key:"_addDragEvent",value:function(){var e=this;this.pointer.addEventListener("mousedown",function(t){e.firstPosition=t.screenX,e.firstLeft=(0,l.toInteger)(e.pointer.style.left)||0,e.dragEventHandler={changeAngle:e._changeAngle.bind(e),stopChangingAngle:e._stopChangingAngle.bind(e)},document.addEventListener("mousemove",e.dragEventHandler.changeAngle),document.addEventListener("mouseup",e.dragEventHandler.stopChangingAngle)})}},{key:"_changeAngle",value:function(e){var t=e.screenX,n=t-this.firstPosition,i=this.firstLeft+n;i=i>this.rangeWidth?this.rangeWidth:i,i=i<0?0:i,this.pointer.style.left=i+"px",this.subbar.style.right=this.rangeWidth-i+"px";var o=i/this.rangeWidth,r=this._absMax*o+this._min;this._value=r,this.realTimeEvent&&this.fire("change",r)}},{key:"_stopChangingAngle",value:function(){this.fire("change",this._value),document.removeEventListener("mousemove",this.dragEventHandler.changeAngle),document.removeEventListener("mouseup",this.dragEventHandler.stopChangingAngle)}},{key:"max",set:function(e){this._max=e,this._absMax=this._min*-1+this._max,this.value=this._value},get:function(){return this._max}},{key:"value",get:function(){return this._value},set:function(e){var t=e-this._min,n=t*this.rangeWidth/this._absMax;this.rangeWidth0?i:n)(e)}},function(e,t,n){var i=n(122),o=n(25);e.exports=function(e){return i(o(e))}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(3),r=i(o),a=n(5),s=(0,a.keyMirror)("UN_IMPLEMENTATION","NO_COMPONENT_NAME"),l={UN_IMPLEMENTATION:"Should implement a method: ",NO_COMPONENT_NAME:"Should set a component name"},c={UN_IMPLEMENTATION:function(e){return l.UN_IMPLEMENTATION+e},NO_COMPONENT_NAME:function(){return l.NO_COMPONENT_NAME}};e.exports={types:r.default.extend({},s),create:function(e){e=e.toLowerCase();for(var t=c[e],n=arguments.length,i=Array(n>1?n-1:0),o=1;on;)t.push(arguments[n++]);return v[++g]=function(){s("function"==typeof e?e:Function(e),t)},i(g),g},f=function(e){delete v[e]},"process"==n(19)(d)?i=function(e){d.nextTick(a(b,e,1))}:p?(o=new p,r=o.port2,o.port1.onmessage=y,i=a(r.postMessage,r,1)):u.addEventListener&&"function"==typeof postMessage&&!u.importScripts?(i=function(e){u.postMessage(e+"","*")},u.addEventListener("message",y,!1)):i=m in c("script")?function(e){l.appendChild(c("script"))[m]=function(){l.removeChild(this),b.call(e)}}:function(e){setTimeout(a(b,e,1),0)}),e.exports={set:h,clear:f}},function(e,t,n){var i=n(29),o=Math.min;e.exports=function(e){return e>0?o(i(e),9007199254740991):0}},function(e,t){var n=0,i=Math.random();e.exports=function(e){return"Symbol(".concat(void 0===e?"":e,")_",(++n+i).toString(36))}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0});var o=n(3),r=n(5),a=i(r),s=n(86),l=i(s);t.default={getActions:function(){return{main:this._mainAction(),shape:this._shapeAction(),crop:this._cropAction(),flip:this._flipAction(),rotate:this._rotateAction(),text:this._textAction(),mask:this._maskAction(),draw:this._drawAction(),icon:this._iconAction(),filter:this._filterAction()}},_mainAction:function(){var e=this,t=function(){"crop"===e.ui.submenu&&(e.stopDrawingMode(),e.ui.changeMenu("crop"))};return(0,o.extend)({initLoadImage:function(n,i){return e.loadImageFromURL(n,i).then(function(i){t(),e.ui.initializeImgUrl=n,e.ui.resizeEditor({imageSize:i}),e.clearUndoStack()})},undo:function(){e.isEmptyUndoStack()||(t(),e.undo())},redo:function(){e.isEmptyRedoStack()||(t(),e.redo())},reset:function(){t(),e.loadImageFromURL(e.ui.initializeImgUrl,"resetImage").then(function(n){t(),e.ui.resizeEditor({imageSize:n}),e.clearUndoStack()})},delete:function(){e.ui.changeDeleteButtonEnabled(!1),t(),e.removeActiveObject(),e.activeObjectId=null},deleteAll:function(){t(),e.clearObjects(),e.ui.changeDeleteButtonEnabled(!1),e.ui.changeDeleteAllButtonEnabled(!1)},load:function(n){a.default.isSupportFileApi()||alert("This browser does not support file-api"),e.ui.initializeImgUrl=URL.createObjectURL(n),e.loadImageFromFile(n).then(function(n){t(),e.clearUndoStack(),e.ui.activeMenuEvent(),e.ui.resizeEditor({imageSize:n})}).catch(function(e){return Promise.reject(e)})},download:function(){var t=e.toDataURL(),n=e.getImageName(),i=void 0,o=void 0,r=void 0;a.default.isSupportFileApi()&&window.saveAs?(i=a.default.base64ToBlob(t),o=i.type.split("/")[1],n.split(".").pop()!==o&&(n+="."+o),saveAs(i,n)):(r=window.open(),r.document.body.innerHTML="")}},this._commonAction())},_iconAction:function(){var e=this,t=void 0,n=void 0,i=void 0,r=void 0,a=void 0,s=void 0,c=void 0;this.on({iconCreateResize:function(t){var n=t.moveOriginPointer,o=(n.x-i)/a,l=(n.y-r)/s;e.setObjectPropertiesQuietly(c,{scaleX:Math.abs(2*o),scaleY:Math.abs(2*l)})},iconCreateEnd:function(){e.ui.icon.clearIconType(),e.changeSelectableAll(!0)}});var u=function(o,l){i=l.x,r=l.y,e.addIcon(t,{left:l.x,top:l.y,fill:n}).then(function(e){c=e.id,a=e.width,s=e.height})};return(0,o.extend)({changeColor:function(t){e.activeObjectId&&e.changeIconColor(e.activeObjectId,t)},addIcon:function(i,o){t=i,n=o,e.changeCursor("crosshair"),e.off("mousedown"),e.once("mousedown",u.bind(e))},cancelAddIcon:function(){e.off("mousedown"),e.ui.icon.clearIconType(),e.changeSelectableAll(!0),e.changeCursor("default")},registDefalutIcons:function(t,n){var i={};i[t]=n,e.registerIcons(i)},registCustomIcon:function(t,n){var i=new l.default;i.imageToSVG(t,function(t){var i=t.match(/path[^>]*d="([^"]*)"/),o=i[1],r={};r[n.name]=o,e.registerIcons(r),e.addIcon(n.name,{left:100,top:100})},l.default.tracerDefaultOption())}},this._commonAction())},_drawAction:function(){var e=this;return(0,o.extend)({setDrawMode:function(t,n){e.stopDrawingMode(),"free"===t?e.startDrawingMode("FREE_DRAWING",n):e.startDrawingMode("LINE_DRAWING",n)},setColor:function(t){e.setBrush({color:t})}},this._commonAction())},_maskAction:function(){var e=this;return(0,o.extend)({loadImageFromURL:function(t,n){return e.loadImageFromURL(e.toDataURL(),"FilterImage").then(function(){e.addImageObject(t).then(function(){URL.revokeObjectURL(n)})})},applyFilter:function(){e.applyFilter("mask",{maskObjId:e.activeObjectId})}},this._commonAction())},_textAction:function(){var e=this;return(0,o.extend)({changeTextStyle:function(t){e.activeObjectId&&e.changeTextStyle(e.activeObjectId,t)}},this._commonAction())},_rotateAction:function(){var e=this;return(0,o.extend)({rotate:function(t){e.rotate(t),e.ui.resizeEditor()},setAngle:function(t){e.setAngle(t),e.ui.resizeEditor()}},this._commonAction())},_shapeAction:function(){var e=this;return(0,o.extend)({changeShape:function(t){e.activeObjectId&&e.changeShape(e.activeObjectId,t)},setDrawingShape:function(t){e.setDrawingShape(t)}},this._commonAction())},_cropAction:function(){var e=this;return(0,o.extend)({crop:function(){var t=e.getCropzoneRect();t&&e.crop(t).then(function(){e.stopDrawingMode(),e.ui.resizeEditor(),e.ui.changeMenu("crop")}).catch(function(e){return Promise.reject(e)})},cancel:function(){e.stopDrawingMode(),e.ui.changeMenu("crop")}},this._commonAction())},_flipAction:function(){var e=this;return(0,o.extend)({flip:function(t){return e[t]()}},this._commonAction())},_filterAction:function(){var e=this;return(0,o.extend)({applyFilter:function(t,n,i){t?e.applyFilter(n,i):e.hasFilter(n)&&e.removeFilter(n)}},this._commonAction())},setReAction:function(){var e=this;this.on({undoStackChanged:function(t){t?(e.ui.changeUndoButtonStatus(!0),e.ui.changeResetButtonStatus(!0)):(e.ui.changeUndoButtonStatus(!1),e.ui.changeResetButtonStatus(!1)),e.ui.resizeEditor()},redoStackChanged:function(t){t?e.ui.changeRedoButtonStatus(!0):e.ui.changeRedoButtonStatus(!1),e.ui.resizeEditor()},objectActivated:function(t){e.activeObjectId=t.id,e.ui.changeDeleteButtonEnabled(!0),e.ui.changeDeleteAllButtonEnabled(!0),"cropzone"===t.type?e.ui.crop.changeApplyButtonStatus(!0):["rect","circle","triangle"].indexOf(t.type)>-1?(e.stopDrawingMode(),"shape"!==e.ui.submenu&&e.ui.changeMenu("shape",!1,!1),e.ui.shape.setShapeStatus({strokeColor:t.stroke,strokeWidth:t.strokeWidth,fillColor:t.fill}),e.ui.shape.setMaxStrokeValue(Math.min(t.width,t.height))):"path"===t.type||"line"===t.type?"draw"!==e.ui.submenu&&(e.ui.changeMenu("draw",!1,!1),e.ui.draw.changeStandbyMode()):["i-text","text"].indexOf(t.type)>-1?"text"!==e.ui.submenu&&e.ui.changeMenu("text",!1,!1):"icon"===t.type&&(e.stopDrawingMode(),"icon"!==e.ui.submenu&&e.ui.changeMenu("icon",!1,!1),e.ui.icon.setIconPickerColor(t.fill))},addText:function(t){e.addText("Double Click",{position:t.originPosition,styles:{fill:e.ui.text.textColor,fontSize:a.default.toInteger(e.ui.text.fontSize),fontFamily:"Noto Sans"}}).then(function(){e.changeCursor("default")})},addObjectAfter:function(t){["rect","circle","triangle"].indexOf(t.type)>-1&&(e.ui.shape.setMaxStrokeValue(Math.min(t.width,t.height)),e.ui.shape.changeStandbyMode())},objectScaled:function(t){if(["i-text","text"].indexOf(t.type)>-1)e.ui.text.fontSize=a.default.toInteger(t.fontSize);else if(["rect","circle","triangle"].indexOf(t.type)>=0){var n=t.width,i=t.height,o=e.ui.shape.getStrokeValue();nv&&(r.remove(),r.set(this._calcRectDimensionFromPoint(i,o)),t.add(r))}},{key:"_calcRectDimensionFromPoint",value:function(e,t){var n=this.getCanvas(),i=n.getWidth(),o=n.getHeight(),r=this._startX,a=this._startY,s=(0,g.clamp)(e,0,r),l=(0,g.clamp)(t,0,a),c=(0,g.clamp)(e,r,i)-s,u=(0,g.clamp)(t,a,o)-l;return this._withShiftKey&&(c>u?u=c:u>c&&(c=u),r>=e&&(s=r-c),a>=t&&(l=a-u)),{left:s,top:l,width:c,height:u}}},{key:"_onFabricMouseUp",value:function(){var e=this._cropzone,t=this._listeners,n=this.getCanvas();n.setActiveObject(e),n.off({"mouse:move":t.mousemove,"mouse:up":t.mouseup})}},{key:"getCroppedImageData",value:function(e){var t=this.getCanvas(),n=t.contains(this._cropzone);if(!e)return null;n&&this._cropzone.remove();var i={imageName:this.getImageName(),url:t.toDataURL(e)};return n&&t.add(this._cropzone),i}},{key:"getCropzoneRect",value:function(){var e=this._cropzone;return e.isValid()?{left:e.getLeft(),top:e.getTop(),width:e.getWidth(),height:e.getHeight()}:null}},{key:"_onKeyDown",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!0)}},{key:"_onKeyUp",value:function(e){e.keyCode===p.keyCodes.SHIFT&&(this._withShiftKey=!1)}}]),t}(d.default);e.exports=m},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;n=0,c=n.useDragAddIcon&&l,u=a?n._createIcon(a):null;u||o(y.invalidParameters),u.set(d.default.extend({type:"icon",fill:n._oColor},s,t,n.graphics.controlStyle)),r.add(u).setActiveObject(u),c&&n._addWithDragEvent(r),i(n.graphics.createObjectProperties(u))})}},{key:"_addWithDragEvent",value:function(e){var t=this;e.on({"mouse:move":function(n){e.selection=!1,t.fire(b.ICON_CREATE_RESIZE,{moveOriginPointer:e.getPointer(n.e)})},"mouse:up":function(n){t.fire(b.ICON_CREATE_END,{moveOriginPointer:e.getPointer(n.e)}),e.defaultCursor="default",e.off("mouse:up"),e.off("mouse:move"),e.selection=!0}})}},{key:"registerPaths",value:function(e){var t=this;d.default.forEach(e,function(e,n){t._pathMap[n]=e},this)}},{key:"setColor",value:function(e,t){this._oColor=e,t&&"icon"===t.get("type")&&(t.setFill(this._oColor),this.getCanvas().renderAll())}},{key:"getColor",value:function(e){return e.fill}},{key:"_createIcon",value:function(e){return new c.default.Path(e)}}]),t}(g.default);e.exports=k},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;nn},_getColor:function(e,t,n){var i=[0,0,0,0],o=e.data,r=e.width,a=4,s=(r*n+t)*a;return i[0]=o[s],i[1]=o[s+1],i[2]=o[s+2],i[3]=o[s+3],i}});e.exports=a},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(3),r=i(o),a=n(6),s=i(a),l=n(5),c="tl",u="tr",d="mt",h="ml",f="mr",p="mb",g="bl",v="br",m=s.default.util.createClass(s.default.Rect,{initialize:function(e,t){e=r.default.extend(e,t),e.type="cropzone",this.callSuper("initialize",e),this.options=e,this.on({moving:this._onMoving,scaling:this._onScaling})},_render:function(e){var t=7,n=7;this.callSuper("_render",e);var i=this.flipX?-1:1,o=this.flipY?-1:1,r=i/this.scaleX,a=o/this.scaleY;e.scale(r,a),this._fillOuterRect(e,"rgba(0, 0, 0, 0.55)"),this.options.lineWidth?(this._fillInnerRect(e),this._strokeBorder(e,"rgb(255, 255, 255)",{lineWidth:this.options.lineWidth})):(this._strokeBorder(e,"rgb(0, 0, 0)",{lineDashWidth:t}),this._strokeBorder(e,"rgb(255, 255, 255)",{lineDashWidth:t,lineDashOffset:n})),e.scale(1/r,1/a)},_fillOuterRect:function(e,t){var n=this._getCoordinates(e),i=n.x,o=n.y;e.save(),e.fillStyle=t,e.beginPath(),e.moveTo(i[0]-1,o[0]-1),e.lineTo(i[3]+1,o[0]-1),e.lineTo(i[3]+1,o[3]+1),e.lineTo(i[0]-1,o[3]+1),e.lineTo(i[0]-1,o[0]-1),e.closePath(),e.moveTo(i[1],o[1]),e.lineTo(i[1],o[2]),e.lineTo(i[2],o[2]),e.lineTo(i[2],o[1]),e.lineTo(i[1],o[1]),e.closePath(),e.fill(),e.restore()},_fillInnerRect:function(e){var t=this._getCoordinates(e),n=t.x,i=t.y,o=this._caculateInnerPosition(n,(n[2]-n[1])/3),r=this._caculateInnerPosition(i,(i[2]-i[1])/3);e.save(),e.strokeStyle="rgba(255, 255, 255, 0.7)",e.lineWidth=this.options.lineWidth,e.beginPath(),e.moveTo(o[0],r[1]),e.lineTo(o[3],r[1]),e.moveTo(o[0],r[2]),e.lineTo(o[3],r[2]),e.moveTo(o[1],r[0]),e.lineTo(o[1],r[3]),e.moveTo(o[2],r[0]),e.lineTo(o[2],r[3]),e.stroke(),e.closePath(),e.restore()},_caculateInnerPosition:function(e,t){var n=[];return n[0]=e[1],n[1]=e[1]+t,n[2]=e[1]+2*t,n[3]=e[2],n},_getCoordinates:function(e){var t=this.getWidth(),n=this.getHeight(),i=t/2,o=n/2,a=this.getLeft(),s=this.getTop(),l=e.canvas;return{x:r.default.map([-(i+a),-i,i,i+(l.width-a-t)],Math.ceil),y:r.default.map([-(o+s),-o,o,o+(l.height-s-n)],Math.ceil)}},_strokeBorder:function(e,t,n){var i=n.lineDashWidth,o=n.lineDashOffset,r=n.lineWidth,a=this.getWidth()/2,s=this.getHeight()/2;e.save(),e.strokeStyle=t,e.setLineDash&&e.setLineDash([i,i]),o&&(e.lineDashOffset=o),r&&(e.lineWidth=r),e.beginPath(),e.moveTo(-a,-s),e.lineTo(a,-s),e.lineTo(a,s),e.lineTo(-a,s),e.lineTo(-a,-s),e.stroke(),e.restore()},_onMoving:function(){var e=this.getLeft(),t=this.getTop(),n=this.getWidth(),i=this.getHeight(),o=this.canvas.getWidth()-n,r=this.canvas.getHeight()-i;this.setLeft((0,l.clamp)(e,0,o)),this.setTop((0,l.clamp)(t,0,r))},_onScaling:function(e){var t=this.canvas.getPointer(e.e),n=this._calcScalingSizeFromPointer(t);this.scale(1).set(n)},_calcScalingSizeFromPointer:function(e){var t=e.x,n=e.y,i=this._calcTopLeftScalingSizeFromPointer(t,n),o=this._calcBottomRightScalingSizeFromPointer(t,n);return this._makeScalingSettings(i,o)},_calcTopLeftScalingSizeFromPointer:function(e,t){var n=this.getHeight()+this.top,i=this.getWidth()+this.left,o=(0,l.clamp)(t,0,n-1),r=(0,l.clamp)(e,0,i-1);return{top:o,left:r,width:i-r,height:n-o}},_calcBottomRightScalingSizeFromPointer:function(e,t){var n=this.canvas,i=n.width,o=n.height,r=this.left,a=this.top;return{width:(0,l.clamp)(e,r+1,i)-r,height:(0,l.clamp)(t,a+1,o)-a}},_makeScalingSettings:function(e,t){var n=e.width,i=e.height,o=t.height,r=t.width,a=e.left,s=e.top,l=void 0;switch(this.__corner){case c:l=e;break;case u:l={width:r,height:i,top:s};break;case g:l={width:n,height:o,left:a};break;case v:l=t;break;case h:l={width:n,left:a};break;case d:l={height:i,top:s};break;case f:l={width:r};break;case p:l={height:o}}return l},isValid:function(){return this.left>=0&&this.top>=0&&this.width>0&&this.height>0}});e.exports=m},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(6),r=i(o),a=r.default.util.createClass(r.default.Image.filters.Convolute,{type:"Emboss",initialize:function(){var e=[1,1,1,1,.7,-1,-1,-1,-1];this.matrix=e}});e.exports=a},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(6),r=i(o),a=r.default.util.createClass(r.default.Image.filters.Mask,{applyTo:function(e){if(this.mask){var t=e.width,n=e.height,i=this._createCanvasOfMask(t,n),o=e.getContext("2d"),r=i.getContext("2d"),a=o.getImageData(0,0,t,n);this._drawMask(r,e,o),this._mapData(r,a,t,n),o.putImageData(a,0,0)}},_createCanvasOfMask:function(e,t){var n=r.default.util.createCanvasElement();return n.width=e,n.height=t,n},_drawMask:function(e){var t=this.mask,n=t.getElement(),i=t.getLeft(),o=t.getTop(),r=t.getAngle();e.save(),e.translate(i,o),e.rotate(r*Math.PI/180),e.scale(t.scaleX,t.scaleY),e.drawImage(n,-n.width/2,-n.height/2),e.restore()},_mapData:function(e,t,n,i){for(var o=t.data,r=e.getImageData(0,0,n,i).data,a=this.channel,s=t.width*t.height*4,l=0;l1&&void 0!==arguments[1]?arguments[1]:{},i=n.cssMaxWidth,r=n.cssMaxHeight,a=n.useItext,s=void 0!==a&&a,l=n.useDragAddIcon,c=void 0!==l&&l;o(this,e),this.canvasImage=null,this.cssMaxWidth=i||ie,this.cssMaxHeight=r||oe,this.useItext=s,this.useDragAddIcon=c,this.cropSelectionStyle={},this.imageName="",this._objects={},this._canvas=null,this._drawingMode=q.NORMAL,this._drawingModeMap={},this._componentMap={},this._handler={onMouseDown:this._onMouseDown.bind(this),onObjectAdded:this._onObjectAdded.bind(this),onObjectRemoved:this._onObjectRemoved.bind(this),onObjectMoved:this._onObjectMoved.bind(this),onObjectScaled:this._onObjectScaled.bind(this),onObjectSelected:this._onObjectSelected.bind(this),onPathCreated:this._onPathCreated.bind(this),onSelectionCleared:this._onSelectionCleared.bind(this),onSelectionCreated:this._onSelectionCreated.bind(this)},this._setCanvasElement(t),this._createDrawingModeInstances(),this._createComponents(),this._attachCanvasEvents()}return r(e,[{key:"destroy",value:function(){var e=this._canvas.wrapperEl;this._canvas.clear(),e.parentNode.removeChild(e)}},{key:"deactivateAll",value:function(){return this._canvas.deactivateAll(),this}},{key:"renderAll",value:function(){return this._canvas.renderAll(),this}},{key:"add",value:function(e){var t,n=[];$(e)?n=e:n.push(e),(t=this._canvas).add.apply(t,n)}},{key:"contains",value:function(e){return this._canvas.contains(e)}},{key:"getObjects",value:function(){return this._canvas.getObjects().slice()}},{key:"getObject",value:function(e){return this._objects[e]}},{key:"remove",value:function(e){this._canvas.remove(e)}},{key:"removeAll",value:function(e){var t=this._canvas,n=t.getObjects().slice();return t.remove.apply(t,this._canvas.getObjects()),e&&t.clear(),n}},{key:"removeObjectById",value:function(e){var t=[],n=this._canvas,i=this.getObject(e),o=i&&i.isType("group")&&!i.isEmpty();return o?(n.discardActiveGroup(),i.forEachObject(function(e){t.push(e),e.remove()})):n.contains(i)&&(t.push(i),i.remove()),t}},{key:"getObjectId",value:function(e){var t=null;for(t in this._objects)if(this._objects.hasOwnProperty(t)&&e===this._objects[t])return t;return null}},{key:"getActiveObject",value:function(){return this._canvas.getActiveObject()}},{key:"getActiveGroupObject",value:function(){return this._canvas.getActiveGroup()}},{key:"setActiveObject",value:function(e){this._canvas.setActiveObject(e)}},{key:"setCropSelectionStyle",value:function(e){this.cropSelectionStyle=e}},{key:"getComponent",value:function(e){return this._componentMap[e]}},{key:"getDrawingMode",value:function(){return this._drawingMode}},{key:"startDrawingMode",value:function(e,t){if(this._isSameDrawingMode(e))return!0;this.stopDrawingMode();var n=this._getDrawingModeInstance(e);return n&&n.start&&(n.start(this,t),this._drawingMode=e),!!n}},{key:"stopDrawingMode",value:function(){if(!this._isSameDrawingMode(q.NORMAL)){var e=this._getDrawingModeInstance(this.getDrawingMode());e&&e.end&&e.end(this),this._drawingMode=q.NORMAL}}},{key:"toDataURL",value:function(e){return this._canvas&&this._canvas.toDataURL(e)}},{key:"setCanvasImage",value:function(e,t){t&&Z(t),this.imageName=e,this.canvasImage=t}},{key:"setCssMaxDimension",value:function(e){this.cssMaxWidth=e.width||this.cssMaxWidth,this.cssMaxHeight=e.height||this.cssMaxHeight}},{key:"adjustCanvasDimension",value:function(){var e=this.canvasImage.scale(1),t=e.getBoundingRect(),n=t.width,i=t.height,o=this._calcMaxDimension(n,i);this.setCanvasCssDimension({width:"100%",height:"100%","max-width":o.width+"px","max-height":o.height+"px"}),this.setCanvasBackstoreDimension({width:n,height:i}),this._canvas.centerObject(e)}},{key:"setCanvasCssDimension",value:function(e){this._canvas.setDimensions(e,re)}},{key:"setCanvasBackstoreDimension",value:function(e){this._canvas.setDimensions(e,ae)}},{key:"setImageProperties",value:function(e,t){var n=this.canvasImage;n&&(n.set(e).setCoords(),t&&this._canvas.renderAll())}},{key:"getCanvasElement",value:function(){return this._canvas.getElement()}},{key:"getCanvas",value:function(){return this._canvas}},{key:"getCanvasImage",value:function(){return this.canvasImage}},{key:"getImageName",value:function(){return this.imageName}},{key:"addImageObject",value:function(e){var t=this,n=this._callbackAfterLoadingImageObject.bind(this);return new c.default(function(i){d.default.Image.fromURL(e,function(e){n(e),i(t.createObjectProperties(e))},{crossOrigin:"Anonymous"})})}},{key:"getCenter",value:function(){return this._canvas.getCenter()}},{key:"getCropzoneRect",value:function(){return this.getComponent(G.CROPPER).getCropzoneRect()}},{key:"getCroppedImageData",value:function(e){return this.getComponent(G.CROPPER).getCroppedImageData(e)}},{key:"setBrush",value:function(e){var t=this._drawingMode,n=G.FREE_DRAWING;t===q.LINE&&(n=q.LINE),this.getComponent(n).setBrush(e)}},{key:"setDrawingShape",value:function(e,t){this.getComponent(G.SHAPE).setStates(e,t)}},{key:"registerPaths",value:function(e){this.getComponent(G.ICON).registerPaths(e)}},{key:"changeCursor",value:function(e){var t=this.getCanvas();t.defaultCursor=e,t.renderAll()}},{key:"hasFilter",value:function(e){return this.getComponent(G.FILTER).hasFilter(e)}},{key:"setSelectionStyle",value:function(e){J(K.SELECTION_STYLE,e)}},{key:"setObjectProperties",value:function(e,t){var n=this.getObject(e),i=J({},t);return n.set(i),n.setCoords(),this.getCanvas().renderAll(),i}},{key:"getObjectProperties",value:function(e,t){var n=this.getObject(e),i={};return Q(t)?i[t]=n[t]:$(t)?ee(t,function(e){i[e]=n[e]}):te(t,function(e,t){i[t]=n[t]}),i}},{key:"getObjectPosition",value:function(e,t,n){var i=this.getObject(e);return i?i.getPointByOrigin(t,n):null}},{key:"setObjectPosition",value:function(e,t){var n=this.getObject(e),i=t.x,o=t.y,r=t.originX,a=t.originY;if(!n)return!1;var s=n.getPointByOrigin(r,a),l=n.getPointByOrigin("center","center"),c=l.x-s.x,u=l.y-s.y;return n.set({left:i+c,top:o+u}),n.setCoords(),!0}},{key:"getCanvasSize",value:function(){var e=this.getCanvasImage();return{width:e?e.width:0,height:e?e.height:0}}},{key:"_getDrawingModeInstance",value:function(e){return this._drawingModeMap[e]}},{key:"_setCanvasElement",value:function(e){var t=void 0,n=void 0;t=e.jquery?e[0]:e.nodeType?e:document.querySelector(e),"CANVAS"!==t.nodeName.toUpperCase()&&(n=document.createElement("canvas"),t.appendChild(n)),this._canvas=new d.default.Canvas(n,{containerClass:"tui-image-editor-canvas-container",enableRetinaScaling:!1})}},{key:"_createDrawingModeInstances",value:function(){this._register(this._drawingModeMap,new D.default),this._register(this._drawingModeMap,new R.default),this._register(this._drawingModeMap,new N.default),this._register(this._drawingModeMap,new F.default),this._register(this._drawingModeMap,new z.default)}},{key:"_createComponents",value:function(){this._register(this._componentMap,new f.default(this)),this._register(this._componentMap,new g.default(this)),this._register(this._componentMap,new m.default(this)),this._register(this._componentMap,new y.default(this)),this._register(this._componentMap,new k.default(this)),this._register(this._componentMap,new x.default(this)),this._register(this._componentMap,new C.default(this)),this._register(this._componentMap,new S.default(this)),this._register(this._componentMap,new j.default(this)),this._register(this._componentMap,new P.default(this))}},{key:"_register",value:function(e,t){e[t.getName()]=t}},{key:"_isSameDrawingMode",value:function(e){return this.getDrawingMode()===e}},{key:"_calcMaxDimension",value:function(e,t){var n=this.cssMaxWidth/e,i=this.cssMaxHeight/t,o=Math.min(e,this.cssMaxWidth),r=Math.min(t,this.cssMaxHeight); -return n<1&&n-1&&J(n,this._createTextProperties(e,n)),n}},{key:"_createTextProperties",value:function(e){var t=["text","fontFamily","fontSize","fontStyle","textAlign","textDecoration"],n={};return J(n,X.default.getProperties(e,t)),n}},{key:"_addFabricObject",value:function(e){var t=Z(e);return this._objects[t]=e,t}},{key:"_removeFabricObject",value:function(e){delete this._objects[e]}}]),e}();ne.mixin(se),e.exports=se},function(e,t){"use strict";function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n0&&(e=this.blur(e,t.blurradius,t.blurdelta)),h=0;h0)for(d=0;d0&&(f[d]={r:Math.floor(s[d].r/s[d].n),g:Math.floor(s[d].g/s[d].n),b:Math.floor(s[d].b/s[d].n),a:Math.floor(s[d].a/s[d].n)}),s[d].n/ln[i].boundingbox[2]&&(n[i].boundingbox[2]=r-1),a-1n[i].boundingbox[3]&&(n[i].boundingbox[3]=a-1),h=this.pathscan_combined_lookup[e[a][r]][c],e[a][r]=h[0],c=h[1],r+=h[2],a+=h[3],r-1===n[i].points[0].x&&a-1===n[i].points[0].y)if(u=!0,n[i].points.lengtht[2]&&e[3]>t[3]}},{key:"batchpathscan",value:function(e,t){var n=[];for(var i in e)e.hasOwnProperty(i)&&(n[i]=this.pathscan(e[i],t));return n}},{key:"internodes",value:function(e,t){var n=[],i=0,o=0,r=0,a=0,s=0,l=void 0,c=void 0;for(l=0;l0&&(n[l].points[n[l].points.length-1].linesegment=this.getdirection(n[l].points[n[l].points.length-1].x,n[l].points[n[l].points.length-1].y,e[l].points[c].x,e[l].points[c].y)),n[l].points.push({x:e[l].points[c].x,y:e[l].points[c].y,linesegment:this.getdirection(e[l].points[c].x,e[l].points[c].y,(e[l].points[c].x+e[l].points[o].x)/2,(e[l].points[c].y+e[l].points[o].y)/2)})),n[l].points.push({x:(e[l].points[c].x+e[l].points[o].x)/2,y:(e[l].points[c].y+e[l].points[o].y)/2,linesegment:this.getdirection((e[l].points[c].x+e[l].points[o].x)/2,(e[l].points[c].y+e[l].points[o].y)/2,(e[l].points[o].x+e[l].points[r].x)/2,(e[l].points[o].y+e[l].points[r].y)/2)});return n}},{key:"testrightangle",value:function(e,t,n,i,o,r){return e.points[i].x===e.points[t].x&&e.points[i].x===e.points[n].x&&e.points[i].y===e.points[o].y&&e.points[i].y===e.points[r].y||e.points[i].y===e.points[t].y&&e.points[i].y===e.points[n].y&&e.points[i].x===e.points[o].x&&e.points[i].x===e.points[r].x}},{key:"getdirection",value:function(e,t,n,i){var o=8;return o=ei?7:0:e>n?ti?5:4:ti?6:8}},{key:"batchinternodes",value:function(e,t){var n=[];for(var i in e)e.hasOwnProperty(i)&&(n[i]=this.internodes(e[i],t));return n}},{key:"tracepath",value:function(e,t,n){var i=0,o=void 0,r=void 0,a=void 0,s={};for(s.segments=[],s.boundingbox=e.boundingbox,s.holechildren=e.holechildren,s.isholepath=e.isholepath;i0?a:e.points.length}return s}},{key:"fitseq",value:function(e,t,n,i,o){if(o>e.points.length||o<0)return[];var r=i,a=0,s=!0,l=void 0,c=void 0,u=void 0,d=o-i;d<0&&(d+=e.points.length);for(var h=(e.points[o].x-e.points[i].x)/d,f=(e.points[o].y-e.points[i].y)/d,p=(i+1)%e.points.length,g=void 0;p!=o;)g=p-i,g<0&&(g+=e.points.length),l=e.points[i].x+h*g,c=e.points[i].y+f*g,u=(e.points[p].x-l)*(e.points[p].x-l)+(e.points[p].y-c)*(e.points[p].y-c),u>t&&(s=!1),u>a&&(r=p,a=u),p=(p+1)%e.points.length;if(s)return[{type:"L",x1:e.points[i].x,y1:e.points[i].y,x2:e.points[o].x,y2:e.points[o].y}];var v=r;s=!0,a=0;var m=(v-i)/d,b=(1-m)*(1-m),y=2*(1-m)*m,_=m*m,k=(b*e.points[i].x+_*e.points[o].x-e.points[v].x)/-y,w=(b*e.points[i].y+_*e.points[o].y-e.points[v].y)/-y;for(p=i+1;p!=o;)m=(p-i)/d,b=(1-m)*(1-m),y=2*(1-m)*m,_=m*m,l=b*e.points[i].x+y*k+_*e.points[o].x,c=b*e.points[i].y+y*w+_*e.points[o].y,u=(e.points[p].x-l)*(e.points[p].x-l)+(e.points[p].y-c)*(e.points[p].y-c),u>n&&(s=!1),u>a&&(r=p,a=u),p=(p+1)%e.points.length;if(s)return[{type:"Q",x1:e.points[i].x,y1:e.points[i].y,x2:k,y2:w,x3:e.points[o].x,y3:e.points[o].y}];var x=v;return this.fitseq(e,t,n,i,x).concat(this.fitseq(e,t,n,x,o))}},{key:"batchtracepaths",value:function(e,t,n){var i=[];for(var o in e)e.hasOwnProperty(o)&&i.push(this.tracepath(e[o],t,n));return i}},{key:"batchtracelayers",value:function(e,t,n){var i=[];for(var o in e)e.hasOwnProperty(o)&&(i[o]=this.batchtracepaths(e[o],t,n));return i}},{key:"roundtodec",value:function(e,t){return Number(e.toFixed(t))}},{key:"svgpathstring",value:function(e,t,n,i){var o=e.layers[t],r=o[n],a="",s=void 0;if(i.linefilter&&r.segments.length<3)return a;if(a="=0;s--)a+=c.segments[s].type+" ",c.segments[s].hasOwnProperty("x3")&&(a+=c.segments[s].x2*i.scale+" "+c.segments[s].y2*i.scale+" "),a+=c.segments[s].x1*i.scale+" "+c.segments[s].y1*i.scale+" ";else for(a+=c.segments[c.segments.length-1].hasOwnProperty("x3")?"M "+this.roundtodec(c.segments[c.segments.length-1].x3*i.scale)+" "+this.roundtodec(c.segments[c.segments.length-1].y3*i.scale)+" ":"M "+this.roundtodec(c.segments[c.segments.length-1].x2*i.scale)+" "+this.roundtodec(c.segments[c.segments.length-1].y2*i.scale)+" ",s=c.segments.length-1;s>=0;s--)a+=c.segments[s].type+" ",c.segments[s].hasOwnProperty("x3")&&(a+=this.roundtodec(c.segments[s].x2*i.scale)+" "+this.roundtodec(c.segments[s].y2*i.scale)+" "),a+=this.roundtodec(c.segments[s].x1*i.scale)+" "+this.roundtodec(c.segments[s].y1*i.scale)+" ";a+="Z "}if(a+='" />',i.lcpr||i.qcpr){for(s=0;s',a+='',a+='',a+=''),!r.segments[s].hasOwnProperty("x3")&&i.lcpr&&(a+='');for(var l=0;l',a+='',a+='',a+=''),!c.segments[s].hasOwnProperty("x3")&&i.lcpr&&(a+='')}}return a}},{key:"getsvgstring",value:function(e,t){t=this.checkoptions(t);for(var n=e.width*t.scale,i=e.height*t.scale,o="',r=0;r5&&(t=5),n=Math.abs(n),n>1024&&(n=1024);var p=this.gks[t-1];for(o=0;o0&&i+r0&&o+rn&&(f.data[s]=e.data[s],f.data[s+1]=e.data[s+1],f.data[s+2]=e.data[s+2],f.data[s+3]=e.data[s+3]);return f}},{key:"loadImage",value:function(e,t,n){var i=new Image;n&&n.corsenabled&&(i.crossOrigin="Anonymous"),i.src=e,i.onload=function(){var e=document.createElement("canvas");e.width=i.width,e.height=i.height;var n=e.getContext("2d");n.drawImage(i,0,0),t(e)}}},{key:"getImgdata",value:function(e){var t=e.getContext("2d");return t.getImageData(0,0,e.width,e.height)}},{key:"drawLayers",value:function(e,t,n,i){n=n||1;var o=void 0,r=void 0,a=void 0,s=void 0,l=void 0,c=void 0;i?(c=document.getElementById(i),c||(c=document.createElement("div"),c.id=i,document.body.appendChild(c))):(c=document.createElement("div"),document.body.appendChild(c));for(l in e)if(e.hasOwnProperty(l)){o=e[l][0].length,r=e[l].length;var u=document.createElement("canvas");u.width=o*n,u.height=r*n;var d=u.getContext("2d");for(s=0;sl?"right":"left",originY:o>c?"bottom":"top"}}function o(e){return"center"===e.getOriginX()&&"center"===e.getOriginY()}function r(e,t){var n=t.getPointByOrigin("center","center"),o=-t.getAngle(),r=i(n,e,o),a=r.originX,s=r.originY,l=t.getPointByOrigin(a,s),c=t.getLeft()-(n.x-l.x),u=t.getTop()-(n.x-l.y);t.set({originX:a,originY:s,left:c,top:u}),t.setCoords()}function a(e,t){var n=t.startPoint,o=-t.getAngle(),r=i(n,e,o),a=r.originX,s=r.originY;t.setPositionByOrigin(n,a,s)}function s(e){var t=e.type,n=e.scaleX,i=e.scaleY,o=u[t],r=e[o.w]*n,a=e[o.h]*i;if(e.isRegular){var s=Math.max(n,i);r=e[o.w]*s,a=e[o.h]*s}var l={hasControls:!1,hasBorders:!1,scaleX:1,scaleY:1};l[o.w]=r,l[o.h]=a,e.set(l)}function l(e,t){var n=t.type,i=t.strokeWidth,o=t.startPoint,r=c[n],a=u[n],s=!("triangle"!==t.type),l={},d=Math.abs(o.x-e.x)/r,h=Math.abs(o.y-e.y)/r;d>i&&(d-=i/r),h>i&&(h-=i/r),t.isRegular&&(d=h=Math.max(d,h),s&&(h=Math.sqrt(3)/2*d)),l[a.w]=d,l[a.h]=h,t.set(l)}var c={rect:1,circle:2,triangle:1},u={rect:{w:"width",h:"height"},circle:{w:"rx",h:"ry"},triangle:{w:"width",h:"height"}};e.exports={setOrigins:function(e){var t=e.getPointByOrigin("left","top"),n=e.getPointByOrigin("right","top"),i=e.getPointByOrigin("right","bottom"),o=e.getPointByOrigin("left","bottom");e.origins={lt:t,rt:n,rb:i,lb:o}},resize:function(e,t,i){o(e)&&(r(t,e),n(e)),i?s(e,t):l(t,e),a(t,e)},adjustOriginToCenter:function(e){var t=e.getPointByOrigin("center","center"),n=e.getOriginX(),i=e.getOriginY(),o=e.getPointByOrigin(n,i),r=e.getLeft()+(t.x-o.x),a=e.getTop()+(t.y-o.y);e.set({hasControls:!0,hasBorders:!0,originX:"center",originY:"center",left:r,top:a}),e.setCoords()}}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var r=function(){function e(e,t){for(var n=0;n1?n-1:0),o=1;o1?n-1:0),o=1;on&&(i=t,t=n,n=i),r(t,o(e,n))},keyMirror:function(){for(var e={},t=arguments.length,n=Array(t),o=0;o1&&void 0!==arguments[1]?arguments[1]:"#7e7e7e",i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"up";o(this,e);var r=t.getAttribute("title");this._show=!1,this._colorpickerElement=t,this._toggleDirection=i,this._makePickerButtonElement(t,n),this._makePickerLayerElement(t,r),this._color=n,this.picker=c.default.create({container:this.pickerElement,preset:u,color:n}),this._addEvent(t)}return r(e,[{key:"_changeColorElement",value:function(e){e?(this.colorElement.classList.remove("transparent"),this.colorElement.style.backgroundColor=e):(this.colorElement.style.backgroundColor="#fff",this.colorElement.classList.add("transparent"))}},{key:"_makePickerButtonElement",value:function(e,t){e.classList.add("tui-image-editor-button"),this.colorElement=document.createElement("div"),this.colorElement.className="color-picker-value",t?this.colorElement.style.backgroundColor=t:this.colorElement.classList.add("transparent")}},{key:"_makePickerLayerElement",value:function(e,t){var n=document.createElement("label"),i=document.createElement("div");this.pickerControl=document.createElement("div"),this.pickerControl.className="color-picker-control",this.pickerElement=document.createElement("div"),this.pickerElement.className="color-picker",n.innerHTML=t,i.className="triangle",this.pickerControl.appendChild(this.pickerElement),this.pickerControl.appendChild(i),e.appendChild(this.pickerControl),e.appendChild(this.colorElement),e.appendChild(n)}},{key:"_addEvent",value:function(e){var t=this;this.picker.on("selectColor",function(e){t._changeColorElement(e.color),t._color=e.color,t.fire("change",e.color)}),e.addEventListener("click",function(e){t._show=!t._show,t.pickerControl.style.display=t._show?"block":"none",t._setPickerControlPosition(),t.fire("changeShow",t),e.stopPropagation()}),document.body.addEventListener("click",function(){t.hide()})}},{key:"hide",value:function(){this._show=!1,this.pickerControl.style.display="none"}},{key:"_setPickerControlPosition",value:function(){var e=this.pickerControl.style,t=this._colorpickerElement.clientWidth/2+2,n=this.pickerControl.offsetWidth/2-t,i=(this.pickerControl.offsetHeight+10)*-1;"down"===this._toggleDirection&&(i=30),e.top=i+"px",e.left="-"+n+"px"}},{key:"color",get:function(){return this._color},set:function(e){this._color=e,this._changeColorElement(e)}}]),e}();s.default.CustomEvents.mixin(d),t.default=d},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var r=function(){function e(e,t){for(var n=0;n1&&void 0!==arguments[1]?arguments[1]:{};o(this,e),this._value=n.value||0,this.rangeElement=t,this._drawRangeElement(),this.rangeWidth=(0,l.toInteger)(window.getComputedStyle(t,null).width)-12,this._min=n.min||0,this._max=n.max||100,this._absMax=this._min*-1+this._max,this.realTimeEvent=n.realTimeEvent||!1,this._addClickEvent(),this._addDragEvent(),this.value=n.value,this.trigger("change")}return r(e,[{key:"trigger",value:function(e){this.fire(e,this._value)}},{key:"_drawRangeElement",value:function(){this.rangeElement.classList.add("tui-image-editor-range"),this.bar=document.createElement("div"),this.bar.className="tui-image-editor-virtual-range-bar",this.subbar=document.createElement("div"),this.subbar.className="tui-image-editor-virtual-range-subbar",this.pointer=document.createElement("div"),this.pointer.className="tui-image-editor-virtual-range-pointer",this.bar.appendChild(this.subbar),this.bar.appendChild(this.pointer),this.rangeElement.appendChild(this.bar)}},{key:"_addClickEvent",value:function(){var e=this;this.rangeElement.addEventListener("click",function(t){if(t.stopPropagation(),"tui-image-editor-range"===t.target.className){var n=t.offsetX,i=n/e.rangeWidth,o=e._absMax*i+e._min;e.pointer.style.left=i*e.rangeWidth+"px",e.subbar.style.right=(1-i)*e.rangeWidth+"px",e._value=o,e.fire("change",o)}})}},{key:"_addDragEvent",value:function(){var e=this;this.pointer.addEventListener("mousedown",function(t){e.firstPosition=t.screenX,e.firstLeft=(0,l.toInteger)(e.pointer.style.left)||0,e.dragEventHandler={changeAngle:e._changeAngle.bind(e),stopChangingAngle:e._stopChangingAngle.bind(e)},document.addEventListener("mousemove",e.dragEventHandler.changeAngle),document.addEventListener("mouseup",e.dragEventHandler.stopChangingAngle)})}},{key:"_changeAngle",value:function(e){var t=e.screenX,n=t-this.firstPosition,i=this.firstLeft+n;i=i>this.rangeWidth?this.rangeWidth:i,i=i<0?0:i,this.pointer.style.left=i+"px",this.subbar.style.right=this.rangeWidth-i+"px";var o=i/this.rangeWidth,r=this._absMax*o+this._min;this._value=r,this.realTimeEvent&&this.fire("change",r)}},{key:"_stopChangingAngle",value:function(){this.fire("change",this._value),document.removeEventListener("mousemove",this.dragEventHandler.changeAngle),document.removeEventListener("mouseup",this.dragEventHandler.stopChangingAngle)}},{key:"max",set:function(e){this._max=e,this._absMax=this._min*-1+this._max,this.value=this._value},get:function(){return this._max}},{key:"value",get:function(){return this._value},set:function(e){var t=e-this._min,n=t*this.rangeWidth/this._absMax;this.rangeWidth0?i:n)(e)}},function(e,t,n){var i=n(122),o=n(25);e.exports=function(e){return i(o(e))}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(2),r=i(o),a=n(5),s=(0,a.keyMirror)("UN_IMPLEMENTATION","NO_COMPONENT_NAME"),l={UN_IMPLEMENTATION:"Should implement a method: ",NO_COMPONENT_NAME:"Should set a component name"},c={UN_IMPLEMENTATION:function(e){return l.UN_IMPLEMENTATION+e},NO_COMPONENT_NAME:function(){return l.NO_COMPONENT_NAME}};e.exports={types:r.default.extend({},s),create:function(e){e=e.toLowerCase();for(var t=c[e],n=arguments.length,i=Array(n>1?n-1:0),o=1;on;)t.push(arguments[n++]);return v[++g]=function(){s("function"==typeof e?e:Function(e),t)},i(g),g},f=function(e){delete v[e]},"process"==n(19)(d)?i=function(e){d.nextTick(a(b,e,1))}:p?(o=new p,r=o.port2,o.port1.onmessage=y,i=a(r.postMessage,r,1)):u.addEventListener&&"function"==typeof postMessage&&!u.importScripts?(i=function(e){u.postMessage(e+"","*")},u.addEventListener("message",y,!1)):i=m in c("script")?function(e){l.appendChild(c("script"))[m]=function(){l.removeChild(this),b.call(e)}}:function(e){setTimeout(a(b,e,1),0)}),e.exports={set:h,clear:f}},function(e,t,n){var i=n(29),o=Math.min;e.exports=function(e){return e>0?o(i(e),9007199254740991):0}},function(e,t){var n=0,i=Math.random();e.exports=function(e){return"Symbol(".concat(void 0===e?"":e,")_",(++n+i).toString(36))}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0});var o=n(2),r=n(5),a=i(r),s=n(86),l=i(s);t.default={getActions:function(){return{main:this._mainAction(),shape:this._shapeAction(),crop:this._cropAction(),flip:this._flipAction(),rotate:this._rotateAction(),text:this._textAction(),mask:this._maskAction(),draw:this._drawAction(),icon:this._iconAction(),filter:this._filterAction()}},_mainAction:function(){var e=this,t=function(){"crop"===e.ui.submenu&&(e.stopDrawingMode(),e.ui.changeMenu("crop"))};return(0,o.extend)({initLoadImage:function(n,i){return e.loadImageFromURL(n,i).then(function(i){t(),e.ui.initializeImgUrl=n,e.ui.resizeEditor({imageSize:i}),e.clearUndoStack()})},undo:function(){e.isEmptyUndoStack()||(t(),e.undo())},redo:function(){e.isEmptyRedoStack()||(t(),e.redo())},reset:function(){t(),e.loadImageFromURL(e.ui.initializeImgUrl,"resetImage").then(function(n){t(),e.ui.resizeEditor({imageSize:n}),e.clearUndoStack()})},delete:function(){e.ui.changeDeleteButtonEnabled(!1),t(),e.removeActiveObject(),e.activeObjectId=null},deleteAll:function(){t(),e.clearObjects(),e.ui.changeDeleteButtonEnabled(!1),e.ui.changeDeleteAllButtonEnabled(!1)},load:function(n){a.default.isSupportFileApi()||alert("This browser does not support file-api"),e.ui.initializeImgUrl=URL.createObjectURL(n),e.loadImageFromFile(n).then(function(n){t(),e.clearUndoStack(),e.ui.activeMenuEvent(),e.ui.resizeEditor({imageSize:n})}).catch(function(e){return Promise.reject(e)})},download:function(){var t=e.toDataURL(),n=e.getImageName(),i=void 0,o=void 0,r=void 0;a.default.isSupportFileApi()&&window.saveAs?(i=a.default.base64ToBlob(t),o=i.type.split("/")[1],n.split(".").pop()!==o&&(n+="."+o),saveAs(i,n)):(r=window.open(),r.document.body.innerHTML="")}},this._commonAction())},_iconAction:function(){var e=this,t=void 0,n=void 0,i=void 0,r=void 0,a=void 0,s=void 0,c=void 0;this.on({iconCreateResize:function(t){var n=t.moveOriginPointer,o=(n.x-i)/a,l=(n.y-r)/s;e.setObjectPropertiesQuietly(c,{scaleX:Math.abs(2*o),scaleY:Math.abs(2*l)})},iconCreateEnd:function(){e.ui.icon.clearIconType(),e.changeSelectableAll(!0)}});var u=function(o,l){i=l.x,r=l.y,e.addIcon(t,{left:l.x,top:l.y,fill:n}).then(function(e){c=e.id,a=e.width,s=e.height})};return(0,o.extend)({changeColor:function(t){e.activeObjectId&&e.changeIconColor(e.activeObjectId,t)},addIcon:function(i,o){t=i,n=o,e.changeCursor("crosshair"),e.off("mousedown"),e.once("mousedown",u.bind(e))},cancelAddIcon:function(){e.off("mousedown"),e.ui.icon.clearIconType(),e.changeSelectableAll(!0),e.changeCursor("default")},registDefalutIcons:function(t,n){var i={};i[t]=n,e.registerIcons(i)},registCustomIcon:function(t,n){var i=new l.default;i.imageToSVG(t,function(t){var i=t.match(/path[^>]*d="([^"]*)"/),o=i[1],r={};r[n.name]=o,e.registerIcons(r),e.addIcon(n.name,{left:100,top:100})},l.default.tracerDefaultOption())}},this._commonAction())},_drawAction:function(){var e=this;return(0,o.extend)({setDrawMode:function(t,n){e.stopDrawingMode(),"free"===t?e.startDrawingMode("FREE_DRAWING",n):e.startDrawingMode("LINE_DRAWING",n)},setColor:function(t){e.setBrush({color:t})}},this._commonAction())},_maskAction:function(){var e=this;return(0,o.extend)({loadImageFromURL:function(t,n){return e.loadImageFromURL(e.toDataURL(),"FilterImage").then(function(){e.addImageObject(t).then(function(){URL.revokeObjectURL(n)})})},applyFilter:function(){e.applyFilter("mask",{maskObjId:e.activeObjectId})}},this._commonAction())},_textAction:function(){var e=this;return(0,o.extend)({changeTextStyle:function(t){e.activeObjectId&&e.changeTextStyle(e.activeObjectId,t)}},this._commonAction())},_rotateAction:function(){var e=this;return(0,o.extend)({rotate:function(t){e.rotate(t),e.ui.resizeEditor()},setAngle:function(t){e.setAngle(t),e.ui.resizeEditor()}},this._commonAction())},_shapeAction:function(){var e=this;return(0,o.extend)({changeShape:function(t){e.activeObjectId&&e.changeShape(e.activeObjectId,t)},setDrawingShape:function(t){e.setDrawingShape(t)}},this._commonAction())},_cropAction:function(){var e=this;return(0,o.extend)({crop:function(){var t=e.getCropzoneRect();t&&e.crop(t).then(function(){e.stopDrawingMode(),e.ui.resizeEditor(),e.ui.changeMenu("crop")}).catch(function(e){return Promise.reject(e)})},cancel:function(){e.stopDrawingMode(),e.ui.changeMenu("crop")},preset:function(t){switch(t){case"preset-square":e.setCropzoneRect(1);break;case"preset-3-2":e.setCropzoneRect(1.5);break;case"preset-4-3":e.setCropzoneRect(4/3);break;case"preset-5-4":e.setCropzoneRect(5/4);break;case"preset-7-5":e.setCropzoneRect(1.4);break;case"preset-16-9":e.setCropzoneRect(16/9);break;default:e.setCropzoneRect(),e.ui.crop.changeApplyButtonStatus(!1)}}},this._commonAction())},_flipAction:function(){var e=this;return(0,o.extend)({flip:function(t){return e[t]()}},this._commonAction())},_filterAction:function(){var e=this;return(0,o.extend)({applyFilter:function(t,n,i){t?e.applyFilter(n,i):e.hasFilter(n)&&e.removeFilter(n)}},this._commonAction())},setReAction:function(){var e=this;this.on({undoStackChanged:function(t){t?(e.ui.changeUndoButtonStatus(!0),e.ui.changeResetButtonStatus(!0)):(e.ui.changeUndoButtonStatus(!1),e.ui.changeResetButtonStatus(!1)),e.ui.resizeEditor()},redoStackChanged:function(t){t?e.ui.changeRedoButtonStatus(!0):e.ui.changeRedoButtonStatus(!1),e.ui.resizeEditor()},objectActivated:function(t){e.activeObjectId=t.id,e.ui.changeDeleteButtonEnabled(!0),e.ui.changeDeleteAllButtonEnabled(!0),"cropzone"===t.type?e.ui.crop.changeApplyButtonStatus(!0):["rect","circle","triangle"].indexOf(t.type)>-1?(e.stopDrawingMode(),"shape"!==e.ui.submenu&&e.ui.changeMenu("shape",!1,!1),e.ui.shape.setShapeStatus({strokeColor:t.stroke,strokeWidth:t.strokeWidth,fillColor:t.fill}),e.ui.shape.setMaxStrokeValue(Math.min(t.width,t.height))):"path"===t.type||"line"===t.type?"draw"!==e.ui.submenu&&(e.ui.changeMenu("draw",!1,!1),e.ui.draw.changeStandbyMode()):["i-text","text"].indexOf(t.type)>-1?"text"!==e.ui.submenu&&e.ui.changeMenu("text",!1,!1):"icon"===t.type&&(e.stopDrawingMode(),"icon"!==e.ui.submenu&&e.ui.changeMenu("icon",!1,!1),e.ui.icon.setIconPickerColor(t.fill))},addText:function(t){e.addText("Double Click",{position:t.originPosition,styles:{fill:e.ui.text.textColor,fontSize:a.default.toInteger(e.ui.text.fontSize),fontFamily:"Noto Sans"}}).then(function(){e.changeCursor("default")})},addObjectAfter:function(t){["rect","circle","triangle"].indexOf(t.type)>-1&&(e.ui.shape.setMaxStrokeValue(Math.min(t.width,t.height)),e.ui.shape.changeStandbyMode())},objectScaled:function(t){if(["i-text","text"].indexOf(t.type)>-1)e.ui.text.fontSize=a.default.toInteger(t.fontSize);else if(["rect","circle","triangle"].indexOf(t.type)>=0){var n=t.width,i=t.height,o=e.ui.shape.getStrokeValue();nb&&(r.remove(),r.set(this._calcRectDimensionFromPoint(i,o)),t.add(r))}},{key:"_calcRectDimensionFromPoint",value:function(e,t){var n=this.getCanvas(),i=n.getWidth(),o=n.getHeight(),r=this._startX,a=this._startY,s=(0,m.clamp)(e,0,r),l=(0,m.clamp)(t,0,a),c=(0,m.clamp)(e,r,i)-s,u=(0,m.clamp)(t,a,o)-l;return this._withShiftKey&&(c>u?u=c:u>c&&(c=u),r>=e&&(s=r-c),a>=t&&(l=a-u)),{left:s,top:l,width:c,height:u}}},{key:"_onFabricMouseUp",value:function(){var e=this._cropzone,t=this._listeners,n=this.getCanvas();n.setActiveObject(e),n.off({"mouse:move":t.mousemove,"mouse:up":t.mouseup})}},{key:"getCroppedImageData",value:function(e){var t=this.getCanvas(),n=t.contains(this._cropzone);if(!e)return null;n&&this._cropzone.remove();var i={imageName:this.getImageName(),url:t.toDataURL(e)};return n&&t.add(this._cropzone),i}},{key:"getCropzoneRect",value:function(){var e=this._cropzone;return e.isValid()?{left:e.getLeft(),top:e.getTop(),width:e.getWidth(),height:e.getHeight()}:null}},{key:"setCropzoneRect",value:function(e){var t=this.getCanvas(),n=this._cropzone;t.deactivateAll(),t.selection=!1,n.remove(),n.set(e?this._getPresetCropSizePosition(e):y),t.add(n),t.selection=!0,e&&t.setActiveObject(n)}},{key:"_getPresetCropSizePosition",value:function(e){var t=this.getCanvas(),n=t.getWidth(),i=t.getHeight(),o=n>=i?n:i,r=function(e,t){return e>t?t/e:1},a=o*e,s=o,l=r(a,n),u=c.default.map([a,s],function(e){return e*l});a=u[0],s=u[1];var d=r(s,i),h=c.default.map([a,s],function(e){return e*d});return a=h[0],s=h[1],{top:(i-s)/2,left:(n-a)/2,width:a,height:s}}},{key:"_onKeyDown",value:function(e){e.keyCode===v.keyCodes.SHIFT&&(this._withShiftKey=!0)}},{key:"_onKeyUp",value:function(e){e.keyCode===v.keyCodes.SHIFT&&(this._withShiftKey=!1)}}]),t}(f.default);e.exports=_},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;n=0,c=n.useDragAddIcon&&l,u=a?n._createIcon(a):null;u||o(y.invalidParameters),u.set(d.default.extend({type:"icon",fill:n._oColor},s,t,n.graphics.controlStyle)),r.add(u).setActiveObject(u),c&&n._addWithDragEvent(r),i(n.graphics.createObjectProperties(u))})}},{key:"_addWithDragEvent",value:function(e){var t=this;e.on({"mouse:move":function(n){e.selection=!1,t.fire(b.ICON_CREATE_RESIZE,{moveOriginPointer:e.getPointer(n.e)})},"mouse:up":function(n){t.fire(b.ICON_CREATE_END,{moveOriginPointer:e.getPointer(n.e)}),e.defaultCursor="default",e.off("mouse:up"),e.off("mouse:move"),e.selection=!0}})}},{key:"registerPaths",value:function(e){var t=this;d.default.forEach(e,function(e,n){t._pathMap[n]=e},this)}},{key:"setColor",value:function(e,t){this._oColor=e,t&&"icon"===t.get("type")&&(t.setFill(this._oColor),this.getCanvas().renderAll())}},{key:"getColor",value:function(e){return e.fill}},{key:"_createIcon",value:function(e){return new c.default.Path(e)}}]),t}(g.default);e.exports=k},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;nn},_getColor:function(e,t,n){var i=[0,0,0,0],o=e.data,r=e.width,a=4,s=(r*n+t)*a;return i[0]=o[s],i[1]=o[s+1],i[2]=o[s+2],i[3]=o[s+3],i}});e.exports=a},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(2),r=i(o),a=n(6),s=i(a),l=n(5),c="tl",u="tr",d="mt",h="ml",f="mr",p="mb",g="bl",v="br",m=s.default.util.createClass(s.default.Rect,{initialize:function(e,t){e=r.default.extend(e,t),e.type="cropzone",this.callSuper("initialize",e),this.options=e,this.on({moving:this._onMoving,scaling:this._onScaling})},_render:function(e){var t=7,n=7;this.callSuper("_render",e);var i=this.flipX?-1:1,o=this.flipY?-1:1,r=i/this.scaleX,a=o/this.scaleY;e.scale(r,a),this._fillOuterRect(e,"rgba(0, 0, 0, 0.55)"),this.options.lineWidth?(this._fillInnerRect(e),this._strokeBorder(e,"rgb(255, 255, 255)",{lineWidth:this.options.lineWidth})):(this._strokeBorder(e,"rgb(0, 0, 0)",{lineDashWidth:t}),this._strokeBorder(e,"rgb(255, 255, 255)",{lineDashWidth:t,lineDashOffset:n})),e.scale(1/r,1/a)},_fillOuterRect:function(e,t){var n=this._getCoordinates(e),i=n.x,o=n.y;e.save(),e.fillStyle=t,e.beginPath(),e.moveTo(i[0]-1,o[0]-1),e.lineTo(i[3]+1,o[0]-1),e.lineTo(i[3]+1,o[3]+1),e.lineTo(i[0]-1,o[3]+1),e.lineTo(i[0]-1,o[0]-1),e.closePath(),e.moveTo(i[1],o[1]),e.lineTo(i[1],o[2]),e.lineTo(i[2],o[2]),e.lineTo(i[2],o[1]),e.lineTo(i[1],o[1]),e.closePath(),e.fill(),e.restore()},_fillInnerRect:function(e){var t=this._getCoordinates(e),n=t.x,i=t.y,o=this._caculateInnerPosition(n,(n[2]-n[1])/3),r=this._caculateInnerPosition(i,(i[2]-i[1])/3);e.save(),e.strokeStyle="rgba(255, 255, 255, 0.7)",e.lineWidth=this.options.lineWidth,e.beginPath(),e.moveTo(o[0],r[1]),e.lineTo(o[3],r[1]),e.moveTo(o[0],r[2]),e.lineTo(o[3],r[2]),e.moveTo(o[1],r[0]),e.lineTo(o[1],r[3]),e.moveTo(o[2],r[0]),e.lineTo(o[2],r[3]),e.stroke(),e.closePath(),e.restore()},_caculateInnerPosition:function(e,t){var n=[];return n[0]=e[1],n[1]=e[1]+t,n[2]=e[1]+2*t,n[3]=e[2],n},_getCoordinates:function(e){var t=this.getWidth(),n=this.getHeight(),i=t/2,o=n/2,a=this.getLeft(),s=this.getTop(),l=e.canvas;return{x:r.default.map([-(i+a),-i,i,i+(l.width-a-t)],Math.ceil),y:r.default.map([-(o+s),-o,o,o+(l.height-s-n)],Math.ceil)}},_strokeBorder:function(e,t,n){var i=n.lineDashWidth,o=n.lineDashOffset,r=n.lineWidth,a=this.getWidth()/2,s=this.getHeight()/2;e.save(),e.strokeStyle=t,e.setLineDash&&e.setLineDash([i,i]),o&&(e.lineDashOffset=o),r&&(e.lineWidth=r),e.beginPath(),e.moveTo(-a,-s),e.lineTo(a,-s),e.lineTo(a,s),e.lineTo(-a,s),e.lineTo(-a,-s),e.stroke(),e.restore()},_onMoving:function(){var e=this.getLeft(),t=this.getTop(),n=this.getWidth(),i=this.getHeight(),o=this.canvas.getWidth()-n,r=this.canvas.getHeight()-i;this.setLeft((0,l.clamp)(e,0,o)),this.setTop((0,l.clamp)(t,0,r))},_onScaling:function(e){var t=this.canvas.getPointer(e.e),n=this._calcScalingSizeFromPointer(t);this.scale(1).set(n)},_calcScalingSizeFromPointer:function(e){var t=e.x,n=e.y,i=this._calcTopLeftScalingSizeFromPointer(t,n),o=this._calcBottomRightScalingSizeFromPointer(t,n);return this._makeScalingSettings(i,o)},_calcTopLeftScalingSizeFromPointer:function(e,t){var n=this.getHeight()+this.top,i=this.getWidth()+this.left,o=(0,l.clamp)(t,0,n-1),r=(0,l.clamp)(e,0,i-1);return{top:o,left:r,width:i-r,height:n-o}},_calcBottomRightScalingSizeFromPointer:function(e,t){var n=this.canvas,i=n.width,o=n.height,r=this.left,a=this.top;return{width:(0,l.clamp)(e,r+1,i)-r,height:(0,l.clamp)(t,a+1,o)-a}},_makeScalingSettings:function(e,t){var n=e.width,i=e.height,o=t.height,r=t.width,a=e.left,s=e.top,l=void 0;switch(this.__corner){case c:l=e;break;case u:l={width:r,height:i,top:s};break;case g:l={width:n,height:o,left:a};break;case v:l=t;break;case h:l={width:n,left:a};break;case d:l={height:i,top:s};break;case f:l={width:r};break;case p:l={height:o}}return l},isValid:function(){return this.left>=0&&this.top>=0&&this.width>0&&this.height>0}});e.exports=m},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(6),r=i(o),a=r.default.util.createClass(r.default.Image.filters.Convolute,{type:"Emboss",initialize:function(){var e=[1,1,1,1,.7,-1,-1,-1,-1];this.matrix=e}});e.exports=a},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(6),r=i(o),a=r.default.util.createClass(r.default.Image.filters.Mask,{applyTo:function(e){if(this.mask){var t=e.width,n=e.height,i=this._createCanvasOfMask(t,n),o=e.getContext("2d"),r=i.getContext("2d"),a=o.getImageData(0,0,t,n);this._drawMask(r,e,o),this._mapData(r,a,t,n),o.putImageData(a,0,0)}},_createCanvasOfMask:function(e,t){var n=r.default.util.createCanvasElement();return n.width=e,n.height=t,n},_drawMask:function(e){var t=this.mask,n=t.getElement(),i=t.getLeft(),o=t.getTop(),r=t.getAngle();e.save(),e.translate(i,o),e.rotate(r*Math.PI/180),e.scale(t.scaleX,t.scaleY),e.drawImage(n,-n.width/2,-n.height/2),e.restore()},_mapData:function(e,t,n,i){for(var o=t.data,r=e.getImageData(0,0,n,i).data,a=this.channel,s=t.width*t.height*4,l=0;l1&&void 0!==arguments[1]?arguments[1]:{},i=n.cssMaxWidth,r=n.cssMaxHeight,a=n.useItext,s=void 0!==a&&a,l=n.useDragAddIcon,c=void 0!==l&&l;o(this,e),this.canvasImage=null,this.cssMaxWidth=i||ie,this.cssMaxHeight=r||oe,this.useItext=s,this.useDragAddIcon=c,this.cropSelectionStyle={},this.imageName="",this._objects={},this._canvas=null,this._drawingMode=q.NORMAL,this._drawingModeMap={},this._componentMap={},this._handler={onMouseDown:this._onMouseDown.bind(this),onObjectAdded:this._onObjectAdded.bind(this),onObjectRemoved:this._onObjectRemoved.bind(this),onObjectMoved:this._onObjectMoved.bind(this),onObjectScaled:this._onObjectScaled.bind(this),onObjectSelected:this._onObjectSelected.bind(this),onPathCreated:this._onPathCreated.bind(this),onSelectionCleared:this._onSelectionCleared.bind(this),onSelectionCreated:this._onSelectionCreated.bind(this)},this._setCanvasElement(t),this._createDrawingModeInstances(),this._createComponents(),this._attachCanvasEvents()}return r(e,[{key:"destroy",value:function(){var e=this._canvas.wrapperEl;this._canvas.clear(),e.parentNode.removeChild(e)}},{key:"deactivateAll",value:function(){return this._canvas.deactivateAll(),this}},{key:"renderAll",value:function(){return this._canvas.renderAll(),this}},{key:"add",value:function(e){var t,n=[];$(e)?n=e:n.push(e),(t=this._canvas).add.apply(t,n)}},{key:"contains",value:function(e){return this._canvas.contains(e)}},{key:"getObjects",value:function(){return this._canvas.getObjects().slice()}},{key:"getObject",value:function(e){return this._objects[e]}},{key:"remove",value:function(e){this._canvas.remove(e)}},{key:"removeAll",value:function(e){var t=this._canvas,n=t.getObjects().slice();return t.remove.apply(t,this._canvas.getObjects()),e&&t.clear(),n}},{key:"removeObjectById",value:function(e){var t=[],n=this._canvas,i=this.getObject(e),o=i&&i.isType("group")&&!i.isEmpty();return o?(n.discardActiveGroup(),i.forEachObject(function(e){t.push(e),e.remove()})):n.contains(i)&&(t.push(i),i.remove()),t}},{key:"getObjectId",value:function(e){var t=null;for(t in this._objects)if(this._objects.hasOwnProperty(t)&&e===this._objects[t])return t;return null}},{key:"getActiveObject",value:function(){return this._canvas.getActiveObject()}},{key:"getActiveGroupObject",value:function(){return this._canvas.getActiveGroup()}},{key:"setActiveObject",value:function(e){this._canvas.setActiveObject(e)}},{key:"setCropSelectionStyle",value:function(e){this.cropSelectionStyle=e}},{key:"getComponent",value:function(e){return this._componentMap[e]}},{key:"getDrawingMode",value:function(){return this._drawingMode}},{key:"startDrawingMode",value:function(e,t){if(this._isSameDrawingMode(e))return!0;this.stopDrawingMode();var n=this._getDrawingModeInstance(e);return n&&n.start&&(n.start(this,t),this._drawingMode=e),!!n}},{key:"stopDrawingMode",value:function(){if(!this._isSameDrawingMode(q.NORMAL)){var e=this._getDrawingModeInstance(this.getDrawingMode());e&&e.end&&e.end(this),this._drawingMode=q.NORMAL}}},{key:"toDataURL",value:function(e){return this._canvas&&this._canvas.toDataURL(e)}},{key:"setCanvasImage",value:function(e,t){t&&Z(t),this.imageName=e,this.canvasImage=t}},{key:"setCssMaxDimension",value:function(e){this.cssMaxWidth=e.width||this.cssMaxWidth,this.cssMaxHeight=e.height||this.cssMaxHeight}},{key:"adjustCanvasDimension",value:function(){var e=this.canvasImage.scale(1),t=e.getBoundingRect(),n=t.width,i=t.height,o=this._calcMaxDimension(n,i);this.setCanvasCssDimension({width:"100%",height:"100%","max-width":o.width+"px","max-height":o.height+"px"}),this.setCanvasBackstoreDimension({width:n,height:i}),this._canvas.centerObject(e)}},{key:"setCanvasCssDimension",value:function(e){this._canvas.setDimensions(e,re)}},{key:"setCanvasBackstoreDimension",value:function(e){this._canvas.setDimensions(e,ae)}},{key:"setImageProperties",value:function(e,t){var n=this.canvasImage;n&&(n.set(e).setCoords(),t&&this._canvas.renderAll())}},{key:"getCanvasElement",value:function(){return this._canvas.getElement()}},{key:"getCanvas",value:function(){return this._canvas}},{key:"getCanvasImage",value:function(){return this.canvasImage}},{key:"getImageName",value:function(){return this.imageName}},{key:"addImageObject",value:function(e){var t=this,n=this._callbackAfterLoadingImageObject.bind(this);return new c.default(function(i){d.default.Image.fromURL(e,function(e){n(e),i(t.createObjectProperties(e))},{crossOrigin:"Anonymous"})})}},{key:"getCenter",value:function(){return this._canvas.getCenter()}},{key:"getCropzoneRect",value:function(){return this.getComponent(G.CROPPER).getCropzoneRect()}},{key:"setCropzoneRect",value:function(e){return this.getComponent(G.CROPPER).setCropzoneRect(e)}},{key:"getCroppedImageData",value:function(e){return this.getComponent(G.CROPPER).getCroppedImageData(e)}},{key:"setBrush",value:function(e){var t=this._drawingMode,n=G.FREE_DRAWING;t===q.LINE&&(n=q.LINE),this.getComponent(n).setBrush(e)}},{key:"setDrawingShape",value:function(e,t){this.getComponent(G.SHAPE).setStates(e,t)}},{key:"registerPaths",value:function(e){this.getComponent(G.ICON).registerPaths(e)}},{key:"changeCursor",value:function(e){var t=this.getCanvas();t.defaultCursor=e,t.renderAll()}},{key:"hasFilter",value:function(e){return this.getComponent(G.FILTER).hasFilter(e)}},{key:"setSelectionStyle",value:function(e){J(K.SELECTION_STYLE,e)}},{key:"setObjectProperties",value:function(e,t){var n=this.getObject(e),i=J({},t);return n.set(i),n.setCoords(),this.getCanvas().renderAll(),i}},{key:"getObjectProperties",value:function(e,t){var n=this.getObject(e),i={};return Q(t)?i[t]=n[t]:$(t)?ee(t,function(e){i[e]=n[e]}):te(t,function(e,t){i[t]=n[t]}),i}},{key:"getObjectPosition",value:function(e,t,n){var i=this.getObject(e);return i?i.getPointByOrigin(t,n):null}},{key:"setObjectPosition",value:function(e,t){var n=this.getObject(e),i=t.x,o=t.y,r=t.originX,a=t.originY;if(!n)return!1;var s=n.getPointByOrigin(r,a),l=n.getPointByOrigin("center","center"),c=l.x-s.x,u=l.y-s.y;return n.set({left:i+c,top:o+u}),n.setCoords(),!0}},{key:"getCanvasSize",value:function(){var e=this.getCanvasImage();return{width:e?e.width:0,height:e?e.height:0}}},{key:"_getDrawingModeInstance",value:function(e){return this._drawingModeMap[e]}},{key:"_setCanvasElement",value:function(e){var t=void 0,n=void 0;t=e.jquery?e[0]:e.nodeType?e:document.querySelector(e),"CANVAS"!==t.nodeName.toUpperCase()&&(n=document.createElement("canvas"),t.appendChild(n)),this._canvas=new d.default.Canvas(n,{containerClass:"tui-image-editor-canvas-container",enableRetinaScaling:!1})}},{key:"_createDrawingModeInstances", +value:function(){this._register(this._drawingModeMap,new D.default),this._register(this._drawingModeMap,new R.default),this._register(this._drawingModeMap,new B.default),this._register(this._drawingModeMap,new F.default),this._register(this._drawingModeMap,new z.default)}},{key:"_createComponents",value:function(){this._register(this._componentMap,new f.default(this)),this._register(this._componentMap,new g.default(this)),this._register(this._componentMap,new m.default(this)),this._register(this._componentMap,new y.default(this)),this._register(this._componentMap,new k.default(this)),this._register(this._componentMap,new x.default(this)),this._register(this._componentMap,new C.default(this)),this._register(this._componentMap,new O.default(this)),this._register(this._componentMap,new j.default(this)),this._register(this._componentMap,new P.default(this))}},{key:"_register",value:function(e,t){e[t.getName()]=t}},{key:"_isSameDrawingMode",value:function(e){return this.getDrawingMode()===e}},{key:"_calcMaxDimension",value:function(e,t){var n=this.cssMaxWidth/e,i=this.cssMaxHeight/t,o=Math.min(e,this.cssMaxWidth),r=Math.min(t,this.cssMaxHeight);return n<1&&n-1&&J(n,this._createTextProperties(e,n)),n}},{key:"_createTextProperties",value:function(e){var t=["text","fontFamily","fontSize","fontStyle","textAlign","textDecoration"],n={};return J(n,X.default.getProperties(e,t)),n}},{key:"_addFabricObject",value:function(e){var t=Z(e);return this._objects[t]=e,t}},{key:"_removeFabricObject",value:function(e){delete this._objects[e]}}]),e}();ne.mixin(se),e.exports=se},function(e,t){"use strict";function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n0&&(e=this.blur(e,t.blurradius,t.blurdelta)),h=0;h0)for(d=0;d0&&(f[d]={r:Math.floor(s[d].r/s[d].n),g:Math.floor(s[d].g/s[d].n),b:Math.floor(s[d].b/s[d].n),a:Math.floor(s[d].a/s[d].n)}),s[d].n/ln[i].boundingbox[2]&&(n[i].boundingbox[2]=r-1),a-1n[i].boundingbox[3]&&(n[i].boundingbox[3]=a-1),h=this.pathscan_combined_lookup[e[a][r]][c],e[a][r]=h[0],c=h[1],r+=h[2],a+=h[3],r-1===n[i].points[0].x&&a-1===n[i].points[0].y)if(u=!0,n[i].points.lengtht[2]&&e[3]>t[3]}},{key:"batchpathscan",value:function(e,t){var n=[];for(var i in e)e.hasOwnProperty(i)&&(n[i]=this.pathscan(e[i],t));return n}},{key:"internodes",value:function(e,t){var n=[],i=0,o=0,r=0,a=0,s=0,l=void 0,c=void 0;for(l=0;l0&&(n[l].points[n[l].points.length-1].linesegment=this.getdirection(n[l].points[n[l].points.length-1].x,n[l].points[n[l].points.length-1].y,e[l].points[c].x,e[l].points[c].y)),n[l].points.push({x:e[l].points[c].x,y:e[l].points[c].y,linesegment:this.getdirection(e[l].points[c].x,e[l].points[c].y,(e[l].points[c].x+e[l].points[o].x)/2,(e[l].points[c].y+e[l].points[o].y)/2)})),n[l].points.push({x:(e[l].points[c].x+e[l].points[o].x)/2,y:(e[l].points[c].y+e[l].points[o].y)/2,linesegment:this.getdirection((e[l].points[c].x+e[l].points[o].x)/2,(e[l].points[c].y+e[l].points[o].y)/2,(e[l].points[o].x+e[l].points[r].x)/2,(e[l].points[o].y+e[l].points[r].y)/2)});return n}},{key:"testrightangle",value:function(e,t,n,i,o,r){return e.points[i].x===e.points[t].x&&e.points[i].x===e.points[n].x&&e.points[i].y===e.points[o].y&&e.points[i].y===e.points[r].y||e.points[i].y===e.points[t].y&&e.points[i].y===e.points[n].y&&e.points[i].x===e.points[o].x&&e.points[i].x===e.points[r].x}},{key:"getdirection",value:function(e,t,n,i){var o=8;return o=ei?7:0:e>n?ti?5:4:ti?6:8}},{key:"batchinternodes",value:function(e,t){var n=[];for(var i in e)e.hasOwnProperty(i)&&(n[i]=this.internodes(e[i],t));return n}},{key:"tracepath",value:function(e,t,n){var i=0,o=void 0,r=void 0,a=void 0,s={};for(s.segments=[],s.boundingbox=e.boundingbox,s.holechildren=e.holechildren,s.isholepath=e.isholepath;i0?a:e.points.length}return s}},{key:"fitseq",value:function(e,t,n,i,o){if(o>e.points.length||o<0)return[];var r=i,a=0,s=!0,l=void 0,c=void 0,u=void 0,d=o-i;d<0&&(d+=e.points.length);for(var h=(e.points[o].x-e.points[i].x)/d,f=(e.points[o].y-e.points[i].y)/d,p=(i+1)%e.points.length,g=void 0;p!=o;)g=p-i,g<0&&(g+=e.points.length),l=e.points[i].x+h*g,c=e.points[i].y+f*g,u=(e.points[p].x-l)*(e.points[p].x-l)+(e.points[p].y-c)*(e.points[p].y-c),u>t&&(s=!1),u>a&&(r=p,a=u),p=(p+1)%e.points.length;if(s)return[{type:"L",x1:e.points[i].x,y1:e.points[i].y,x2:e.points[o].x,y2:e.points[o].y}];var v=r;s=!0,a=0;var m=(v-i)/d,b=(1-m)*(1-m),y=2*(1-m)*m,_=m*m,k=(b*e.points[i].x+_*e.points[o].x-e.points[v].x)/-y,w=(b*e.points[i].y+_*e.points[o].y-e.points[v].y)/-y;for(p=i+1;p!=o;)m=(p-i)/d,b=(1-m)*(1-m),y=2*(1-m)*m,_=m*m,l=b*e.points[i].x+y*k+_*e.points[o].x,c=b*e.points[i].y+y*w+_*e.points[o].y,u=(e.points[p].x-l)*(e.points[p].x-l)+(e.points[p].y-c)*(e.points[p].y-c),u>n&&(s=!1),u>a&&(r=p,a=u),p=(p+1)%e.points.length;if(s)return[{type:"Q",x1:e.points[i].x,y1:e.points[i].y,x2:k,y2:w,x3:e.points[o].x,y3:e.points[o].y}];var x=v;return this.fitseq(e,t,n,i,x).concat(this.fitseq(e,t,n,x,o))}},{key:"batchtracepaths",value:function(e,t,n){var i=[];for(var o in e)e.hasOwnProperty(o)&&i.push(this.tracepath(e[o],t,n));return i}},{key:"batchtracelayers",value:function(e,t,n){var i=[];for(var o in e)e.hasOwnProperty(o)&&(i[o]=this.batchtracepaths(e[o],t,n));return i}},{key:"roundtodec",value:function(e,t){return Number(e.toFixed(t))}},{key:"svgpathstring",value:function(e,t,n,i){var o=e.layers[t],r=o[n],a="",s=void 0;if(i.linefilter&&r.segments.length<3)return a;if(a="=0;s--)a+=c.segments[s].type+" ",c.segments[s].hasOwnProperty("x3")&&(a+=c.segments[s].x2*i.scale+" "+c.segments[s].y2*i.scale+" "),a+=c.segments[s].x1*i.scale+" "+c.segments[s].y1*i.scale+" ";else for(a+=c.segments[c.segments.length-1].hasOwnProperty("x3")?"M "+this.roundtodec(c.segments[c.segments.length-1].x3*i.scale)+" "+this.roundtodec(c.segments[c.segments.length-1].y3*i.scale)+" ":"M "+this.roundtodec(c.segments[c.segments.length-1].x2*i.scale)+" "+this.roundtodec(c.segments[c.segments.length-1].y2*i.scale)+" ",s=c.segments.length-1;s>=0;s--)a+=c.segments[s].type+" ",c.segments[s].hasOwnProperty("x3")&&(a+=this.roundtodec(c.segments[s].x2*i.scale)+" "+this.roundtodec(c.segments[s].y2*i.scale)+" "),a+=this.roundtodec(c.segments[s].x1*i.scale)+" "+this.roundtodec(c.segments[s].y1*i.scale)+" ";a+="Z "}if(a+='" />',i.lcpr||i.qcpr){for(s=0;s',a+='',a+='',a+=''),!r.segments[s].hasOwnProperty("x3")&&i.lcpr&&(a+='');for(var l=0;l',a+='',a+='',a+=''),!c.segments[s].hasOwnProperty("x3")&&i.lcpr&&(a+='')}}return a}},{key:"getsvgstring",value:function(e,t){t=this.checkoptions(t);for(var n=e.width*t.scale,i=e.height*t.scale,o="',r=0;r5&&(t=5),n=Math.abs(n),n>1024&&(n=1024);var p=this.gks[t-1];for(o=0;o0&&i+r0&&o+rn&&(f.data[s]=e.data[s],f.data[s+1]=e.data[s+1],f.data[s+2]=e.data[s+2],f.data[s+3]=e.data[s+3]);return f}},{key:"loadImage",value:function(e,t,n){var i=new Image;n&&n.corsenabled&&(i.crossOrigin="Anonymous"),i.src=e,i.onload=function(){var e=document.createElement("canvas");e.width=i.width,e.height=i.height;var n=e.getContext("2d");n.drawImage(i,0,0),t(e)}}},{key:"getImgdata",value:function(e){var t=e.getContext("2d");return t.getImageData(0,0,e.width,e.height)}},{key:"drawLayers",value:function(e,t,n,i){n=n||1;var o=void 0,r=void 0,a=void 0,s=void 0,l=void 0,c=void 0;i?(c=document.getElementById(i),c||(c=document.createElement("div"),c.id=i,document.body.appendChild(c))):(c=document.createElement("div"),document.body.appendChild(c));for(l in e)if(e.hasOwnProperty(l)){o=e[l][0].length,r=e[l].length;var u=document.createElement("canvas");u.width=o*n,u.height=r*n;var d=u.getContext("2d");for(s=0;sl?"right":"left",originY:o>c?"bottom":"top"}}function o(e){return"center"===e.getOriginX()&&"center"===e.getOriginY()}function r(e,t){var n=t.getPointByOrigin("center","center"),o=-t.getAngle(),r=i(n,e,o),a=r.originX,s=r.originY,l=t.getPointByOrigin(a,s),c=t.getLeft()-(n.x-l.x),u=t.getTop()-(n.x-l.y);t.set({originX:a,originY:s,left:c,top:u}),t.setCoords()}function a(e,t){var n=t.startPoint,o=-t.getAngle(),r=i(n,e,o),a=r.originX,s=r.originY;t.setPositionByOrigin(n,a,s)}function s(e){var t=e.type,n=e.scaleX,i=e.scaleY,o=u[t],r=e[o.w]*n,a=e[o.h]*i;if(e.isRegular){var s=Math.max(n,i);r=e[o.w]*s,a=e[o.h]*s}var l={hasControls:!1,hasBorders:!1,scaleX:1,scaleY:1};l[o.w]=r,l[o.h]=a,e.set(l)}function l(e,t){var n=t.type,i=t.strokeWidth,o=t.startPoint,r=c[n],a=u[n],s=!("triangle"!==t.type),l={},d=Math.abs(o.x-e.x)/r,h=Math.abs(o.y-e.y)/r;d>i&&(d-=i/r),h>i&&(h-=i/r),t.isRegular&&(d=h=Math.max(d,h),s&&(h=Math.sqrt(3)/2*d)),l[a.w]=d,l[a.h]=h,t.set(l)}var c={rect:1,circle:2,triangle:1},u={rect:{w:"width",h:"height"},circle:{w:"rx",h:"ry"},triangle:{w:"width",h:"height"}};e.exports={setOrigins:function(e){var t=e.getPointByOrigin("left","top"),n=e.getPointByOrigin("right","top"),i=e.getPointByOrigin("right","bottom"),o=e.getPointByOrigin("left","bottom");e.origins={lt:t,rt:n,rb:i,lb:o}},resize:function(e,t,i){o(e)&&(r(t,e),n(e)),i?s(e,t):l(t,e),a(t,e)},adjustOriginToCenter:function(e){var t=e.getPointByOrigin("center","center"),n=e.getOriginX(),i=e.getOriginY(),o=e.getPointByOrigin(n,i),r=e.getLeft()+(t.x-o.x),a=e.getTop()+(t.y-o.y);e.set({hasControls:!0,hasBorders:!0,originX:"center",originY:"center",left:r,top:a}),e.setCoords()}}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var r=function(){function e(e,t){for(var n=0;n1?n-1:0),o=1;o0&&void 0!==arguments[0]?arguments[0]:{},t=e.uiSize,n=e.imageSize,i=void 0===n?this.imageSize:n;i!==this.imageSize&&(this.imageSize=i),t&&this._setUiSize(t);var o=this._getEditorDimension(),r=o.width,a=o.height,s=this._editorElement.style,l=this.options.menuBarPosition;s.height=a+"px",s.width=r+"px",this._setEditorPosition(l),this._editorElementWrap.style.bottom="0px",this._editorElementWrap.style.top="0px",this._editorElementWrap.style.left="0px",this._editorElementWrap.style.width="100%";var c=this._selectedElement.classList;"top"===l&&this._selectedElement.offsetWidth0&&void 0!==arguments[0]?arguments[0]:this.options.uiSize,t=this._selectedElement.style;t.width=e.width,t.height=e.height}},{key:"_makeSubMenu",value:function(){var e=this;s.default.forEach(this.options.menu,function(t){var n=I[t.replace(/^[a-z]/,function(e){return e.toUpperCase()})];e._makeMenuElement(t),e._els[t]=e._menuElement.querySelector("#tie-btn-"+t),e[t]=new n(e._subMenuElement,{iconStyle:e.theme.getStyle("submenu.icon"),menuBarPosition:e.options.menuBarPosition})})}},{key:"_makeUiElement",value:function(e){var t=void 0;window.snippet=s.default,t=e.jquery?e[0]:e.nodeType?e:document.querySelector(e);var n=c.default.getSelector(t);t.classList.add("tui-image-editor-container"),t.innerHTML=(0,f.default)({biImage:this.theme.getStyle("common.bi"),iconStyle:this.theme.getStyle("menu.icon"),loadButtonStyle:this.theme.getStyle("loadButton"),downloadButtonStyle:this.theme.getStyle("downloadButton")})+(0,d.default)({biImage:this.theme.getStyle("common.bi"),commonStyle:this.theme.getStyle("common"),headerStyle:this.theme.getStyle("header"),loadButtonStyle:this.theme.getStyle("loadButton"),downloadButtonStyle:this.theme.getStyle("downloadButton"),submenuStyle:this.theme.getStyle("submenu")}),this._selectedElement=t,this._selectedElement.classList.add(this.options.menuBarPosition),this._mainElement=n(".tui-image-editor-main"),this._editorElementWrap=n(".tui-image-editor-wrap"),this._editorElement=n(".tui-image-editor"),this._menuElement=n(".tui-image-editor-menu"),this._subMenuElement=n(".tui-image-editor-submenu")}},{key:"_makeMenuElement",value:function(e){var t=document.createElement("li"),n=this.theme.getStyle("menu.icon"),i=n.normal,o=n.active,r=n.hover,a='\n \n \n \n \n \n ';t.id="tie-btn-"+e,t.className="tui-image-editor-item normal",t.title=e.replace(/^[a-z]/g,function(e){return e.toUpperCase()}),t.innerHTML=a,this._menuElement.appendChild(t)}},{key:"_addHelpActionEvent",value:function(e){var t=this;this._els[e].addEventListener("click",function(){t._actions.main[e]()})}},{key:"_addDownloadEvent",value:function(){var e=this;s.default.forEach(this._els.download,function(t){t.addEventListener("click",function(){e._actions.main.download()})})}},{key:"_addLoadEvent",value:function(){var e=this;s.default.forEach(this._els.load,function(t){t.addEventListener("change",function(t){e._actions.main.load(t.target.files[0])})})}},{key:"_addMenuEvent",value:function(e){var t=this;this._els[e].addEventListener("click",function(){t.changeMenu(e)})}},{key:"_addSubMenuEvent",value:function(e){this[e].addEvent(this._actions[e])}},{key:"getEditorArea",value:function(){return this._editorElement}},{key:"activeMenuEvent",value:function(){var e=this;this._initMenuEvent||(this._addHelpActionEvent("undo"),this._addHelpActionEvent("redo"),this._addHelpActionEvent("reset"),this._addHelpActionEvent("delete"),this._addHelpActionEvent("deleteAll"),this._addDownloadEvent(),s.default.forEach(this.options.menu,function(t){e._addMenuEvent(t),e._addSubMenuEvent(t)}),this._initMenu(),this._initMenuEvent=!0)}},{key:"initCanvas",value:function(){var e=this,t=this._getLoadImage();t.path&&this._actions.main.initLoadImage(t.path,t.name).then(function(){e.activeMenuEvent()}),this._addLoadEvent();var n=document.createElement("div");n.className="tui-image-editor-grid-visual";var i='\n \n \n \n
    ';n.innerHTML=i,this._editorContainerElement=this._editorElement.querySelector(".tui-image-editor-canvas-container"),this._editorContainerElement.appendChild(n)}},{key:"_getLoadImage",value:function(){return this.options.loadImage}},{key:"changeMenu",value:function(e){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],n=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];this._submenuChangeTransection||(this._submenuChangeTransection=!0,this._changeMenu(e,t,n),this._submenuChangeTransection=!1)}},{key:"_changeMenu",value:function(e,t,n){this.submenu&&(this._els[this.submenu].classList.remove("active"),this._mainElement.classList.remove("tui-image-editor-menu-"+this.submenu),n&&this._actions.main.discardSelection(),this._actions.main.changeSelectableAll(!0),this[this.submenu].changeStandbyMode()),this.submenu===e&&t?this.submenu=null:(this._els[e].classList.add("active"),this._mainElement.classList.add("tui-image-editor-menu-"+e),this.submenu=e,this[this.submenu].changeStartMode()),this.resizeEditor()}},{key:"_initMenu",value:function(){if(this.options.initMenu){var e=document.createEvent("MouseEvents");e.initEvent("click",!0,!1),this._els[this.options.initMenu].dispatchEvent(e),this.icon&&this.icon.registDefaultIcon()}}},{key:"_getEditorDimension",value:function(){var e=parseFloat(this._editorContainerElement.style.maxHeight),t=this.imageSize.newHeight>e?e:this.imageSize.newHeight,n=parseFloat(this._editorContainerElement.style.maxWidth),i=this.imageSize.newWidth>n?n:this.imageSize.newWidth;return{width:i,height:t}}},{key:"_setEditorPosition",value:function(e){var t=this._getEditorDimension(),n=t.width,i=t.height,o=this._editorElement.style,r=0,a=0;this.submenu&&("bottom"===e?r=i>this._editorElementWrap.scrollHeight-150?(i-this._editorElementWrap.scrollHeight)/2:-75:"top"===e?r=i>this._editorElementWrap.offsetHeight-150?75-(i-(this._editorElementWrap.offsetHeight-150))/2:75:"left"===e?a=n>this._editorElementWrap.offsetWidth-248?124-(n-(this._editorElementWrap.offsetWidth-248))/2:124:"right"===e&&(a=n>this._editorElementWrap.scrollWidth-248?(n-this._editorElementWrap.scrollWidth)/2:-124)),o.top=r+"px",o.left=a+"px"}}]),e}();t.default=L},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n\n \n
      \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    \n\n
    \n \n \n
    \n \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.biImage,n=e.commonStyle,i=e.headerStyle,o=e.loadButtonStyle,r=e.downloadButtonStyle,a=e.submenuStyle;return'\n
    \n
    \n \n
    \n \n \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.subMenuLabelActive,n=e.subMenuLabelNormal,i=e.subMenuRangeTitle,o=e.submenuPartitionVertical,r=e.submenuPartitionHorizontal,a=e.submenuCheckbox,s=e.submenuRangePointer,l=e.submenuRangeValue,c=e.submenuColorpickerTitle,u=e.submenuColorpickerButton,d=e.submenuRangeBar,h=e.submenuRangeSubbar,f=e.submenuDisabledRangePointer,p=e.submenuDisabledRangeBar,g=e.submenuDisabledRangeSubbar,v=e.submenuIconSize,m=e.menuIconSize,b=e.biSize;return'\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype="icon-bubble"] label,\n #tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype="icon-heart"] label,\n #tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype="icon-location"] label,\n #tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype="icon-polygon"] label,\n #tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype="icon-star"] label,\n #tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype="icon-arrow-3"] label,\n #tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype="icon-arrow-2"] label,\n #tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype="icon-arrow"] label,\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype="icon-bubble"] label,\n #tie-draw-line-select-button.line .tui-image-editor-button.line label,\n #tie-draw-line-select-button.free .tui-image-editor-button.free label,\n #tie-flip-button.flipX .tui-image-editor-button.flipX label,\n #tie-flip-button.flipY .tui-image-editor-button.flipY label,\n #tie-flip-button.resetFlip .tui-image-editor-button.resetFlip label,\n #tie-crop-button .tui-image-editor-button.apply.active label,\n #tie-shape-button.rect .tui-image-editor-button.rect label,\n #tie-shape-button.circle .tui-image-editor-button.circle label,\n #tie-shape-button.triangle .tui-image-editor-button.triangle label,\n #tie-text-effect-button .tui-image-editor-button.active label,\n #tie-text-align-button.left .tui-image-editor-button.left label,\n #tie-text-align-button.center .tui-image-editor-button.center label,\n #tie-text-align-button.right .tui-image-editor-button.right label,\n #tie-mask-apply.apply.active .tui-image-editor-button.apply label,\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover > label,\n .tui-image-editor-container .tui-image-editor-checkbox input + label {\n '+t+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button > label,\n .tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label {\n "+n+"\n }\n .tui-image-editor-container .tui-image-editor-range-wrap label {\n "+i+"\n }\n .tui-image-editor-container .tui-image-editor-partition > div {\n "+o+"\n }\n .tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition > div,\n .tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition > div {\n "+r+"\n }\n .tui-image-editor-container .tui-image-editor-checkbox input + label:before {\n "+a+"\n }\n .tui-image-editor-container .tui-image-editor-checkbox input:checked + label:before {\n border: 0;\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-pointer {\n "+s+"\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-bar {\n "+d+"\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-subbar {\n "+h+"\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-pointer {\n "+f+"\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-subbar {\n "+g+"\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-bar {\n "+p+"\n }\n .tui-image-editor-container .tui-image-editor-range-value {\n "+l+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value + label {\n "+c+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value {\n "+u+"\n }\n .tui-image-editor-container .svg_ic-menu {\n "+m+"\n }\n .tui-image-editor-container .svg_ic-submenu {\n "+v+"\n }\n .tui-image-editor-container .tui-image-editor-controls-logo > img,\n .tui-image-editor-container .tui-image-editor-header-logo > img {\n "+b+"\n }\n\n"}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n \n \n \n \n \n
      \n
      \n \n \n \n \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(){return'\n
      \n
    • \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n\n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    \n'; -}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n \n \n \n \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n-1&&"none"!==e&&(e="url("+e+")"),n.push(t._toUnderScore(i)+": "+e)}),n.join(";")}},{key:"_toUnderScore",value:function(e){return e.replace(/([A-Z])/g,function(e,t){return"-"+t.toLowerCase()})}}]),e}();t.default=h},function(e,t){e.exports=function(){}},function(e,t){e.exports=function(e,t,n,i){if(!(e instanceof t)||void 0!==i&&i in e)throw TypeError(n+": incorrect invocation!");return e}},function(e,t,n){var i=n(30),o=n(42),r=n(139);e.exports=function(e){return function(t,n,a){var s,l=i(t),c=o(l.length),u=r(a,c);if(e&&n!=n){for(;c>u;)if(s=l[u++],s!=s)return!0}else for(;c>u;u++)if((e||u in l)&&l[u]===n)return e||u||0;return!e&&-1}}},function(e,t,n){var i=n(20),o=n(124),r=n(123),a=n(11),s=n(42),l=n(142),c={},u={},t=e.exports=function(e,t,n,d,h){var f,p,g,v,m=h?function(){return e}:l(e),b=i(n,d,t?2:1),y=0;if("function"!=typeof m)throw TypeError(e+" is not iterable!");if(r(m)){for(f=s(e.length);f>y;y++)if(v=t?b(a(p=e[y])[0],p[1]):b(e[y]),v===c||v===u)return v}else for(g=m.call(e);!(p=g.next()).done;)if(v=o(g,b,p.value,t),v===c||v===u)return v};t.BREAK=c,t.RETURN=u},function(e,t,n){e.exports=!n(17)&&!n(35)(function(){return 7!=Object.defineProperty(n(26)("div"),"a",{get:function(){return 7}}).a})},function(e,t){e.exports=function(e,t,n){var i=void 0===n;switch(t.length){case 0:return i?e():e.call(n);case 1:return i?e(t[0]):e.call(n,t[0]);case 2:return i?e(t[0],t[1]):e.call(n,t[0],t[1]);case 3:return i?e(t[0],t[1],t[2]):e.call(n,t[0],t[1],t[2]);case 4:return i?e(t[0],t[1],t[2],t[3]):e.call(n,t[0],t[1],t[2],t[3])}return e.apply(n,t)}},function(e,t,n){var i=n(19);e.exports=Object("z").propertyIsEnumerable(0)?Object:function(e){return"String"==i(e)?e.split(""):Object(e)}},function(e,t,n){var i=n(18),o=n(7)("iterator"),r=Array.prototype;e.exports=function(e){return void 0!==e&&(i.Array===e||r[o]===e)}},function(e,t,n){var i=n(11);e.exports=function(e,t,n,o){try{return o?t(i(n)[0],n[1]):t(n)}catch(t){var r=e.return;throw void 0!==r&&i(r.call(e)),t}}},function(e,t,n){"use strict";var i=n(129),o=n(39),r=n(27),a={};n(12)(a,n(7)("iterator"),function(){return this}),e.exports=function(e,t,n){e.prototype=i(a,{next:o(1,n)}),r(e,t+" Iterator")}},function(e,t,n){var i=n(7)("iterator"),o=!1;try{var r=[7][i]();r.return=function(){o=!0},Array.from(r,function(){throw 2})}catch(e){}e.exports=function(e,t){if(!t&&!o)return!1;var n=!1;try{var r=[7],a=r[i]();a.next=function(){return{done:n=!0}},r[i]=function(){return a},e(r)}catch(e){}return n}},function(e,t){e.exports=function(e,t){return{value:t,done:!!e}}},function(e,t,n){var i=n(9),o=n(41).set,r=i.MutationObserver||i.WebKitMutationObserver,a=i.process,s=i.Promise,l="process"==n(19)(a);e.exports=function(){var e,t,n,c=function(){var i,o;for(l&&(i=a.domain)&&i.exit();e;){o=e.fn,e=e.next;try{o()}catch(i){throw e?n():t=void 0,i}}t=void 0,i&&i.enter()};if(l)n=function(){a.nextTick(c)};else if(r){var u=!0,d=document.createTextNode("");new r(c).observe(d,{characterData:!0}),n=function(){d.data=u=!u}}else if(s&&s.resolve){var h=s.resolve();n=function(){h.then(c)}}else n=function(){o.call(i,c)};return function(i){var o={fn:i,next:void 0};t&&(t.next=o),e||(e=o,n()),t=o}}},function(e,t,n){var i=n(11),o=n(130),r=n(33),a=n(28)("IE_PROTO"),s=function(){},l="prototype",c=function(){var e,t=n(26)("iframe"),i=r.length,o="<",a=">";for(t.style.display="none",n(36).appendChild(t),t.src="javascript:",e=t.contentWindow.document,e.open(),e.write(o+"script"+a+"document.F=Object"+o+"/script"+a),e.close(),c=e.F;i--;)delete c[l][r[i]];return c()};e.exports=Object.create||function(e,t){var n;return null!==e?(s[l]=i(e),n=new s,s[l]=null,n[a]=e):n=c(),void 0===t?n:o(n,t)}},function(e,t,n){var i=n(23),o=n(11),r=n(133);e.exports=n(17)?Object.defineProperties:function(e,t){o(e);for(var n,a=r(t),s=a.length,l=0;s>l;)i.f(e,n=a[l++],t[n]);return e}},function(e,t,n){var i=n(21),o=n(140),r=n(28)("IE_PROTO"),a=Object.prototype;e.exports=Object.getPrototypeOf||function(e){return e=o(e),i(e,r)?e[r]:"function"==typeof e.constructor&&e instanceof e.constructor?e.constructor.prototype:e instanceof Object?a:null}},function(e,t,n){var i=n(21),o=n(30),r=n(118)(!1),a=n(28)("IE_PROTO");e.exports=function(e,t){var n,s=o(e),l=0,c=[];for(n in s)n!=a&&i(s,n)&&c.push(n);for(;t.length>l;)i(s,n=t[l++])&&(~r(c,n)||c.push(n));return c}},function(e,t,n){var i=n(132),o=n(33);e.exports=Object.keys||function(e){return i(e,o)}},function(e,t,n){var i=n(12);e.exports=function(e,t,n){for(var o in t)n&&e[o]?e[o]=t[o]:i(e,o,t[o]);return e}},function(e,t,n){e.exports=n(12)},function(e,t,n){"use strict";var i=n(9),o=n(16),r=n(23),a=n(17),s=n(7)("species");e.exports=function(e){var t="function"==typeof o[e]?o[e]:i[e];a&&t&&!t[s]&&r.f(t,s,{configurable:!0,get:function(){return this}})}},function(e,t,n){var i=n(11),o=n(24),r=n(7)("species");e.exports=function(e,t){var n,a=i(e).constructor;return void 0===a||void 0==(n=i(a)[r])?t:o(n)}},function(e,t,n){var i=n(29),o=n(25);e.exports=function(e){return function(t,n){var r,a,s=String(o(t)),l=i(n),c=s.length;return l<0||l>=c?e?"":void 0:(r=s.charCodeAt(l),r<55296||r>56319||l+1===c||(a=s.charCodeAt(l+1))<56320||a>57343?e?s.charAt(l):r:e?s.slice(l,l+2):(r-55296<<10)+(a-56320)+65536)}}},function(e,t,n){var i=n(29),o=Math.max,r=Math.min;e.exports=function(e,t){return e=i(e),e<0?o(e+t,0):r(e,t)}},function(e,t,n){var i=n(25);e.exports=function(e){return Object(i(e))}},function(e,t,n){var i=n(22);e.exports=function(e,t){if(!i(e))return e;var n,o;if(t&&"function"==typeof(n=e.toString)&&!i(o=n.call(e)))return o;if("function"==typeof(n=e.valueOf)&&!i(o=n.call(e)))return o;if(!t&&"function"==typeof(n=e.toString)&&!i(o=n.call(e)))return o;throw TypeError("Can't convert object to primitive value")}},function(e,t,n){var i=n(32),o=n(7)("iterator"),r=n(18);e.exports=n(16).getIteratorMethod=function(e){if(void 0!=e)return e[o]||e["@@iterator"]||r[i(e)]}},function(e,t,n){"use strict";var i=n(116),o=n(127),r=n(18),a=n(30);e.exports=n(37)(Array,"Array",function(e,t){this._t=a(e),this._i=0,this._k=t},function(){var e=this._t,t=this._k,n=this._i++;return!e||n>=e.length?(this._t=void 0,o(1)):"keys"==t?o(0,n):"values"==t?o(0,e[n]):o(0,[n,e[n]])},"values"),r.Arguments=r.Array,i("keys"),i("values"),i("entries")},function(e,t){},function(e,t,n){"use strict";var i,o,r,a=n(38),s=n(9),l=n(20),c=n(32),u=n(34),d=n(22),h=n(24),f=n(117),p=n(119),g=n(137),v=n(41).set,m=n(128)(),b="Promise",y=s.TypeError,_=s.process,k=s[b],_=s.process,w="process"==c(_),x=function(){},E=!!function(){try{var e=k.resolve(1),t=(e.constructor={})[n(7)("species")]=function(e){e(x,x)};return(w||"function"==typeof PromiseRejectionEvent)&&e.then(x)instanceof t}catch(e){}}(),C=function(e,t){return e===t||e===k&&t===r},O=function(e){var t;return!(!d(e)||"function"!=typeof(t=e.then))&&t},S=function(e){return C(k,e)?new M(e):new o(e)},M=o=function(e){var t,n;this.promise=new e(function(e,i){if(void 0!==t||void 0!==n)throw y("Bad Promise constructor");t=e,n=i}),this.resolve=h(t),this.reject=h(n)},j=function(e){try{e()}catch(e){return{error:e}}},T=function(e,t){if(!e._n){e._n=!0;var n=e._c;m(function(){for(var i=e._v,o=1==e._s,r=0,a=function(t){var n,r,a=o?t.ok:t.fail,s=t.resolve,l=t.reject,c=t.domain;try{a?(o||(2==e._h&&D(e),e._h=1),a===!0?n=i:(c&&c.enter(),n=a(i),c&&c.exit()),n===t.promise?l(y("Promise-chain cycle")):(r=O(n))?r.call(n,s,l):s(n)):l(i)}catch(e){l(e)}};n.length>r;)a(n[r++]);e._c=[],e._n=!1,t&&!e._h&&P(e)})}},P=function(e){v.call(s,function(){var t,n,i,o=e._v;if(A(e)&&(t=j(function(){w?_.emit("unhandledRejection",o,e):(n=s.onunhandledrejection)?n({promise:e,reason:o}):(i=s.console)&&i.error&&i.error("Unhandled promise rejection",o)}),e._h=w||A(e)?2:1),e._a=void 0,t)throw t.error})},A=function(e){if(1==e._h)return!1;for(var t,n=e._a||e._c,i=0;n.length>i;)if(t=n[i++],t.fail||!A(t.promise))return!1;return!0},D=function(e){v.call(s,function(){var t;w?_.emit("rejectionHandled",e):(t=s.onrejectionhandled)&&t({promise:e,reason:e._v})})},I=function(e){var t=this;t._d||(t._d=!0,t=t._w||t,t._v=e,t._s=2,t._a||(t._a=t._c.slice()),T(t,!0))},R=function(e){var t,n=this;if(!n._d){n._d=!0,n=n._w||n;try{if(n===e)throw y("Promise can't be resolved itself");(t=O(e))?m(function(){var i={_w:n,_d:!1};try{t.call(e,l(R,i,1),l(I,i,1))}catch(e){I.call(i,e)}}):(n._v=e,n._s=1,T(n,!1))}catch(e){I.call({_w:n,_d:!1},e)}}};E||(k=function(e){f(this,k,b,"_h"),h(e),i.call(this);try{e(l(R,this,1),l(I,this,1))}catch(e){I.call(this,e)}},i=function(e){this._c=[],this._a=void 0,this._s=0,this._d=!1,this._v=void 0,this._h=0,this._n=!1},i.prototype=n(134)(k.prototype,{then:function(e,t){var n=S(g(this,k));return n.ok="function"!=typeof e||e,n.fail="function"==typeof t&&t,n.domain=w?_.domain:void 0,this._c.push(n),this._a&&this._a.push(n),this._s&&T(this,!1),n.promise},catch:function(e){return this.then(void 0,e)}}),M=function(){var e=new i;this.promise=e,this.resolve=l(R,e,1),this.reject=l(I,e,1)}),u(u.G+u.W+u.F*!E,{Promise:k}),n(27)(k,b),n(136)(b),r=n(16)[b],u(u.S+u.F*!E,b,{reject:function(e){var t=S(this),n=t.reject;return n(e),t.promise}}),u(u.S+u.F*(a||!E),b,{resolve:function(e){if(e instanceof k&&C(e.constructor,this))return e;var t=S(this),n=t.resolve;return n(e),t.promise}}),u(u.S+u.F*!(E&&n(126)(function(e){k.all(e).catch(x)})),b,{all:function(e){var t=this,n=S(t),i=n.resolve,o=n.reject,r=j(function(){var n=[],r=0,a=1;p(e,!1,function(e){var s=r++,l=!1;n.push(void 0),a++,t.resolve(e).then(function(e){l||(l=!0,n[s]=e,--a||i(n))},o)}),--a||i(n)});return r&&o(r.error),n.promise},race:function(e){var t=this,n=S(t),i=n.reject,o=j(function(){p(e,!1,function(e){t.resolve(e).then(n.resolve,i)})});return o&&i(o.error),n.promise}})},function(e,t,n){"use strict";var i=n(138)(!0);n(37)(String,"String",function(e){this._t=String(e),this._i=0},function(){var e,t=this._t,n=this._i;return n>=t.length?{value:void 0,done:!0}:(e=i(t,n),this._i+=e.length,{value:e,done:!1})})},function(e,t,n){n(143);for(var i=n(9),o=n(12),r=n(18),a=n(7)("toStringTag"),s=["NodeList","DOMTokenList","MediaList","StyleSheetList","CSSRuleList"],l=0;l<5;l++){var c=s[l],u=i[c],d=u&&u.prototype;d&&!d[a]&&o(d,a,c),r[c]=r.Array}},function(e,t){},function(e,t,n){/*! +function(){if("undefined"!=typeof window&&window.addEventListener){var e,t,n=Object.create(null),i=function(){clearTimeout(t),t=setTimeout(e,100)},o=function(){},r=function(){var e;window.addEventListener("resize",i,!1),window.addEventListener("orientationchange",i,!1),window.MutationObserver?(e=new MutationObserver(i),e.observe(document.documentElement,{childList:!0,subtree:!0,attributes:!0}),o=function(){try{e.disconnect(),window.removeEventListener("resize",i,!1),window.removeEventListener("orientationchange",i,!1)}catch(e){}}):(document.documentElement.addEventListener("DOMSubtreeModified",i,!1),o=function(){document.documentElement.removeEventListener("DOMSubtreeModified",i,!1),window.removeEventListener("resize",i,!1),window.removeEventListener("orientationchange",i,!1)})},a=function(e){function t(e){var t;return void 0!==e.protocol?t=e:(t=document.createElement("a"),t.href=e),t.protocol.replace(/:/g,"")+t.host}var n,i,o;return window.XMLHttpRequest&&(n=new XMLHttpRequest,i=t(location),o=t(e),n=void 0===n.withCredentials&&""!==o&&o!==i?XDomainRequest||void 0:XMLHttpRequest),n},s="http://www.w3.org/1999/xlink";e=function(){function e(){_-=1,0===_&&(o(),r())}function t(e){return function(){n[e.base]!==!0&&(e.useEl.setAttributeNS(s,"xlink:href","#"+e.hash),e.useEl.hasAttribute("href")&&e.useEl.setAttribute("href","#"+e.hash))}}function i(t){return function(){var n,i=document.body,o=document.createElement("x");t.onload=null,o.innerHTML=t.responseText,n=o.getElementsByTagName("svg")[0],n&&(n.setAttribute("aria-hidden","true"),n.style.position="absolute",n.style.width=0,n.style.height=0,n.style.overflow="hidden",i.insertBefore(n,i.firstChild)),e()}}function l(t){return function(){t.onerror=null,t.ontimeout=null,e()}}var c,u,d,h,f,p,g,v,m,b,y="",_=0;for(o(),m=document.getElementsByTagName("use"),f=0;f0&&void 0!==arguments[0]?arguments[0]:{},t=e.uiSize,n=e.imageSize,i=void 0===n?this.imageSize:n;i!==this.imageSize&&(this.imageSize=i),t&&this._setUiSize(t);var o=this._getEditorDimension(),r=o.width,a=o.height,s=this._editorElement.style,l=this.options.menuBarPosition;s.height=a+"px",s.width=r+"px",this._setEditorPosition(l),this._editorElementWrap.style.bottom="0px",this._editorElementWrap.style.top="0px",this._editorElementWrap.style.left="0px",this._editorElementWrap.style.width="100%";var c=this._selectedElement.classList;"top"===l&&this._selectedElement.offsetWidth0&&void 0!==arguments[0]?arguments[0]:this.options.uiSize,t=this._selectedElement.style;t.width=e.width,t.height=e.height}},{key:"_makeSubMenu",value:function(){var e=this;s.default.forEach(this.options.menu,function(t){var n=I[t.replace(/^[a-z]/,function(e){return e.toUpperCase()})];e._makeMenuElement(t),e._els[t]=e._menuElement.querySelector("#tie-btn-"+t),e[t]=new n(e._subMenuElement,{iconStyle:e.theme.getStyle("submenu.icon"),menuBarPosition:e.options.menuBarPosition})})}},{key:"_makeUiElement",value:function(e){var t=void 0;window.snippet=s.default,t=e.jquery?e[0]:e.nodeType?e:document.querySelector(e);var n=c.default.getSelector(t);t.classList.add("tui-image-editor-container"),t.innerHTML=(0,f.default)({biImage:this.theme.getStyle("common.bi"),iconStyle:this.theme.getStyle("menu.icon"),loadButtonStyle:this.theme.getStyle("loadButton"),downloadButtonStyle:this.theme.getStyle("downloadButton")})+(0,d.default)({biImage:this.theme.getStyle("common.bi"),commonStyle:this.theme.getStyle("common"),headerStyle:this.theme.getStyle("header"),loadButtonStyle:this.theme.getStyle("loadButton"),downloadButtonStyle:this.theme.getStyle("downloadButton"),submenuStyle:this.theme.getStyle("submenu")}),this._selectedElement=t,this._selectedElement.classList.add(this.options.menuBarPosition),this._mainElement=n(".tui-image-editor-main"),this._editorElementWrap=n(".tui-image-editor-wrap"),this._editorElement=n(".tui-image-editor"),this._menuElement=n(".tui-image-editor-menu"),this._subMenuElement=n(".tui-image-editor-submenu")}},{key:"_makeMenuElement",value:function(e){var t=document.createElement("li"),n=this.theme.getStyle("menu.icon"),i=n.normal,o=n.active,r=n.hover,a='\n \n \n \n \n \n ';t.id="tie-btn-"+e,t.className="tui-image-editor-item normal",t.title=e.replace(/^[a-z]/g,function(e){return e.toUpperCase()}),t.innerHTML=a,this._menuElement.appendChild(t)}},{key:"_addHelpActionEvent",value:function(e){var t=this;this._els[e].addEventListener("click",function(){t._actions.main[e]()})}},{key:"_addDownloadEvent",value:function(){var e=this;s.default.forEach(this._els.download,function(t){t.addEventListener("click",function(){e._actions.main.download()})})}},{key:"_addLoadEvent",value:function(){var e=this;s.default.forEach(this._els.load,function(t){t.addEventListener("change",function(t){e._actions.main.load(t.target.files[0])})})}},{key:"_addMenuEvent",value:function(e){var t=this;this._els[e].addEventListener("click",function(){t.changeMenu(e)})}},{key:"_addSubMenuEvent",value:function(e){this[e].addEvent(this._actions[e])}},{key:"getEditorArea",value:function(){return this._editorElement}},{key:"activeMenuEvent",value:function(){var e=this;this._initMenuEvent||(this._addHelpActionEvent("undo"),this._addHelpActionEvent("redo"),this._addHelpActionEvent("reset"),this._addHelpActionEvent("delete"),this._addHelpActionEvent("deleteAll"),this._addDownloadEvent(),s.default.forEach(this.options.menu,function(t){e._addMenuEvent(t),e._addSubMenuEvent(t)}),this._initMenu(),this._initMenuEvent=!0)}},{key:"initCanvas",value:function(){var e=this,t=this._getLoadImage();t.path&&this._actions.main.initLoadImage(t.path,t.name).then(function(){e.activeMenuEvent()}),this._addLoadEvent();var n=document.createElement("div");n.className="tui-image-editor-grid-visual";var i='\n \n \n \n
    ';n.innerHTML=i,this._editorContainerElement=this._editorElement.querySelector(".tui-image-editor-canvas-container"),this._editorContainerElement.appendChild(n)}},{key:"_getLoadImage",value:function(){return this.options.loadImage}},{key:"changeMenu",value:function(e){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],n=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];this._submenuChangeTransection||(this._submenuChangeTransection=!0,this._changeMenu(e,t,n),this._submenuChangeTransection=!1)}},{key:"_changeMenu",value:function(e,t,n){this.submenu&&(this._els[this.submenu].classList.remove("active"),this._mainElement.classList.remove("tui-image-editor-menu-"+this.submenu),n&&this._actions.main.discardSelection(),this._actions.main.changeSelectableAll(!0),this[this.submenu].changeStandbyMode()),this.submenu===e&&t?this.submenu=null:(this._els[e].classList.add("active"),this._mainElement.classList.add("tui-image-editor-menu-"+e),this.submenu=e,this[this.submenu].changeStartMode()),this.resizeEditor()}},{key:"_initMenu",value:function(){if(this.options.initMenu){var e=document.createEvent("MouseEvents");e.initEvent("click",!0,!1),this._els[this.options.initMenu].dispatchEvent(e),this.icon&&this.icon.registDefaultIcon()}}},{key:"_getEditorDimension",value:function(){var e=parseFloat(this._editorContainerElement.style.maxHeight),t=this.imageSize.newHeight>e?e:this.imageSize.newHeight,n=parseFloat(this._editorContainerElement.style.maxWidth),i=this.imageSize.newWidth>n?n:this.imageSize.newWidth;return{width:i,height:t}}},{key:"_setEditorPosition",value:function(e){var t=this._getEditorDimension(),n=t.width,i=t.height,o=this._editorElement.style,r=0,a=0;this.submenu&&("bottom"===e?r=i>this._editorElementWrap.scrollHeight-150?(i-this._editorElementWrap.scrollHeight)/2:-75:"top"===e?r=i>this._editorElementWrap.offsetHeight-150?75-(i-(this._editorElementWrap.offsetHeight-150))/2:75:"left"===e?a=n>this._editorElementWrap.offsetWidth-248?124-(n-(this._editorElementWrap.offsetWidth-248))/2:124:"right"===e&&(a=n>this._editorElementWrap.scrollWidth-248?(n-this._editorElementWrap.scrollWidth)/2:-124)),o.top=r+"px",o.left=a+"px"}}]),e}();t.default=L},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n0&&void 0!==arguments[0]?arguments[0]:this.defaultPresetButton;c.default.forEach([].slice.call(this._els.preset.querySelectorAll(".preset")),function(e){e.classList.remove("active")}),e&&e.classList.add("active")}}]),t}(d.default);t.default=p},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n\n \n
      \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    \n\n
    \n \n \n
    \n \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.biImage,n=e.commonStyle,i=e.headerStyle,o=e.loadButtonStyle,r=e.downloadButtonStyle,a=e.submenuStyle;return'\n
    \n
    \n \n
    \n \n \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.subMenuLabelActive,n=e.subMenuLabelNormal,i=e.subMenuRangeTitle,o=e.submenuPartitionVertical,r=e.submenuPartitionHorizontal,a=e.submenuCheckbox,s=e.submenuRangePointer,l=e.submenuRangeValue,c=e.submenuColorpickerTitle,u=e.submenuColorpickerButton,d=e.submenuRangeBar,h=e.submenuRangeSubbar,f=e.submenuDisabledRangePointer,p=e.submenuDisabledRangeBar,g=e.submenuDisabledRangeSubbar,v=e.submenuIconSize,m=e.menuIconSize,b=e.biSize;return'\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype="icon-bubble"] label,\n #tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype="icon-heart"] label,\n #tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype="icon-location"] label,\n #tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype="icon-polygon"] label,\n #tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype="icon-star"] label,\n #tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype="icon-arrow-3"] label,\n #tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype="icon-arrow-2"] label,\n #tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype="icon-arrow"] label,\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype="icon-bubble"] label,\n #tie-draw-line-select-button.line .tui-image-editor-button.line label,\n #tie-draw-line-select-button.free .tui-image-editor-button.free label,\n #tie-flip-button.flipX .tui-image-editor-button.flipX label,\n #tie-flip-button.flipY .tui-image-editor-button.flipY label,\n #tie-flip-button.resetFlip .tui-image-editor-button.resetFlip label,\n #tie-crop-button .tui-image-editor-button.apply.active label,\n #tie-crop-preset-button .tui-image-editor-button.preset.active label,\n #tie-shape-button.rect .tui-image-editor-button.rect label,\n #tie-shape-button.circle .tui-image-editor-button.circle label,\n #tie-shape-button.triangle .tui-image-editor-button.triangle label,\n #tie-text-effect-button .tui-image-editor-button.active label,\n #tie-text-align-button.left .tui-image-editor-button.left label,\n #tie-text-align-button.center .tui-image-editor-button.center label,\n #tie-text-align-button.right .tui-image-editor-button.right label,\n #tie-mask-apply.apply.active .tui-image-editor-button.apply label,\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover > label,\n .tui-image-editor-container .tui-image-editor-checkbox input + label {\n '+t+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button > label,\n .tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label {\n "+n+"\n }\n .tui-image-editor-container .tui-image-editor-range-wrap label {\n "+i+"\n }\n .tui-image-editor-container .tui-image-editor-partition > div {\n "+o+"\n }\n .tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition > div,\n .tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition > div {\n "+r+"\n }\n .tui-image-editor-container .tui-image-editor-checkbox input + label:before {\n "+a+"\n }\n .tui-image-editor-container .tui-image-editor-checkbox input:checked + label:before {\n border: 0;\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-pointer {\n "+s+"\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-bar {\n "+d+"\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-subbar {\n "+h+"\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-pointer {\n "+f+"\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-subbar {\n "+g+"\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-bar {\n "+p+"\n }\n .tui-image-editor-container .tui-image-editor-range-value {\n "+l+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value + label {\n "+c+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value {\n "+u+"\n }\n .tui-image-editor-container .svg_ic-menu {\n "+m+"\n }\n .tui-image-editor-container .svg_ic-submenu {\n "+v+"\n }\n .tui-image-editor-container .tui-image-editor-controls-logo > img,\n .tui-image-editor-container .tui-image-editor-header-logo > img {\n "+b+"\n }\n\n"}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n \n \n \n \n \n
      \n
      \n \n \n \n \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(){return'\n
      \n
    • \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n\n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    \n'; +}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n \n \n \n \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n-1&&"none"!==e&&(e="url("+e+")"),n.push(t._toUnderScore(i)+": "+e)}),n.join(";")}},{key:"_toUnderScore",value:function(e){return e.replace(/([A-Z])/g,function(e,t){return"-"+t.toLowerCase()})}}]),e}();t.default=h},function(e,t){e.exports=function(){}},function(e,t){e.exports=function(e,t,n,i){if(!(e instanceof t)||void 0!==i&&i in e)throw TypeError(n+": incorrect invocation!");return e}},function(e,t,n){var i=n(30),o=n(42),r=n(139);e.exports=function(e){return function(t,n,a){var s,l=i(t),c=o(l.length),u=r(a,c);if(e&&n!=n){for(;c>u;)if(s=l[u++],s!=s)return!0}else for(;c>u;u++)if((e||u in l)&&l[u]===n)return e||u||0;return!e&&-1}}},function(e,t,n){var i=n(20),o=n(124),r=n(123),a=n(11),s=n(42),l=n(142),c={},u={},t=e.exports=function(e,t,n,d,h){var f,p,g,v,m=h?function(){return e}:l(e),b=i(n,d,t?2:1),y=0;if("function"!=typeof m)throw TypeError(e+" is not iterable!");if(r(m)){for(f=s(e.length);f>y;y++)if(v=t?b(a(p=e[y])[0],p[1]):b(e[y]),v===c||v===u)return v}else for(g=m.call(e);!(p=g.next()).done;)if(v=o(g,b,p.value,t),v===c||v===u)return v};t.BREAK=c,t.RETURN=u},function(e,t,n){e.exports=!n(17)&&!n(35)(function(){return 7!=Object.defineProperty(n(26)("div"),"a",{get:function(){return 7}}).a})},function(e,t){e.exports=function(e,t,n){var i=void 0===n;switch(t.length){case 0:return i?e():e.call(n);case 1:return i?e(t[0]):e.call(n,t[0]);case 2:return i?e(t[0],t[1]):e.call(n,t[0],t[1]);case 3:return i?e(t[0],t[1],t[2]):e.call(n,t[0],t[1],t[2]);case 4:return i?e(t[0],t[1],t[2],t[3]):e.call(n,t[0],t[1],t[2],t[3])}return e.apply(n,t)}},function(e,t,n){var i=n(19);e.exports=Object("z").propertyIsEnumerable(0)?Object:function(e){return"String"==i(e)?e.split(""):Object(e)}},function(e,t,n){var i=n(18),o=n(7)("iterator"),r=Array.prototype;e.exports=function(e){return void 0!==e&&(i.Array===e||r[o]===e)}},function(e,t,n){var i=n(11);e.exports=function(e,t,n,o){try{return o?t(i(n)[0],n[1]):t(n)}catch(t){var r=e.return;throw void 0!==r&&i(r.call(e)),t}}},function(e,t,n){"use strict";var i=n(129),o=n(39),r=n(27),a={};n(12)(a,n(7)("iterator"),function(){return this}),e.exports=function(e,t,n){e.prototype=i(a,{next:o(1,n)}),r(e,t+" Iterator")}},function(e,t,n){var i=n(7)("iterator"),o=!1;try{var r=[7][i]();r.return=function(){o=!0},Array.from(r,function(){throw 2})}catch(e){}e.exports=function(e,t){if(!t&&!o)return!1;var n=!1;try{var r=[7],a=r[i]();a.next=function(){return{done:n=!0}},r[i]=function(){return a},e(r)}catch(e){}return n}},function(e,t){e.exports=function(e,t){return{value:t,done:!!e}}},function(e,t,n){var i=n(9),o=n(41).set,r=i.MutationObserver||i.WebKitMutationObserver,a=i.process,s=i.Promise,l="process"==n(19)(a);e.exports=function(){var e,t,n,c=function(){var i,o;for(l&&(i=a.domain)&&i.exit();e;){o=e.fn,e=e.next;try{o()}catch(i){throw e?n():t=void 0,i}}t=void 0,i&&i.enter()};if(l)n=function(){a.nextTick(c)};else if(r){var u=!0,d=document.createTextNode("");new r(c).observe(d,{characterData:!0}),n=function(){d.data=u=!u}}else if(s&&s.resolve){var h=s.resolve();n=function(){h.then(c)}}else n=function(){o.call(i,c)};return function(i){var o={fn:i,next:void 0};t&&(t.next=o),e||(e=o,n()),t=o}}},function(e,t,n){var i=n(11),o=n(130),r=n(33),a=n(28)("IE_PROTO"),s=function(){},l="prototype",c=function(){var e,t=n(26)("iframe"),i=r.length,o="<",a=">";for(t.style.display="none",n(36).appendChild(t),t.src="javascript:",e=t.contentWindow.document,e.open(),e.write(o+"script"+a+"document.F=Object"+o+"/script"+a),e.close(),c=e.F;i--;)delete c[l][r[i]];return c()};e.exports=Object.create||function(e,t){var n;return null!==e?(s[l]=i(e),n=new s,s[l]=null,n[a]=e):n=c(),void 0===t?n:o(n,t)}},function(e,t,n){var i=n(23),o=n(11),r=n(133);e.exports=n(17)?Object.defineProperties:function(e,t){o(e);for(var n,a=r(t),s=a.length,l=0;s>l;)i.f(e,n=a[l++],t[n]);return e}},function(e,t,n){var i=n(21),o=n(140),r=n(28)("IE_PROTO"),a=Object.prototype;e.exports=Object.getPrototypeOf||function(e){return e=o(e),i(e,r)?e[r]:"function"==typeof e.constructor&&e instanceof e.constructor?e.constructor.prototype:e instanceof Object?a:null}},function(e,t,n){var i=n(21),o=n(30),r=n(118)(!1),a=n(28)("IE_PROTO");e.exports=function(e,t){var n,s=o(e),l=0,c=[];for(n in s)n!=a&&i(s,n)&&c.push(n);for(;t.length>l;)i(s,n=t[l++])&&(~r(c,n)||c.push(n));return c}},function(e,t,n){var i=n(132),o=n(33);e.exports=Object.keys||function(e){return i(e,o)}},function(e,t,n){var i=n(12);e.exports=function(e,t,n){for(var o in t)n&&e[o]?e[o]=t[o]:i(e,o,t[o]);return e}},function(e,t,n){e.exports=n(12)},function(e,t,n){"use strict";var i=n(9),o=n(16),r=n(23),a=n(17),s=n(7)("species");e.exports=function(e){var t="function"==typeof o[e]?o[e]:i[e];a&&t&&!t[s]&&r.f(t,s,{configurable:!0,get:function(){return this}})}},function(e,t,n){var i=n(11),o=n(24),r=n(7)("species");e.exports=function(e,t){var n,a=i(e).constructor;return void 0===a||void 0==(n=i(a)[r])?t:o(n)}},function(e,t,n){var i=n(29),o=n(25);e.exports=function(e){return function(t,n){var r,a,s=String(o(t)),l=i(n),c=s.length;return l<0||l>=c?e?"":void 0:(r=s.charCodeAt(l),r<55296||r>56319||l+1===c||(a=s.charCodeAt(l+1))<56320||a>57343?e?s.charAt(l):r:e?s.slice(l,l+2):(r-55296<<10)+(a-56320)+65536)}}},function(e,t,n){var i=n(29),o=Math.max,r=Math.min;e.exports=function(e,t){return e=i(e),e<0?o(e+t,0):r(e,t)}},function(e,t,n){var i=n(25);e.exports=function(e){return Object(i(e))}},function(e,t,n){var i=n(22);e.exports=function(e,t){if(!i(e))return e;var n,o;if(t&&"function"==typeof(n=e.toString)&&!i(o=n.call(e)))return o;if("function"==typeof(n=e.valueOf)&&!i(o=n.call(e)))return o;if(!t&&"function"==typeof(n=e.toString)&&!i(o=n.call(e)))return o;throw TypeError("Can't convert object to primitive value")}},function(e,t,n){var i=n(32),o=n(7)("iterator"),r=n(18);e.exports=n(16).getIteratorMethod=function(e){if(void 0!=e)return e[o]||e["@@iterator"]||r[i(e)]}},function(e,t,n){"use strict";var i=n(116),o=n(127),r=n(18),a=n(30);e.exports=n(37)(Array,"Array",function(e,t){this._t=a(e),this._i=0,this._k=t},function(){var e=this._t,t=this._k,n=this._i++;return!e||n>=e.length?(this._t=void 0,o(1)):"keys"==t?o(0,n):"values"==t?o(0,e[n]):o(0,[n,e[n]])},"values"),r.Arguments=r.Array,i("keys"),i("values"),i("entries")},function(e,t){},function(e,t,n){"use strict";var i,o,r,a=n(38),s=n(9),l=n(20),c=n(32),u=n(34),d=n(22),h=n(24),f=n(117),p=n(119),g=n(137),v=n(41).set,m=n(128)(),b="Promise",y=s.TypeError,_=s.process,k=s[b],_=s.process,w="process"==c(_),x=function(){},E=!!function(){try{var e=k.resolve(1),t=(e.constructor={})[n(7)("species")]=function(e){e(x,x)};return(w||"function"==typeof PromiseRejectionEvent)&&e.then(x)instanceof t}catch(e){}}(),C=function(e,t){return e===t||e===k&&t===r},S=function(e){var t;return!(!d(e)||"function"!=typeof(t=e.then))&&t},O=function(e){return C(k,e)?new M(e):new o(e)},M=o=function(e){var t,n;this.promise=new e(function(e,i){if(void 0!==t||void 0!==n)throw y("Bad Promise constructor");t=e,n=i}),this.resolve=h(t),this.reject=h(n)},j=function(e){try{e()}catch(e){return{error:e}}},T=function(e,t){if(!e._n){e._n=!0;var n=e._c;m(function(){for(var i=e._v,o=1==e._s,r=0,a=function(t){var n,r,a=o?t.ok:t.fail,s=t.resolve,l=t.reject,c=t.domain;try{a?(o||(2==e._h&&D(e),e._h=1),a===!0?n=i:(c&&c.enter(),n=a(i),c&&c.exit()),n===t.promise?l(y("Promise-chain cycle")):(r=S(n))?r.call(n,s,l):s(n)):l(i)}catch(e){l(e)}};n.length>r;)a(n[r++]);e._c=[],e._n=!1,t&&!e._h&&P(e)})}},P=function(e){v.call(s,function(){var t,n,i,o=e._v;if(A(e)&&(t=j(function(){w?_.emit("unhandledRejection",o,e):(n=s.onunhandledrejection)?n({promise:e,reason:o}):(i=s.console)&&i.error&&i.error("Unhandled promise rejection",o)}),e._h=w||A(e)?2:1),e._a=void 0,t)throw t.error})},A=function(e){if(1==e._h)return!1;for(var t,n=e._a||e._c,i=0;n.length>i;)if(t=n[i++],t.fail||!A(t.promise))return!1;return!0},D=function(e){v.call(s,function(){var t;w?_.emit("rejectionHandled",e):(t=s.onrejectionhandled)&&t({promise:e,reason:e._v})})},I=function(e){var t=this;t._d||(t._d=!0,t=t._w||t,t._v=e,t._s=2,t._a||(t._a=t._c.slice()),T(t,!0))},R=function(e){var t,n=this;if(!n._d){n._d=!0,n=n._w||n;try{if(n===e)throw y("Promise can't be resolved itself"); +(t=S(e))?m(function(){var i={_w:n,_d:!1};try{t.call(e,l(R,i,1),l(I,i,1))}catch(e){I.call(i,e)}}):(n._v=e,n._s=1,T(n,!1))}catch(e){I.call({_w:n,_d:!1},e)}}};E||(k=function(e){f(this,k,b,"_h"),h(e),i.call(this);try{e(l(R,this,1),l(I,this,1))}catch(e){I.call(this,e)}},i=function(e){this._c=[],this._a=void 0,this._s=0,this._d=!1,this._v=void 0,this._h=0,this._n=!1},i.prototype=n(134)(k.prototype,{then:function(e,t){var n=O(g(this,k));return n.ok="function"!=typeof e||e,n.fail="function"==typeof t&&t,n.domain=w?_.domain:void 0,this._c.push(n),this._a&&this._a.push(n),this._s&&T(this,!1),n.promise},catch:function(e){return this.then(void 0,e)}}),M=function(){var e=new i;this.promise=e,this.resolve=l(R,e,1),this.reject=l(I,e,1)}),u(u.G+u.W+u.F*!E,{Promise:k}),n(27)(k,b),n(136)(b),r=n(16)[b],u(u.S+u.F*!E,b,{reject:function(e){var t=O(this),n=t.reject;return n(e),t.promise}}),u(u.S+u.F*(a||!E),b,{resolve:function(e){if(e instanceof k&&C(e.constructor,this))return e;var t=O(this),n=t.resolve;return n(e),t.promise}}),u(u.S+u.F*!(E&&n(126)(function(e){k.all(e).catch(x)})),b,{all:function(e){var t=this,n=O(t),i=n.resolve,o=n.reject,r=j(function(){var n=[],r=0,a=1;p(e,!1,function(e){var s=r++,l=!1;n.push(void 0),a++,t.resolve(e).then(function(e){l||(l=!0,n[s]=e,--a||i(n))},o)}),--a||i(n)});return r&&o(r.error),n.promise},race:function(e){var t=this,n=O(t),i=n.reject,o=j(function(){p(e,!1,function(e){t.resolve(e).then(n.resolve,i)})});return o&&i(o.error),n.promise}})},function(e,t,n){"use strict";var i=n(138)(!0);n(37)(String,"String",function(e){this._t=String(e),this._i=0},function(){var e,t=this._t,n=this._i;return n>=t.length?{value:void 0,done:!0}:(e=i(t,n),this._i+=e.length,{value:e,done:!1})})},function(e,t,n){n(143);for(var i=n(9),o=n(12),r=n(18),a=n(7)("toStringTag"),s=["NodeList","DOMTokenList","MediaList","StyleSheetList","CSSRuleList"],l=0;l<5;l++){var c=s[l],u=i[c],d=u&&u.prototype;d&&!d[a]&&o(d,a,c),r[c]=r.Array}},function(e,t){},function(e,t,n){/*! * Toast UI Colorpicker * @version 2.2.0 * @author NHNEnt FE Development Team * @license MIT */ -!function(t,i){e.exports=i(n(3))}(this,function(e){return function(e){function t(i){if(n[i])return n[i].exports;var o=n[i]={exports:{},id:i,loaded:!1};return e[i].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var n={};return t.m=e,t.c=n,t.p="dist",t(0)}([function(e,t,n){n(1),e.exports=n(6)},function(e,t){},,,,,function(e,t,n){"use strict";var i=n(7),o=n(9),r=n(10),a=n(11),s=n(12),l=n(13),c=n(16),u=n(18),d=n(14),h=n(19),f={domutil:i,domevent:o,Collection:r,View:a,Drag:s,create:l,Palette:c,Slider:u,colorutil:d,svgvml:h};e.exports=f},function(e,t,n){"use strict";function i(e){return e.replace(/^\s\s*/,"").replace(/\s\s*$/,"")}var o,r,a=n(8),s=n(9),l=n(10),c=a,u="_pos",d="onselectstart"in document,h="",f=/^auto$|^$|%/;o={appendHTMLElement:function(e,t,n){var i;return n=n||"",i=document.createElement(e),i.className=n,t?t.appendChild(i):document.body.appendChild(i),i},remove:function(e){e&&e.parentNode&&e.parentNode.removeChild(e)},get:function(e){return document.getElementById(e)},_matcher:function(e,t){var n=/^\./,i=/^#/;return n.test(t)?o.hasClass(e,t.replace(".","")):i.test(t)?e.id===t.replace("#",""):e.nodeName.toLowerCase()===t.toLowerCase()},find:function(e,t,n){function i(e,t){for(var c,u=e.childNodes,d=0,h=u.length;d0&&(i(c,t),a))break}var r=[],a=!1,s=c.isUndefined(n)||n===!1,l=c.isFunction(n);return c.isString(t)&&(t=o.get(t)),t=t||window.document.body,i(t,e),s?r[0]||null:r},closest:function(e,t){var n=e.parentNode;if(o._matcher(e,t))return e;for(;n&&n!==window.document.body;){if(o._matcher(n,t))return n;n=n.parentNode}},text:function(e){var t="",n=0,i=e.nodeType;if(i){if(1===i||9===i||11===i){if("string"==typeof e.textContent)return e.textContent;for(e=e.firstChild;e;e=e.nextSibling)t+=o.text(e)}else if(3===i||4===i)return e.nodeValue}else for(;e[n];n+=1)t+=o.text(e[n]);return t},setData:function(e,t,n){return"dataset"in e?void(e.dataset[t]=n):void e.setAttribute("data-"+t,n)},getData:function(e,t){return"dataset"in e?e.dataset[t]:e.getAttribute("data-"+t)},hasClass:function(e,t){var n;return c.isUndefined(e.classList)?(n=o.getClass(e),n.length>0&&new RegExp("(^|\\s)"+t+"(\\s|$)").test(n)):e.classList.contains(t)},addClass:function(e,t){var n;c.isUndefined(e.classList)?o.hasClass(e,t)||(n=o.getClass(e),o.setClass(e,(n?n+" ":"")+t)):c.forEachArray(t.split(" "),function(t){e.classList.add(t)})},setClass:function(e,t){c.isUndefined(e.className.baseVal)?e.className=t:e.className.baseVal=t},removeClass:function(e,t){var n="";c.isUndefined(e.classList)?(n=(" "+o.getClass(e)+" ").replace(" "+t+" "," "),o.setClass(e,i(n))):e.classList.remove(t)},getClass:function(e){return e&&e.className?c.isUndefined(e.className.baseVal)?e.className:e.className.baseVal:""},getStyle:function(e,t){var n,i=e.style[t]||e.currentStyle&&e.currentStyle[t];return i&&"auto"!==i||!document.defaultView||(n=document.defaultView.getComputedStyle(e,null),i=n?n[t]:null),"auto"===i?null:i},getComputedStyle:function(e){var t=document.defaultView;return t&&t.getComputedStyle?document.defaultView.getComputedStyle(e):{getPropertyValue:function(t){var n=/(\-([a-z]){1})/g;return"float"===t&&(t="styleFloat"),n.test(t)&&(t=t.replace(n,function(){return arguments[2].toUpperCase()})),e.currentStyle[t]?e.currentStyle[t]:null}}},setPosition:function(e,t,n){t=c.isUndefined(t)?0:t,n=c.isUndefined(n)?0:n,e[u]=[t,n],e.style.left=t+"px",e.style.top=n+"px"},getPosition:function(e,t){var n,i,o;return t&&(e[u]=null),e[u]?e[u]:(n=0,i=0,(f.test(e.style.left)||f.test(e.style.top))&&"getBoundingClientRect"in e?(o=e.getBoundingClientRect(),n=o.left,i=o.top):(n=parseFloat(e.style.left||0),i=parseFloat(e.style.top||0)),[n,i])},getSize:function(e){var t,n=o.getStyle(e,"width"),i=o.getStyle(e,"height");return(f.test(n)||f.test(i))&&"getBoundingClientRect"in e?(t=e.getBoundingClientRect(),n=t.width,i=t.height):(n=parseFloat(n||0),i=parseFloat(i||0)),[n,i]},testProp:function(e){for(var t=document.documentElement.style,n=0,i=e.length;n1?void s(u.call(arguments),function(e){this.add(e)},this):(t=this.getItemID(e),n=this.items,n[t]||(this.length+=1),void(n[t]=e))},i.prototype.remove=function(e){var t,n,i=[];return this.length?arguments.length>1?i=r.map(u.call(arguments),function(e){return this.remove(e)},this):(t=this.items,c(e)&&(e=this.getItemID(e)),t[e]?(this.length-=1,n=t[e],delete t[e],n):i):i},i.prototype.clear=function(){this.items={},this.length=0},i.prototype.has=function(e){var t,n;return!!this.length&&(t=l(e),n=!1,t?this.each(function(t){return e(t)!==!0||(n=!0,!1)}):(e=c(e)?this.getItemID(e):e,n=r.isExisty(this.items[e])),n)},i.prototype.doWhenHas=function(e,t,n){var i=this.items[e];r.isExisty(i)&&t.call(n||this,i)},i.prototype.find=function(e){var t=new i;return this.hasOwnProperty("getItemID")&&(t.getItemID=this.getItemID),this.each(function(n){e(n)===!0&&t.add(n)}),t},i.prototype.groupBy=function(e,t){var n,o,a={},s=l(e),c=this.getItemID;if(r.isArray(e)){if(r.forEachArray(e,function(e){a[e+""]=new i(c)}),!t)return a;e=t,s=!0}return this.each(function(t){s?o=e(t):(o=t[e],l(o)&&(o=o.apply(t))),n=a[o],n||(n=a[o]=new i(c)),n.add(t)}),a},i.prototype.single=function(){var e;return this.each(function(t){return e=t,!1},this),e},i.prototype.sort=function(e){var t=[];return this.each(function(e){t.push(e)}),l(e)&&(t=t.sort(e)),t},i.prototype.each=function(e,t){a(this.items,e,t||this)},i.prototype.toArray=function(){return this.length?r.map(this.items,function(e){return e}):[]},e.exports=i},function(e,t,n){"use strict";function i(e,t){var n=o.stamp(this);e=e||{},o.isUndefined(t)&&(t=r.appendHTMLElement("div")),r.addClass(t,"tui-view-"+n),this.id=n,this.container=t,this.childs=new a(function(e){return o.stamp(e)}),this.parent=null}var o=n(8),r=n(7),a=n(10);i.prototype.addChild=function(e,t){t&&t.call(e,this),e.parent=this,this.childs.add(e)},i.prototype.removeChild=function(e,t){var n=o.isNumber(e)?this.childs.items[e]:e;e=o.stamp(n),t&&t.call(n,this),this.childs.remove(e)},i.prototype.render=function(){this.childs.each(function(e){e.render()})},i.prototype.recursive=function(e,t){o.isFunction(e)&&(t||e(this),this.childs.each(function(t){t.recursive(e)}))},i.prototype.resize=function(){for(var e=Array.prototype.slice.call(arguments),t=this.parent;t;)o.isFunction(t._onResize)&&t._onResize.apply(t,e),t=t.parent},i.prototype._beforeDestroy=function(){},i.prototype._destroy=function(){this._beforeDestroy(),this.childs.clear(),this.container.innerHTML="",this.id=this.parent=this.childs=this.container=null},i.prototype.destroy=function(e){this.childs.each(function(e){e.destroy(!0),e._destroy()}),e||this._destroy()},i.prototype.getViewBound=function(){var e=this.container,t=r.getPosition(e),n=r.getSize(e);return{x:t[0],y:t[1],width:n[0],height:n[1]}},e.exports=i},function(e,t,n){(function(t){"use strict";function i(e,t){a.on(t,"mousedown",this._onMouseDown,this),this.options=o.extend({distance:10},e),this.container=t,this._isMoved=!1,this._distance=0,this._dragStartFired=!1,this._dragStartEventData=null}var o=n(8),r=n(7),a=n(9);i.prototype.destroy=function(){a.off(this.container,"mousedown",this._onMouseDown,this),this.options=this.container=this._isMoved=this._distance=this._dragStartFired=this._dragStartEventData=null},i.prototype._toggleDragEvent=function(e){var n,i,o=this.container;e?(n="on",i="disable"):(n="off",i="enable"),r[i+"TextSelection"](o),r[i+"ImageDrag"](o),a[n](t.document,{mousemove:this._onMouseMove,mouseup:this._onMouseUp},this)},i.prototype._getEventData=function(e){return{target:e.target||e.srcElement,originEvent:e}},i.prototype._onMouseDown=function(e){0===a.getMouseButton(e)&&(this._distance=0,this._dragStartFired=!1,this._dragStartEventData=this._getEventData(e),this._toggleDragEvent(!0))},i.prototype._onMouseMove=function(e){var t=this.options.distance;return a.preventDefault(e),this._isMoved=!0,this._distancet)return e+"";for(;i0&&(i(c,t),a))break}var r=[],a=!1,s=c.isUndefined(n)||n===!1,l=c.isFunction(n);return c.isString(t)&&(t=o.get(t)),t=t||window.document.body,i(t,e),s?r[0]||null:r},closest:function(e,t){var n=e.parentNode;if(o._matcher(e,t))return e;for(;n&&n!==window.document.body;){if(o._matcher(n,t))return n;n=n.parentNode}},text:function(e){var t="",n=0,i=e.nodeType;if(i){if(1===i||9===i||11===i){if("string"==typeof e.textContent)return e.textContent;for(e=e.firstChild;e;e=e.nextSibling)t+=o.text(e)}else if(3===i||4===i)return e.nodeValue}else for(;e[n];n+=1)t+=o.text(e[n]);return t},setData:function(e,t,n){return"dataset"in e?void(e.dataset[t]=n):void e.setAttribute("data-"+t,n)},getData:function(e,t){return"dataset"in e?e.dataset[t]:e.getAttribute("data-"+t)},hasClass:function(e,t){var n;return c.isUndefined(e.classList)?(n=o.getClass(e),n.length>0&&new RegExp("(^|\\s)"+t+"(\\s|$)").test(n)):e.classList.contains(t)},addClass:function(e,t){var n;c.isUndefined(e.classList)?o.hasClass(e,t)||(n=o.getClass(e),o.setClass(e,(n?n+" ":"")+t)):c.forEachArray(t.split(" "),function(t){e.classList.add(t)})},setClass:function(e,t){c.isUndefined(e.className.baseVal)?e.className=t:e.className.baseVal=t},removeClass:function(e,t){var n="";c.isUndefined(e.classList)?(n=(" "+o.getClass(e)+" ").replace(" "+t+" "," "),o.setClass(e,i(n))):e.classList.remove(t)},getClass:function(e){return e&&e.className?c.isUndefined(e.className.baseVal)?e.className:e.className.baseVal:""},getStyle:function(e,t){var n,i=e.style[t]||e.currentStyle&&e.currentStyle[t];return i&&"auto"!==i||!document.defaultView||(n=document.defaultView.getComputedStyle(e,null),i=n?n[t]:null),"auto"===i?null:i},getComputedStyle:function(e){var t=document.defaultView;return t&&t.getComputedStyle?document.defaultView.getComputedStyle(e):{getPropertyValue:function(t){var n=/(\-([a-z]){1})/g;return"float"===t&&(t="styleFloat"),n.test(t)&&(t=t.replace(n,function(){return arguments[2].toUpperCase()})),e.currentStyle[t]?e.currentStyle[t]:null}}},setPosition:function(e,t,n){t=c.isUndefined(t)?0:t,n=c.isUndefined(n)?0:n,e[u]=[t,n],e.style.left=t+"px",e.style.top=n+"px"},getPosition:function(e,t){var n,i,o;return t&&(e[u]=null),e[u]?e[u]:(n=0,i=0,(f.test(e.style.left)||f.test(e.style.top))&&"getBoundingClientRect"in e?(o=e.getBoundingClientRect(),n=o.left,i=o.top):(n=parseFloat(e.style.left||0),i=parseFloat(e.style.top||0)),[n,i])},getSize:function(e){var t,n=o.getStyle(e,"width"),i=o.getStyle(e,"height");return(f.test(n)||f.test(i))&&"getBoundingClientRect"in e?(t=e.getBoundingClientRect(),n=t.width,i=t.height):(n=parseFloat(n||0),i=parseFloat(i||0)),[n,i]},testProp:function(e){for(var t=document.documentElement.style,n=0,i=e.length;n1?void s(u.call(arguments),function(e){this.add(e)},this):(t=this.getItemID(e),n=this.items,n[t]||(this.length+=1),void(n[t]=e))},i.prototype.remove=function(e){var t,n,i=[];return this.length?arguments.length>1?i=r.map(u.call(arguments),function(e){return this.remove(e)},this):(t=this.items,c(e)&&(e=this.getItemID(e)),t[e]?(this.length-=1,n=t[e],delete t[e],n):i):i},i.prototype.clear=function(){this.items={},this.length=0},i.prototype.has=function(e){var t,n;return!!this.length&&(t=l(e),n=!1,t?this.each(function(t){return e(t)!==!0||(n=!0,!1)}):(e=c(e)?this.getItemID(e):e,n=r.isExisty(this.items[e])),n)},i.prototype.doWhenHas=function(e,t,n){var i=this.items[e];r.isExisty(i)&&t.call(n||this,i)},i.prototype.find=function(e){var t=new i;return this.hasOwnProperty("getItemID")&&(t.getItemID=this.getItemID),this.each(function(n){e(n)===!0&&t.add(n)}),t},i.prototype.groupBy=function(e,t){var n,o,a={},s=l(e),c=this.getItemID;if(r.isArray(e)){if(r.forEachArray(e,function(e){a[e+""]=new i(c)}),!t)return a;e=t,s=!0}return this.each(function(t){s?o=e(t):(o=t[e],l(o)&&(o=o.apply(t))),n=a[o],n||(n=a[o]=new i(c)),n.add(t)}),a},i.prototype.single=function(){var e;return this.each(function(t){return e=t,!1},this),e},i.prototype.sort=function(e){var t=[];return this.each(function(e){t.push(e)}),l(e)&&(t=t.sort(e)),t},i.prototype.each=function(e,t){a(this.items,e,t||this)},i.prototype.toArray=function(){return this.length?r.map(this.items,function(e){return e}):[]},e.exports=i},function(e,t,n){"use strict";function i(e,t){var n=o.stamp(this);e=e||{},o.isUndefined(t)&&(t=r.appendHTMLElement("div")),r.addClass(t,"tui-view-"+n),this.id=n,this.container=t,this.childs=new a(function(e){return o.stamp(e)}),this.parent=null}var o=n(8),r=n(7),a=n(10);i.prototype.addChild=function(e,t){t&&t.call(e,this),e.parent=this,this.childs.add(e)},i.prototype.removeChild=function(e,t){var n=o.isNumber(e)?this.childs.items[e]:e;e=o.stamp(n),t&&t.call(n,this),this.childs.remove(e)},i.prototype.render=function(){this.childs.each(function(e){e.render()})},i.prototype.recursive=function(e,t){o.isFunction(e)&&(t||e(this),this.childs.each(function(t){t.recursive(e)}))},i.prototype.resize=function(){for(var e=Array.prototype.slice.call(arguments),t=this.parent;t;)o.isFunction(t._onResize)&&t._onResize.apply(t,e),t=t.parent},i.prototype._beforeDestroy=function(){},i.prototype._destroy=function(){this._beforeDestroy(),this.childs.clear(),this.container.innerHTML="",this.id=this.parent=this.childs=this.container=null},i.prototype.destroy=function(e){this.childs.each(function(e){e.destroy(!0),e._destroy()}),e||this._destroy()},i.prototype.getViewBound=function(){var e=this.container,t=r.getPosition(e),n=r.getSize(e);return{x:t[0],y:t[1],width:n[0],height:n[1]}},e.exports=i},function(e,t,n){(function(t){"use strict";function i(e,t){a.on(t,"mousedown",this._onMouseDown,this),this.options=o.extend({distance:10},e),this.container=t,this._isMoved=!1,this._distance=0,this._dragStartFired=!1,this._dragStartEventData=null}var o=n(8),r=n(7),a=n(9);i.prototype.destroy=function(){a.off(this.container,"mousedown",this._onMouseDown,this),this.options=this.container=this._isMoved=this._distance=this._dragStartFired=this._dragStartEventData=null},i.prototype._toggleDragEvent=function(e){var n,i,o=this.container;e?(n="on",i="disable"):(n="off",i="enable"),r[i+"TextSelection"](o),r[i+"ImageDrag"](o),a[n](t.document,{mousemove:this._onMouseMove,mouseup:this._onMouseUp},this)},i.prototype._getEventData=function(e){return{target:e.target||e.srcElement,originEvent:e}},i.prototype._onMouseDown=function(e){0===a.getMouseButton(e)&&(this._distance=0,this._dragStartFired=!1,this._dragStartEventData=this._getEventData(e),this._toggleDragEvent(!0))},i.prototype._onMouseMove=function(e){var t=this.options.distance;return a.preventDefault(e),this._isMoved=!0,this._distancet)return e+"";for(;i HSV conversion utilities based off of http://www.cs.rit.edu/~ncs/color/t_convert.html hexToRGB:function(e){var t,n,o;return!!i.isValidRGB(e)&&(e=e.substring(1),t=parseInt(e.substr(0,2),16),n=parseInt(e.substr(2,2),16),o=parseInt(e.substr(4,2),16),[t,n,o])},rgbToHEX:function(e,t,n){var o="#"+i.leadingZero(e.toString(16),2)+i.leadingZero(t.toString(16),2)+i.leadingZero(n.toString(16),2);return!!i.isValidRGB(o)&&o},rgbToHSV:function(e,t,n){var i,o,r,a,s,l;if(e/=255,t/=255,n/=255,i=Math.max(e,t,n),o=Math.min(e,t,n),s=i,l=i-o,a=0===i?0:l/i,i===o)r=0;else{switch(i){case e:r=(t-n)/l+(t{{colorList}}','
    ','','','{{color}}',"
    "].join("\n"),i='
    • ',o="background-color:{{color}};color:{{color}}";e.exports={layout:n,item:i,itemStyle:o}},function(e,t,n){"use strict";function i(e,t){t=r.appendHTMLElement("div",t,e.cssPrefix+"slider-container"),t.style.display="none",c.call(this,e,t),this.options=o.extend({color:"#f8f8f8",cssPrefix:"tui-colorpicker-"},e),this._dragDataCache={},this.sliderHandleElement=null,this.huebarHandleElement=null,this.baseColorElement=null,this.drag=new u({distance:0},t),this.drag.on({dragStart:this._onDragStart,drag:this._onDrag,dragEnd:this._onDragEnd,click:this._onClick},this)}var o=n(8),r=n(7),a=n(9),s=n(19),l=n(14),c=n(11),u=n(12),d=n(20),h=[-7,112],f=[-3,115],p=359.99;o.inherit(i,c),i.prototype._beforeDestroy=function(){this.drag.off(),this.drag=this.options=this._dragDataCache=this.sliderHandleElement=this.huebarHandleElement=this.baseColorElement=null},i.prototype.toggle=function(e){this.container.style.display=e?"block":"none"},i.prototype.isVisible=function(){return"block"===this.container.style.display},i.prototype.render=function(e){var t,n,i=this,o=i.container,a=i.options,s=d.layout;l.isValidRGB(e)&&(s=s.replace(/{{slider}}/,d.slider),s=s.replace(/{{huebar}}/,d.huebar),s=s.replace(/{{cssPrefix}}/g,a.cssPrefix),i.container.innerHTML=s,i.sliderHandleElement=r.find("."+a.cssPrefix+"slider-handle",o),i.huebarHandleElement=r.find("."+a.cssPrefix+"huebar-handle",o),i.baseColorElement=r.find("."+a.cssPrefix+"slider-basecolor",o),t=l.hexToRGB(e),n=l.rgbToHSV.apply(null,t),this.moveHue(n[0],!0),this.moveSaturationAndValue(n[1],n[2],!0))},i.prototype._moveColorSliderHandle=function(e,t,n){var i,o=this.sliderHandleElement;t=Math.max(h[0],t),t=Math.min(h[1],t),e=Math.max(h[0],e),e=Math.min(h[1],e),s.setTranslateXY(o,e,t),i=t>50?"white":"black",s.setStrokeColor(o,i),n||this.fire("_selectColor",{color:l.rgbToHEX.apply(null,this.getRGB())})},i.prototype.moveSaturationAndValue=function(e,t,n){var i,o,r,a;e=e||0,t=t||0,i=Math.abs(h[0]),o=h[1],r=e*o/100-i,a=o-t*o/100-i,this._moveColorSliderHandle(r,a,n)},i.prototype._moveColorSliderByPosition=function(e,t){var n=h[0];this._moveColorSliderHandle(e+n,t+n)},i.prototype.getSaturationAndValue=function(){var e,t,n=Math.abs(h[0]),i=n+h[1],o=s.getTranslateXY(this.sliderHandleElement);return e=(o[1]+n)/i*100,t=100-(o[0]+n)/i*100,[e,t]},i.prototype._moveHueHandle=function(e,t){var n,i,o=this.huebarHandleElement,r=this.baseColorElement;e=Math.max(f[0],e),e=Math.min(f[1],e),s.setTranslateY(o,e),n=l.hsvToRGB(this.getHue(),100,100),i=l.rgbToHEX.apply(null,n),s.setGradientColorStop(r,i),t||this.fire("_selectColor",{color:l.rgbToHEX.apply(null,this.getRGB())})},i.prototype.moveHue=function(e,t){var n,i,o=0;n=Math.abs(f[0]),i=n+f[1],e=e||0,o=i*e/p-n,this._moveHueHandle(o,t)},i.prototype._moveHueByPosition=function(e){var t=f[0];this._moveHueHandle(e+t)},i.prototype.getHue=function(){var e,t,n=this.huebarHandleElement,i=s.getTranslateXY(n);return e=Math.abs(f[0]),t=e+f[1],(i[0]+e)*p/t},i.prototype.getHSV=function(){var e=this.getSaturationAndValue(),t=this.getHue();return[t].concat(e)},i.prototype.getRGB=function(){return l.hsvToRGB.apply(null,this.getHSV())},i.prototype._prepareColorSliderForMouseEvent=function(e){var t,n=this.options,i=r.closest(e.target,"."+n.cssPrefix+"slider-part");return t=this._dragDataCache={isColorSlider:r.hasClass(i,n.cssPrefix+"slider-left"),parentElement:i}},i.prototype._onClick=function(e){var t=this._prepareColorSliderForMouseEvent(e),n=a.getMousePosition(e.originEvent,t.parentElement);t.isColorSlider?this._moveColorSliderByPosition(n[0],n[1]):this._moveHueByPosition(n[1]),this._dragDataCache=null},i.prototype._onDragStart=function(e){this._prepareColorSliderForMouseEvent(e)},i.prototype._onDrag=function(e){var t=this._dragDataCache,n=a.getMousePosition(e.originEvent,t.parentElement);t.isColorSlider?this._moveColorSliderByPosition(n[0],n[1]):this._moveHueByPosition(n[1])},i.prototype._onDragEnd=function(){this._dragDataCache=null},o.CustomEvents.mixin(i),e.exports=i},function(e,t,n){"use strict";var i=n(8),o=/[\.\-0-9]+/g,r=-6,a={isOldBrowser:function(){var e=a._isOldBrowser;return i.isExisty(e)||(a._isOldBrowser=e=i.browser.msie&&i.browser.version<9),e},getTranslateXY:function(e){var t;return a.isOldBrowser()?(t=e.style,[parseFloat(t.top),parseFloat(t.left)]):(t=e.getAttribute("transform"))?(t=t.match(o),[parseFloat(t[1]),parseFloat(t[0])]):[0,0]},setTranslateXY:function(e,t,n){a.isOldBrowser()?(e.style.left=t+"px",e.style.top=n+"px"):e.setAttribute("transform","translate("+t+","+n+")")},setTranslateY:function(e,t){a.isOldBrowser()?e.style.top=t+"px":e.setAttribute("transform","translate("+r+","+t+")")},setStrokeColor:function(e,t){a.isOldBrowser()?e.strokecolor=t:e.setAttribute("stroke",t)},setGradientColorStop:function(e,t){a.isOldBrowser()?e.color=t:e.setAttribute("stop-color",t)}};e.exports=a},function(e,t,n){(function(t){"use strict";var i=n(8),o=['
    {{slider}}
    ','
    {{huebar}}
    '].join("\n"),r=['',"",'','','',"",'','','',"","",'','','',""].join("\n"),a=['
    ','','',"",'','',"",'',"
    "].join("\n"),s=['',"",'','','','','','','','',"","",'','',""].join("\n"),l=['
    ','','',"",'',"
    "].join("\n"),c=i.browser.msie&&i.browser.version<9;c&&t.document.namespaces.add("v","urn:schemas-microsoft-com:vml"),e.exports={layout:o,slider:c?a:r,huebar:c?l:s}}).call(t,function(){return this}())}])})}])}); \ No newline at end of file From 4206f8f94463aa4bb91819c131cc36ee4b73e52e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B9=80=EC=A7=84=EC=9A=B0?= Date: Fri, 11 Jan 2019 12:07:54 +0900 Subject: [PATCH 09/10] chore: version up v3.3.1 bundle --- dist/tui-image-editor.css | 6 +- dist/tui-image-editor.js | 505 ++++++++++++++++++++++------------ dist/tui-image-editor.min.css | 4 +- dist/tui-image-editor.min.js | 20 +- 4 files changed, 346 insertions(+), 189 deletions(-) diff --git a/dist/tui-image-editor.css b/dist/tui-image-editor.css index 5284cdf75..32f3688d3 100644 --- a/dist/tui-image-editor.css +++ b/dist/tui-image-editor.css @@ -1,6 +1,6 @@ /*! * tui-image-editor.js - * @version 3.3.0 + * @version 3.3.1 * @author NHNEnt FE Development Lab * @license MIT */ @@ -539,7 +539,7 @@ body > textarea { .tui-image-editor-container.left .tui-image-editor-menu > .tui-image-editor-item[title]:after { top: 7px; left: 39px; - width: 27px; + white-space: nowrap; } .tui-image-editor-container.left .tui-image-editor-submenu { left: 0; @@ -632,7 +632,7 @@ body > textarea { .tui-image-editor-container.right .tui-image-editor-menu > .tui-image-editor-item[title]:after { top: 7px; left: -44px; - width: 27px; + white-space: nowrap; } .tui-image-editor-container.right .tui-image-editor-submenu { right: 0; diff --git a/dist/tui-image-editor.js b/dist/tui-image-editor.js index ab405406f..fb3732b9a 100644 --- a/dist/tui-image-editor.js +++ b/dist/tui-image-editor.js @@ -1,6 +1,6 @@ /*! * tui-image-editor.js - * @version 3.3.0 + * @version 3.3.1 * @author NHNEnt FE Development Lab * @license MIT */ @@ -13,7 +13,7 @@ exports["ImageEditor"] = factory(require("tui-code-snippet"), require("fabric/dist/fabric.require")); else root["tui"] = root["tui"] || {}, root["tui"]["ImageEditor"] = factory((root["tui"] && root["tui"]["util"]), root["fabric"]); -})(this, function(__WEBPACK_EXTERNAL_MODULE_3__, __WEBPACK_EXTERNAL_MODULE_105__) { +})(this, function(__WEBPACK_EXTERNAL_MODULE_3__, __WEBPACK_EXTERNAL_MODULE_106__) { return /******/ (function(modules) { // webpackBootstrap /******/ // The module cache /******/ var installedModules = {}; @@ -68,9 +68,7 @@ return /******/ (function(modules) { // webpackBootstrap var _imageEditor2 = _interopRequireDefault(_imageEditor); - __webpack_require__(130); - - __webpack_require__(132); + __webpack_require__(131); __webpack_require__(133); @@ -108,6 +106,8 @@ return /******/ (function(modules) { // webpackBootstrap __webpack_require__(150); + __webpack_require__(151); + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } module.exports = _imageEditor2.default; @@ -609,7 +609,7 @@ return /******/ (function(modules) { // webpackBootstrap var _ui2 = _interopRequireDefault(_ui); - var _action = __webpack_require__(102); + var _action = __webpack_require__(103); var _action2 = _interopRequireDefault(_action); @@ -617,7 +617,7 @@ return /******/ (function(modules) { // webpackBootstrap var _command2 = _interopRequireDefault(_command); - var _graphics = __webpack_require__(104); + var _graphics = __webpack_require__(105); var _graphics2 = _interopRequireDefault(_graphics); @@ -657,6 +657,15 @@ return /******/ (function(modules) { // webpackBootstrap * @param {string} [options.includeUI.menuBarPosition=bottom] - Menu bar position [top | bottom | left | right] * @param {number} options.cssMaxWidth - Canvas css-max-width * @param {number} options.cssMaxHeight - Canvas css-max-height + * @param {Object} [options.selectionStyle] - selection style + * @param {string} [options.selectionStyle.cornerStyle] - selection corner style + * @param {number} [options.selectionStyle.cornerSize] - selection corner size + * @param {string} [options.selectionStyle.cornerColor] - selection corner color + * @param {string} [options.selectionStyle.cornerStrokeColor] = selection corner stroke color + * @param {boolean} [options.selectionStyle.transparentCorners] - selection corner transparent + * @param {number} [options.selectionStyle.lineWidth] - selection line width + * @param {string} [options.selectionStyle.borderColor] - selection border color + * @param {number} [options.selectionStyle.rotatingPointOffset] - selection rotating point length * @param {Boolean} [options.usageStatistics=true] - Let us know the hostname. If you don't want to send the hostname, please set to false. * @example * var ImageEditor = require('tui-image-editor'); @@ -805,13 +814,13 @@ return /******/ (function(modules) { // webpackBootstrap * @property {number} id - object id * @property {string} type - object type * @property {string} text - text content - * @property {string} left - Left - * @property {string} top - Top - * @property {string} width - Width - * @property {string} height - Height + * @property {(string | number)} left - Left + * @property {(string | number)} top - Top + * @property {(string | number)} width - Width + * @property {(string | number)} height - Height * @property {string} fill - Color * @property {string} stroke - Stroke - * @property {string} strokeWidth - StrokeWidth + * @property {(string | number)} strokeWidth - StrokeWidth * @property {string} fontFamily - Font type for text * @property {number} fontSize - Font Size * @property {string} fontStyle - Type of inclination (normal / italic) @@ -1386,14 +1395,13 @@ return /******/ (function(modules) { // webpackBootstrap /** * Set the cropping rect - * @param {Object} mode crop rect mode [1, 1.5, 1.3333333333333333, 1.25, 1.7777777777777777] - * @returns {Object} {{left: number, top: number, width: number, height: number}} rect + * @param {number} [mode] crop rect mode [1, 1.5, 1.3333333333333333, 1.25, 1.7777777777777777] */ }, { key: 'setCropzoneRect', value: function setCropzoneRect(mode) { - return this._graphics.setCropzoneRect(mode); + this._graphics.setCropzoneRect(mode); } /** @@ -1608,7 +1616,7 @@ return /******/ (function(modules) { // webpackBootstrap * @param {number} [options.ry] - Radius y value (When type option is 'circle', this options can use) * @param {number} [options.left] - Shape x position * @param {number} [options.top] - Shape y position - * @param {number} [options.isRegular] - Whether resizing shape has 1:1 ratio or not + * @param {boolean} [options.isRegular] - Whether resizing shape has 1:1 ratio or not * @returns {Promise} * @example * imageEditor.addShape('rect', { @@ -1655,7 +1663,7 @@ return /******/ (function(modules) { // webpackBootstrap * @param {number} [options.height] - Height value (When type option is 'rect', this options can use) * @param {number} [options.rx] - Radius x value (When type option is 'circle', this options can use) * @param {number} [options.ry] - Radius y value (When type option is 'circle', this options can use) - * @param {number} [options.isRegular] - Whether resizing shape has 1:1 ratio or not + * @param {boolean} [options.isRegular] - Whether resizing shape has 1:1 ratio or not * @returns {Promise} * @example * // call after selecting shape object on canvas @@ -1703,7 +1711,7 @@ return /******/ (function(modules) { // webpackBootstrap * imageEditor.addText('init text', { * styles: { * fill: '#000', - * fontSize: '20', + * fontSize: 20, * fontWeight: 'bold' * }, * position: { @@ -1954,8 +1962,8 @@ return /******/ (function(modules) { // webpackBootstrap * @param {string} type - Icon type ('arrow', 'cancel', custom icon name) * @param {Object} options - Icon options * @param {string} [options.fill] - Icon foreground color - * @param {string} [options.left] - Icon x position - * @param {string} [options.top] - Icon y position + * @param {number} [options.left] - Icon x position + * @param {number} [options.top] - Icon y position * @returns {Promise} * @example * imageEditor.addIcon('arrow'); // The position is center on canvas @@ -4450,6 +4458,7 @@ return /******/ (function(modules) { // webpackBootstrap var hostnameSent = false; module.exports = { + /** * Clamp value * @param {number} value - Value @@ -4936,6 +4945,10 @@ return /******/ (function(modules) { // webpackBootstrap var _filter2 = _interopRequireDefault(_filter); + var _locale = __webpack_require__(102); + + var _locale2 = _interopRequireDefault(_locale); + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } @@ -4974,11 +4987,11 @@ return /******/ (function(modules) { // webpackBootstrap _classCallCheck(this, Ui); this.options = this._initializeOption(options); - this._actions = actions; this.submenu = false; this.imageSize = {}; this.uiSize = {}; + this._locale = new _locale2.default(this.options.locale); this.theme = new _theme2.default(this.options.theme); this._submenuChangeTransection = false; @@ -5194,6 +5207,7 @@ return /******/ (function(modules) { // webpackBootstrap path: '', name: '' }, + locale: {}, menuIconPath: '', menu: ['crop', 'flip', 'rotate', 'draw', 'shape', 'icon', 'text', 'mask', 'filter'], initMenu: false, @@ -5246,6 +5260,7 @@ return /******/ (function(modules) { // webpackBootstrap // submenu ui instance _this[menuName] = new SubComponentClass(_this._subMenuElement, { + locale: _this._locale, iconStyle: _this.theme.getStyle('submenu.icon'), menuBarPosition: _this.options.menuBarPosition }); @@ -5276,11 +5291,13 @@ return /******/ (function(modules) { // webpackBootstrap selectedElement.classList.add('tui-image-editor-container'); selectedElement.innerHTML = (0, _controls2.default)({ + locale: this._locale, biImage: this.theme.getStyle('common.bi'), iconStyle: this.theme.getStyle('menu.icon'), loadButtonStyle: this.theme.getStyle('loadButton'), downloadButtonStyle: this.theme.getStyle('downloadButton') }) + (0, _mainContainer2.default)({ + locale: this._locale, biImage: this.theme.getStyle('common.bi'), commonStyle: this.theme.getStyle('common'), headerStyle: this.theme.getStyle('header'), @@ -5319,9 +5336,9 @@ return /******/ (function(modules) { // webpackBootstrap btnElement.id = 'tie-btn-' + menuName; btnElement.className = 'tui-image-editor-item normal'; - btnElement.title = menuName.replace(/^[a-z]/g, function ($0) { + btnElement.title = this._locale.localize(menuName.replace(/^[a-z]/g, function ($0) { return $0.toUpperCase(); - }); + })); btnElement.innerHTML = menuItemHtml; this._menuElement.appendChild(btnElement); @@ -5637,41 +5654,43 @@ return /******/ (function(modules) { // webpackBootstrap /* 75 */ /***/ (function(module, exports) { - "use strict"; + 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = function (_ref) { - var biImage = _ref.biImage, + var locale = _ref.locale, + biImage = _ref.biImage, commonStyle = _ref.commonStyle, headerStyle = _ref.headerStyle, loadButtonStyle = _ref.loadButtonStyle, downloadButtonStyle = _ref.downloadButtonStyle, submenuStyle = _ref.submenuStyle; - return "\n
    \n
    \n
    \n \n
    \n
    \n \n \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n"; + return '\n
    \n
    \n \n
    \n \n \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n'; }; /***/ }), /* 76 */ /***/ (function(module, exports) { - "use strict"; + 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = function (_ref) { - var biImage = _ref.biImage, + var locale = _ref.locale, + biImage = _ref.biImage, _ref$iconStyle = _ref.iconStyle, normal = _ref$iconStyle.normal, hover = _ref$iconStyle.hover, disabled = _ref$iconStyle.disabled, loadButtonStyle = _ref.loadButtonStyle, downloadButtonStyle = _ref.downloadButtonStyle; - return "\n
    \n
    \n \n
    \n
      \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    \n\n
    \n \n \n
    \n
    \n"; + return '\n
    \n \n
      \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    \n\n
    \n \n \n
    \n
    \n'; }; /***/ }), @@ -6196,12 +6215,14 @@ return /******/ (function(modules) { // webpackBootstrap _inherits(Shape, _Submenu); function Shape(subMenuElement, _ref) { - var iconStyle = _ref.iconStyle, + var locale = _ref.locale, + iconStyle = _ref.iconStyle, menuBarPosition = _ref.menuBarPosition; _classCallCheck(this, Shape); var _this = _possibleConstructorReturn(this, (Shape.__proto__ || Object.getPrototypeOf(Shape)).call(this, subMenuElement, { + locale: locale, name: 'shape', iconStyle: iconStyle, menuBarPosition: menuBarPosition, @@ -10095,8 +10116,17 @@ return /******/ (function(modules) { // webpackBootstrap * @ignore */ var Submenu = function () { + /** + * @param {HTMLElement} subMenuElement - submenu dom element + * @param {Locale} locale - translate text + * @param {string} name - name of sub menu + * @param {Object} iconStyle - style of icon + * @param {string} menuBarPosition - position of menu + * @param {*} templateHtml - template for SubMenuElement + */ function Submenu(subMenuElement, _ref) { - var name = _ref.name, + var locale = _ref.locale, + name = _ref.name, iconStyle = _ref.iconStyle, menuBarPosition = _ref.menuBarPosition, templateHtml = _ref.templateHtml; @@ -10110,6 +10140,7 @@ return /******/ (function(modules) { // webpackBootstrap this.toggleDirection = menuBarPosition === 'top' ? 'down' : 'up'; this.colorPickerControls = []; this._makeSubMenuElement(subMenuElement, { + locale: locale, name: name, iconStyle: iconStyle, templateHtml: templateHtml @@ -10173,21 +10204,28 @@ return /******/ (function(modules) { // webpackBootstrap /** * Make submenu dom element - * @param {HTMLElement} subMenuElement - subment dom element + * @param {HTMLElement} subMenuElement - submenu dom element + * @param {Locale} locale - translate text + * @param {string} name - submenu name * @param {Object} iconStyle - icon style + * @param {*} templateHtml - template for SubMenuElement * @private */ }, { key: '_makeSubMenuElement', value: function _makeSubMenuElement(subMenuElement, _ref2) { - var name = _ref2.name, + var locale = _ref2.locale, + name = _ref2.name, iconStyle = _ref2.iconStyle, templateHtml = _ref2.templateHtml; var iconSubMenu = document.createElement('div'); iconSubMenu.className = 'tui-image-editor-menu-' + name; - iconSubMenu.innerHTML = templateHtml({ iconStyle: iconStyle }); + iconSubMenu.innerHTML = templateHtml({ + locale: locale, + iconStyle: iconStyle + }); subMenuElement.appendChild(iconSubMenu); } @@ -10202,17 +10240,24 @@ return /******/ (function(modules) { // webpackBootstrap /* 85 */ /***/ (function(module, exports) { - "use strict"; + 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); + /** + * @param {Locale} locale - Translate text + * @param {Object} normal - iconStyle + * @param {Object} active - iconStyle + * @returns {string} + */ exports.default = function (_ref) { - var _ref$iconStyle = _ref.iconStyle, + var locale = _ref.locale, + _ref$iconStyle = _ref.iconStyle, normal = _ref$iconStyle.normal, active = _ref$iconStyle.active; - return "\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n"; + return '\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'; }; /***/ }), @@ -10256,12 +10301,14 @@ return /******/ (function(modules) { // webpackBootstrap _inherits(Crop, _Submenu); function Crop(subMenuElement, _ref) { - var iconStyle = _ref.iconStyle, + var locale = _ref.locale, + iconStyle = _ref.iconStyle, menuBarPosition = _ref.menuBarPosition; _classCallCheck(this, Crop); var _this = _possibleConstructorReturn(this, (Crop.__proto__ || Object.getPrototypeOf(Crop)).call(this, subMenuElement, { + locale: locale, name: 'crop', iconStyle: iconStyle, menuBarPosition: menuBarPosition, @@ -10383,17 +10430,24 @@ return /******/ (function(modules) { // webpackBootstrap /* 87 */ /***/ (function(module, exports) { - "use strict"; + 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); + /** + * @param {Locale} locale - Translate text + * @param {Object} normal - iconStyle + * @param {Object} active - iconStyle + * @returns {string} + */ exports.default = function (_ref) { - var _ref$iconStyle = _ref.iconStyle, + var locale = _ref.locale, + _ref$iconStyle = _ref.iconStyle, normal = _ref$iconStyle.normal, active = _ref$iconStyle.active; - return "\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n \n \n \n \n \n
      \n
      \n \n \n \n \n \n
      \n
      • \n
    \n"; + return '\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n \n \n \n \n \n
      \n
      \n \n \n \n \n \n
      \n
      • \n
    \n'; }; /***/ }), @@ -10437,12 +10491,14 @@ return /******/ (function(modules) { // webpackBootstrap _inherits(Flip, _Submenu); function Flip(subMenuElement, _ref) { - var iconStyle = _ref.iconStyle, + var locale = _ref.locale, + iconStyle = _ref.iconStyle, menuBarPosition = _ref.menuBarPosition; _classCallCheck(this, Flip); var _this = _possibleConstructorReturn(this, (Flip.__proto__ || Object.getPrototypeOf(Flip)).call(this, subMenuElement, { + locale: locale, name: 'flip', iconStyle: iconStyle, menuBarPosition: menuBarPosition, @@ -10516,17 +10572,24 @@ return /******/ (function(modules) { // webpackBootstrap /* 89 */ /***/ (function(module, exports) { - "use strict"; + 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); + /** + * @param {Locale} locale - Translate text + * @param {Object} normal - iconStyle + * @param {Object} active - iconStyle + * @returns {string} + */ exports.default = function (_ref) { - var _ref$iconStyle = _ref.iconStyle, + var locale = _ref.locale, + _ref$iconStyle = _ref.iconStyle, normal = _ref$iconStyle.normal, active = _ref$iconStyle.active; - return "\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    \n"; + return '\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    \n'; }; /***/ }), @@ -10578,12 +10641,14 @@ return /******/ (function(modules) { // webpackBootstrap _inherits(Rotate, _Submenu); function Rotate(subMenuElement, _ref) { - var iconStyle = _ref.iconStyle, + var locale = _ref.locale, + iconStyle = _ref.iconStyle, menuBarPosition = _ref.menuBarPosition; _classCallCheck(this, Rotate); var _this = _possibleConstructorReturn(this, (Rotate.__proto__ || Object.getPrototypeOf(Rotate)).call(this, subMenuElement, { + locale: locale, name: 'rotate', iconStyle: iconStyle, menuBarPosition: menuBarPosition, @@ -10660,17 +10725,24 @@ return /******/ (function(modules) { // webpackBootstrap /* 91 */ /***/ (function(module, exports) { - "use strict"; + 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); + /** + * @param {Locale} locale - Translate text + * @param {Object} normal - iconStyle + * @param {Object} active - iconStyle + * @returns {string} + */ exports.default = function (_ref) { - var _ref$iconStyle = _ref.iconStyle, + var locale = _ref.locale, + _ref$iconStyle = _ref.iconStyle, normal = _ref$iconStyle.normal, active = _ref$iconStyle.active; - return "\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n"; + return '\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'; }; /***/ }), @@ -10722,12 +10794,14 @@ return /******/ (function(modules) { // webpackBootstrap _inherits(Text, _Submenu); function Text(subMenuElement, _ref) { - var iconStyle = _ref.iconStyle, + var locale = _ref.locale, + iconStyle = _ref.iconStyle, menuBarPosition = _ref.menuBarPosition; _classCallCheck(this, Text); var _this = _possibleConstructorReturn(this, (Text.__proto__ || Object.getPrototypeOf(Text)).call(this, subMenuElement, { + locale: locale, name: 'text', iconStyle: iconStyle, menuBarPosition: menuBarPosition, @@ -10912,17 +10986,24 @@ return /******/ (function(modules) { // webpackBootstrap /* 93 */ /***/ (function(module, exports) { - "use strict"; + 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); + /** + * @param {Locale} locale - Translate text + * @param {Object} normal - iconStyle + * @param {Object} active - iconStyle + * @returns {string} + */ exports.default = function (_ref) { - var _ref$iconStyle = _ref.iconStyle, + var locale = _ref.locale, + _ref$iconStyle = _ref.iconStyle, normal = _ref$iconStyle.normal, active = _ref$iconStyle.active; - return "\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n"; + return '\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'; }; /***/ }), @@ -10966,12 +11047,14 @@ return /******/ (function(modules) { // webpackBootstrap _inherits(Mask, _Submenu); function Mask(subMenuElement, _ref) { - var iconStyle = _ref.iconStyle, + var locale = _ref.locale, + iconStyle = _ref.iconStyle, menuBarPosition = _ref.menuBarPosition; _classCallCheck(this, Mask); var _this = _possibleConstructorReturn(this, (Mask.__proto__ || Object.getPrototypeOf(Mask)).call(this, subMenuElement, { + locale: locale, name: 'mask', iconStyle: iconStyle, menuBarPosition: menuBarPosition, @@ -11049,17 +11132,24 @@ return /******/ (function(modules) { // webpackBootstrap /* 95 */ /***/ (function(module, exports) { - "use strict"; + 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); + /** + * @param {Locale} locale - Translate text + * @param {Object} normal - iconStyle + * @param {Object} active - iconStyle + * @returns {string} + */ exports.default = function (_ref) { - var _ref$iconStyle = _ref.iconStyle, + var locale = _ref.locale, + _ref$iconStyle = _ref.iconStyle, normal = _ref$iconStyle.normal, active = _ref$iconStyle.active; - return "\n
      \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n \n \n \n \n \n
      \n
      • \n
    \n"; + return '\n
      \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n \n \n \n \n \n
      \n
      • \n
    \n'; }; /***/ }), @@ -11111,12 +11201,14 @@ return /******/ (function(modules) { // webpackBootstrap _inherits(Icon, _Submenu); function Icon(subMenuElement, _ref) { - var iconStyle = _ref.iconStyle, + var locale = _ref.locale, + iconStyle = _ref.iconStyle, menuBarPosition = _ref.menuBarPosition; _classCallCheck(this, Icon); var _this = _possibleConstructorReturn(this, (Icon.__proto__ || Object.getPrototypeOf(Icon)).call(this, subMenuElement, { + locale: locale, name: 'icon', iconStyle: iconStyle, menuBarPosition: menuBarPosition, @@ -11276,17 +11368,24 @@ return /******/ (function(modules) { // webpackBootstrap /* 97 */ /***/ (function(module, exports) { - "use strict"; + 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); + /** + * @param {Locale} locale - Translate text + * @param {Object} normal - iconStyle + * @param {Object} active - iconStyle + * @returns {string} + */ exports.default = function (_ref) { - var _ref$iconStyle = _ref.iconStyle, + var locale = _ref.locale, + _ref$iconStyle = _ref.iconStyle, normal = _ref$iconStyle.normal, active = _ref$iconStyle.active; - return "\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    \n"; + return '\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    \n'; }; /***/ }), @@ -11343,12 +11442,14 @@ return /******/ (function(modules) { // webpackBootstrap _inherits(Draw, _Submenu); function Draw(subMenuElement, _ref) { - var iconStyle = _ref.iconStyle, + var locale = _ref.locale, + iconStyle = _ref.iconStyle, menuBarPosition = _ref.menuBarPosition; _classCallCheck(this, Draw); var _this = _possibleConstructorReturn(this, (Draw.__proto__ || Object.getPrototypeOf(Draw)).call(this, subMenuElement, { + locale: locale, name: 'draw', iconStyle: iconStyle, menuBarPosition: menuBarPosition, @@ -11499,17 +11600,24 @@ return /******/ (function(modules) { // webpackBootstrap /* 99 */ /***/ (function(module, exports) { - "use strict"; + 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); + /** + * @param {Locale} locale - Translate text + * @param {Object} normal - iconStyle + * @param {Object} active - iconStyle + * @returns {string} + */ exports.default = function (_ref) { - var _ref$iconStyle = _ref.iconStyle, + var locale = _ref.locale, + _ref$iconStyle = _ref.iconStyle, normal = _ref$iconStyle.normal, active = _ref$iconStyle.active; - return "\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n"; + return '\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'; }; /***/ }), @@ -11570,12 +11678,14 @@ return /******/ (function(modules) { // webpackBootstrap _inherits(Filter, _Submenu); function Filter(subMenuElement, _ref) { - var iconStyle = _ref.iconStyle, + var locale = _ref.locale, + iconStyle = _ref.iconStyle, menuBarPosition = _ref.menuBarPosition; _classCallCheck(this, Filter); var _this = _possibleConstructorReturn(this, (Filter.__proto__ || Object.getPrototypeOf(Filter)).call(this, subMenuElement, { + locale: locale, name: 'filter', iconStyle: iconStyle, menuBarPosition: menuBarPosition, @@ -11901,18 +12011,66 @@ return /******/ (function(modules) { // webpackBootstrap /* 101 */ /***/ (function(module, exports) { - "use strict"; + 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); - exports.default = function () { - return "\n
      \n
    • \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n\n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      • \n
    \n"; + /** + * @param {Locale} locale - Translate text + * @returns {string} + */ + exports.default = function (_ref) { + var locale = _ref.locale; + return '\n
      \n
    • \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n\n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      • \n
    \n'; }; /***/ }), /* 102 */ +/***/ (function(module, exports) { + + "use strict"; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + /** + * Translate messages + */ + var Locale = function () { + function Locale(locale) { + _classCallCheck(this, Locale); + + this._locale = locale; + } + + /** + * localize message + * @param {string} message - message who will be localized + * @returns {string} + */ + + + _createClass(Locale, [{ + key: "localize", + value: function localize(message) { + return this._locale[message] || message; + } + }]); + + return Locale; + }(); + + exports.default = Locale; + +/***/ }), +/* 103 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -11927,7 +12085,7 @@ return /******/ (function(modules) { // webpackBootstrap var _util2 = _interopRequireDefault(_util); - var _imagetracer = __webpack_require__(103); + var _imagetracer = __webpack_require__(104); var _imagetracer2 = _interopRequireDefault(_imagetracer); @@ -12499,7 +12657,7 @@ return /******/ (function(modules) { // webpackBootstrap }; /***/ }), -/* 103 */ +/* 104 */ /***/ (function(module, exports) { 'use strict'; @@ -13653,7 +13811,7 @@ return /******/ (function(modules) { // webpackBootstrap exports.default = ImageTracer; /***/ }), -/* 104 */ +/* 105 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -13672,67 +13830,67 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _fabric = __webpack_require__(105); + var _fabric = __webpack_require__(106); var _fabric2 = _interopRequireDefault(_fabric); - var _imageLoader = __webpack_require__(106); + var _imageLoader = __webpack_require__(107); var _imageLoader2 = _interopRequireDefault(_imageLoader); - var _cropper = __webpack_require__(108); + var _cropper = __webpack_require__(109); var _cropper2 = _interopRequireDefault(_cropper); - var _flip = __webpack_require__(110); + var _flip = __webpack_require__(111); var _flip2 = _interopRequireDefault(_flip); - var _rotation = __webpack_require__(111); + var _rotation = __webpack_require__(112); var _rotation2 = _interopRequireDefault(_rotation); - var _freeDrawing = __webpack_require__(112); + var _freeDrawing = __webpack_require__(113); var _freeDrawing2 = _interopRequireDefault(_freeDrawing); - var _line = __webpack_require__(113); + var _line = __webpack_require__(114); var _line2 = _interopRequireDefault(_line); - var _text = __webpack_require__(114); + var _text = __webpack_require__(115); var _text2 = _interopRequireDefault(_text); - var _icon = __webpack_require__(115); + var _icon = __webpack_require__(116); var _icon2 = _interopRequireDefault(_icon); - var _filter = __webpack_require__(116); + var _filter = __webpack_require__(117); var _filter2 = _interopRequireDefault(_filter); - var _shape = __webpack_require__(122); + var _shape = __webpack_require__(123); var _shape2 = _interopRequireDefault(_shape); - var _cropper3 = __webpack_require__(124); + var _cropper3 = __webpack_require__(125); var _cropper4 = _interopRequireDefault(_cropper3); - var _freeDrawing3 = __webpack_require__(126); + var _freeDrawing3 = __webpack_require__(127); var _freeDrawing4 = _interopRequireDefault(_freeDrawing3); - var _lineDrawing = __webpack_require__(127); + var _lineDrawing = __webpack_require__(128); var _lineDrawing2 = _interopRequireDefault(_lineDrawing); - var _shape3 = __webpack_require__(128); + var _shape3 = __webpack_require__(129); var _shape4 = _interopRequireDefault(_shape3); - var _text3 = __webpack_require__(129); + var _text3 = __webpack_require__(130); var _text4 = _interopRequireDefault(_text3); @@ -14402,14 +14560,13 @@ return /******/ (function(modules) { // webpackBootstrap /** * Get cropped rect - * @param {Object} mode cropzone rect mode - * @returns {Object} rect + * @param {number} [mode] cropzone rect mode */ }, { key: 'setCropzoneRect', value: function setCropzoneRect(mode) { - return this.getComponent(components.CROPPER).setCropzoneRect(mode); + this.getComponent(components.CROPPER).setCropzoneRect(mode); } /** @@ -15059,13 +15216,13 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Graphics; /***/ }), -/* 105 */ +/* 106 */ /***/ (function(module, exports) { - module.exports = __WEBPACK_EXTERNAL_MODULE_105__; + module.exports = __WEBPACK_EXTERNAL_MODULE_106__; /***/ }), -/* 106 */ +/* 107 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -15076,7 +15233,7 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _component = __webpack_require__(107); + var _component = __webpack_require__(108); var _component2 = _interopRequireDefault(_component); @@ -15197,7 +15354,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = ImageLoader; /***/ }), -/* 107 */ +/* 108 */ /***/ (function(module, exports) { "use strict"; @@ -15383,7 +15540,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Component; /***/ }), -/* 108 */ +/* 109 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -15394,15 +15551,15 @@ return /******/ (function(modules) { // webpackBootstrap var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); - var _fabric = __webpack_require__(105); + var _fabric = __webpack_require__(106); var _fabric2 = _interopRequireDefault(_fabric); - var _component = __webpack_require__(107); + var _component = __webpack_require__(108); var _component2 = _interopRequireDefault(_component); - var _cropzone = __webpack_require__(109); + var _cropzone = __webpack_require__(110); var _cropzone2 = _interopRequireDefault(_cropzone); @@ -15842,7 +15999,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Cropper; /***/ }), -/* 109 */ +/* 110 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -15851,7 +16008,7 @@ return /******/ (function(modules) { // webpackBootstrap var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet); - var _fabric = __webpack_require__(105); + var _fabric = __webpack_require__(106); var _fabric2 = _interopRequireDefault(_fabric); @@ -16307,7 +16464,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Cropzone; /***/ }), -/* 110 */ +/* 111 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -16322,7 +16479,7 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _component = __webpack_require__(107); + var _component = __webpack_require__(108); var _component2 = _interopRequireDefault(_component); @@ -16516,14 +16673,14 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Flip; /***/ }), -/* 111 */ +/* 112 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _fabric = __webpack_require__(105); + var _fabric = __webpack_require__(106); var _fabric2 = _interopRequireDefault(_fabric); @@ -16531,7 +16688,7 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _component = __webpack_require__(107); + var _component = __webpack_require__(108); var _component2 = _interopRequireDefault(_component); @@ -16663,18 +16820,18 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Rotation; /***/ }), -/* 112 */ +/* 113 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _fabric = __webpack_require__(105); + var _fabric = __webpack_require__(106); var _fabric2 = _interopRequireDefault(_fabric); - var _component = __webpack_require__(107); + var _component = __webpack_require__(108); var _component2 = _interopRequireDefault(_component); @@ -16776,18 +16933,18 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = FreeDrawing; /***/ }), -/* 113 */ +/* 114 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _fabric = __webpack_require__(105); + var _fabric = __webpack_require__(106); var _fabric2 = _interopRequireDefault(_fabric); - var _component = __webpack_require__(107); + var _component = __webpack_require__(108); var _component2 = _interopRequireDefault(_component); @@ -17000,14 +17157,14 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Line; /***/ }), -/* 114 */ +/* 115 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _fabric = __webpack_require__(105); + var _fabric = __webpack_require__(106); var _fabric2 = _interopRequireDefault(_fabric); @@ -17019,7 +17176,7 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _component = __webpack_require__(107); + var _component = __webpack_require__(108); var _component2 = _interopRequireDefault(_component); @@ -17786,14 +17943,14 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Text; /***/ }), -/* 115 */ +/* 116 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _fabric = __webpack_require__(105); + var _fabric = __webpack_require__(106); var _fabric2 = _interopRequireDefault(_fabric); @@ -17805,7 +17962,7 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _component = __webpack_require__(107); + var _component = __webpack_require__(108); var _component2 = _interopRequireDefault(_component); @@ -18008,7 +18165,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Icon; /***/ }), -/* 116 */ +/* 117 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -18021,15 +18178,15 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _fabric = __webpack_require__(105); + var _fabric = __webpack_require__(106); var _fabric2 = _interopRequireDefault(_fabric); - var _component = __webpack_require__(107); + var _component = __webpack_require__(108); var _component2 = _interopRequireDefault(_component); - var _mask = __webpack_require__(117); + var _mask = __webpack_require__(118); var _mask2 = _interopRequireDefault(_mask); @@ -18037,19 +18194,19 @@ return /******/ (function(modules) { // webpackBootstrap var _consts2 = _interopRequireDefault(_consts); - var _blur = __webpack_require__(118); + var _blur = __webpack_require__(119); var _blur2 = _interopRequireDefault(_blur); - var _sharpen = __webpack_require__(119); + var _sharpen = __webpack_require__(120); var _sharpen2 = _interopRequireDefault(_sharpen); - var _emboss = __webpack_require__(120); + var _emboss = __webpack_require__(121); var _emboss2 = _interopRequireDefault(_emboss); - var _colorFilter = __webpack_require__(121); + var _colorFilter = __webpack_require__(122); var _colorFilter2 = _interopRequireDefault(_colorFilter); @@ -18330,12 +18487,12 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Filter; /***/ }), -/* 117 */ +/* 118 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _fabric = __webpack_require__(105); + var _fabric = __webpack_require__(106); var _fabric2 = _interopRequireDefault(_fabric); @@ -18441,12 +18598,12 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Mask; /***/ }), -/* 118 */ +/* 119 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _fabric = __webpack_require__(105); + var _fabric = __webpack_require__(106); var _fabric2 = _interopRequireDefault(_fabric); @@ -18483,12 +18640,12 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Blur; /***/ }), -/* 119 */ +/* 120 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _fabric = __webpack_require__(105); + var _fabric = __webpack_require__(106); var _fabric2 = _interopRequireDefault(_fabric); @@ -18525,12 +18682,12 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Sharpen; /***/ }), -/* 120 */ +/* 121 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _fabric = __webpack_require__(105); + var _fabric = __webpack_require__(106); var _fabric2 = _interopRequireDefault(_fabric); @@ -18567,12 +18724,12 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Emboss; /***/ }), -/* 121 */ +/* 122 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; - var _fabric = __webpack_require__(105); + var _fabric = __webpack_require__(106); var _fabric2 = _interopRequireDefault(_fabric); @@ -18685,14 +18842,14 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = ColorFilter; /***/ }), -/* 122 */ +/* 123 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _fabric = __webpack_require__(105); + var _fabric = __webpack_require__(106); var _fabric2 = _interopRequireDefault(_fabric); @@ -18700,7 +18857,7 @@ return /******/ (function(modules) { // webpackBootstrap var _promise2 = _interopRequireDefault(_promise); - var _component = __webpack_require__(107); + var _component = __webpack_require__(108); var _component2 = _interopRequireDefault(_component); @@ -18708,7 +18865,7 @@ return /******/ (function(modules) { // webpackBootstrap var _consts2 = _interopRequireDefault(_consts); - var _shapeResizeHelper = __webpack_require__(123); + var _shapeResizeHelper = __webpack_require__(124); var _shapeResizeHelper2 = _interopRequireDefault(_shapeResizeHelper); @@ -19186,7 +19343,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = Shape; /***/ }), -/* 123 */ +/* 124 */ /***/ (function(module, exports) { 'use strict'; @@ -19447,14 +19604,14 @@ return /******/ (function(modules) { // webpackBootstrap }; /***/ }), -/* 124 */ +/* 125 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _drawingMode = __webpack_require__(125); + var _drawingMode = __webpack_require__(126); var _drawingMode2 = _interopRequireDefault(_drawingMode); @@ -19527,7 +19684,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = CropperDrawingMode; /***/ }), -/* 125 */ +/* 126 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -19609,14 +19766,14 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = DrawingMode; /***/ }), -/* 126 */ +/* 127 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _drawingMode = __webpack_require__(125); + var _drawingMode = __webpack_require__(126); var _drawingMode2 = _interopRequireDefault(_drawingMode); @@ -19690,14 +19847,14 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = FreeDrawingMode; /***/ }), -/* 127 */ +/* 128 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _drawingMode = __webpack_require__(125); + var _drawingMode = __webpack_require__(126); var _drawingMode2 = _interopRequireDefault(_drawingMode); @@ -19771,14 +19928,14 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = LineDrawingMode; /***/ }), -/* 128 */ +/* 129 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _drawingMode = __webpack_require__(125); + var _drawingMode = __webpack_require__(126); var _drawingMode2 = _interopRequireDefault(_drawingMode); @@ -19851,14 +20008,14 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = ShapeDrawingMode; /***/ }), -/* 129 */ +/* 130 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); - var _drawingMode = __webpack_require__(125); + var _drawingMode = __webpack_require__(126); var _drawingMode2 = _interopRequireDefault(_drawingMode); @@ -19931,14 +20088,14 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = TextDrawingMode; /***/ }), -/* 130 */ +/* 131 */ /***/ (function(module, exports) { // removed by extract-text-webpack-plugin /***/ }), -/* 131 */, -/* 132 */ +/* 132 */, +/* 133 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -20007,7 +20164,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 133 */ +/* 134 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -20066,7 +20223,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 134 */ +/* 135 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -20133,7 +20290,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 135 */ +/* 136 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -20209,7 +20366,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 136 */ +/* 137 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -20284,7 +20441,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 137 */ +/* 138 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -20376,7 +20533,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 138 */ +/* 139 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -20455,7 +20612,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 139 */ +/* 140 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -20547,7 +20704,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 140 */ +/* 141 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -20620,7 +20777,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 141 */ +/* 142 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -20709,7 +20866,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 142 */ +/* 143 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -20767,7 +20924,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 143 */ +/* 144 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -20824,7 +20981,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 144 */ +/* 145 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -20912,7 +21069,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 145 */ +/* 146 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -20972,7 +21129,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 146 */ +/* 147 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -21035,7 +21192,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 147 */ +/* 148 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -21100,7 +21257,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 148 */ +/* 149 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -21160,7 +21317,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 149 */ +/* 150 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; @@ -21247,7 +21404,7 @@ return /******/ (function(modules) { // webpackBootstrap module.exports = command; /***/ }), -/* 150 */ +/* 151 */ /***/ (function(module, exports, __webpack_require__) { 'use strict'; diff --git a/dist/tui-image-editor.min.css b/dist/tui-image-editor.min.css index f66cd3ffa..4cf11bdb2 100644 --- a/dist/tui-image-editor.min.css +++ b/dist/tui-image-editor.min.css @@ -1,7 +1,7 @@ /*! * tui-image-editor.min.js - * @version 3.3.0 + * @version 3.3.1 * @author NHNEnt FE Development Lab * @license MIT */ -body>textarea{position:fixed!important}.tui-image-editor-container{marign:0;padding:0;box-sizing:border-box;min-height:300px;height:100%;position:relative;background-color:#282828;overflow:hidden;letter-spacing:.3px}.tui-image-editor-container div,.tui-image-editor-container input,.tui-image-editor-container label,.tui-image-editor-container li,.tui-image-editor-container ul{box-sizing:border-box;margin:0;padding:0;-ms-user-select:none;-moz-user-select:-moz-none;-khtml-user-select:none;-webkit-user-select:none;user-select:none}.tui-image-editor-container .tui-image-editor-header{min-width:533px;position:absolute;background-color:#151515;top:0;width:100%}.tui-image-editor-container .tui-image-editor-controls-buttons,.tui-image-editor-container .tui-image-editor-header-buttons{float:right;margin:8px}.tui-image-editor-container .tui-image-editor-controls-logo,.tui-image-editor-container .tui-image-editor-header-logo{float:left;width:30%;padding:17px}.tui-image-editor-container .tui-image-editor-controls-buttons,.tui-image-editor-container .tui-image-editor-controls-logo{width:270px;height:100%;display:none}.tui-image-editor-container .tui-image-editor-controls-buttons button,.tui-image-editor-container .tui-image-editor-header-buttons button{position:relative;width:120px;height:40px;padding:0;line-height:40px;outline:none;border-radius:20px;border:1px solid #ddd;font-family:Noto Sans,sans-serif;font-size:12px;font-weight:700;cursor:pointer;vertical-align:middle;letter-spacing:.3px}.tui-image-editor-container .tui-image-editor-download-btn{background-color:#fdba3b;border-color:#fdba3b;color:#fff}.tui-image-editor-container .tui-image-editor-load-btn{position:absolute;left:0;right:0;display:inline-block;top:0;bottom:0;width:100%;cursor:pointer;opacity:0}.tui-image-editor-container .tui-image-editor-main-container{position:absolute;width:100%;top:0;bottom:64px}.tui-image-editor-container .tui-image-editor-main{position:absolute;text-align:center;top:64px;bottom:0;right:0;left:0}.tui-image-editor-container .tui-image-editor-wrap{bottom:0;width:100%;overflow:auto}.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap{display:table;width:100%;height:100%}.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap .tui-image-editor-align-wrap{display:table-cell;vertical-align:middle}.tui-image-editor-container .tui-image-editor{position:relative;display:inline-block}.tui-image-editor-container .tui-image-editor-menu{width:auto;list-style:none;padding:0;margin:0 auto;display:table-cell;text-align:center;vertical-align:middle;white-space:nowrap}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item{position:relative;display:inline-block;border-radius:2px;padding:7px 8px 3px;cursor:pointer;margin:0 4px}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item[title]:hover:before{content:"";display:inline-block;margin:0 auto;width:0;height:0;border-right:7px solid transparent;border-top:7px solid #2f2f2f;border-left:7px solid transparent;position:absolute;left:13px;top:-2px}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item[title]:hover:after{content:attr(title);position:absolute;display:inline-block;background-color:#2f2f2f;color:#fff;padding:5px 8px;font-size:11px;font-weight:lighter;border-radius:3px;max-height:23px;top:-22px;left:0;min-width:24px}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item.active{background-color:#fff;transition:all .3s ease}.tui-image-editor-container .tui-image-editor-wrap{position:absolute}.tui-image-editor-container .tui-image-editor-grid-visual{display:none;position:absolute;width:100%;height:100%;border:1px solid hsla(0,0%,100%,.7)}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor{transition:none}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-grid-visual,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-grid-visual{display:block}.tui-image-editor-container .tui-image-editor-grid-visual table{width:100%;height:100%;border-collapse:collapse}.tui-image-editor-container .tui-image-editor-grid-visual table td{border:1px solid hsla(0,0%,100%,.3)}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot:before{content:"";position:absolute;box-sizing:border-box;width:10px;height:10px;border:0;box-shadow:0 0 1px 0 rgba(0,0,0,.3);border-radius:100%;background-color:#fff}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-top:before{top:-5px;left:-5px}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-top:before{top:-5px;right:-5px}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-bottom:before{bottom:-5px;left:-5px}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-bottom:before{bottom:-5px;right:-5px}.tui-image-editor-container .tui-image-editor-submenu{display:none;position:absolute;bottom:0;width:100%;height:150px;white-space:nowrap;z-index:2}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover svg>use.active{display:block}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item li{display:inline-block;vertical-align:top}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-newline{display:block;margin-top:0}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button{position:relative;cursor:pointer;display:inline-block;font-weight:400;font-size:11px;margin:0 9px}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.preset{margin:0 9px 20px 5px}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item label{display:inline-block;cursor:pointer;padding-top:5px;font-family:Noto Sans,sans-serif;font-size:11px}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.apply label,.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.cancel label{vertical-align:7px}.tui-image-editor-container .tui-image-editor-submenu>div{display:none;vertical-align:bottom}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-style{opacity:.95;z-index:-1;position:absolute;top:0;bottom:0;left:0;right:0;display:block}.tui-image-editor-container .tui-image-editor-partition>div{width:1px;height:52px;border-left:1px solid #3c3c3c;margin:0 8px}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-partition>div{height:108px;margin:0 29px 0 0}.tui-image-editor-container .tui-image-editor-submenu-align{text-align:left;margin-right:30px}.tui-image-editor-container .tui-image-editor-submenu-align label{width:55px;white-space:nowrap}.tui-image-editor-container .tui-image-editor-submenu-align:first-child{margin-right:0}.tui-image-editor-container .tui-image-editor-submenu-align:first-child label{width:70px}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-crop .tui-image-editor-submenu>div.tui-image-editor-menu-crop,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-draw .tui-image-editor-submenu>div.tui-image-editor-menu-draw,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-submenu>div.tui-image-editor-menu-filter,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-submenu>div.tui-image-editor-menu-flip,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-icon .tui-image-editor-submenu>div.tui-image-editor-menu-icon,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-mask .tui-image-editor-submenu>div.tui-image-editor-menu-mask,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-submenu>div.tui-image-editor-menu-rotate,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-shape .tui-image-editor-submenu>div.tui-image-editor-menu-shape,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-text .tui-image-editor-submenu>div.tui-image-editor-menu-text{display:table-cell}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-crop .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-draw .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-icon .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-mask .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-shape .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-text .tui-image-editor-submenu{display:table}.tui-image-editor-container .filter-color-item{display:inline-block}.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox{display:block}.tui-image-editor-container .tui-image-editor-checkbox-wrap{display:inline-block!important;text-align:left}.tui-image-editor-container .tui-image-editor-checkbox-wrap.fixed-width{width:187px;white-space:normal}.tui-image-editor-container .tui-image-editor-checkbox{display:inline-block;margin:1px 0}.tui-image-editor-container .tui-image-editor-checkbox input{width:14px;height:14px;opacity:0}.tui-image-editor-container .tui-image-editor-checkbox input+label{color:#fff;height:14px;position:relative}.tui-image-editor-container .tui-image-editor-checkbox input+label:before{content:"";position:absolute;width:14px;height:14px;background-color:#fff;top:6px;left:-19px;display:inline-block;margin:0;text-align:center;font-size:11px;border:0;border-radius:2px;padding-top:1px;box-sizing:border-box}.tui-image-editor-container .tui-image-editor-checkbox input[type=checkbox]:checked+label:before{background-size:cover;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAMBJREFUKBWVkjEOwjAMRe2WgZW7IIHEDdhghhuwcQ42rlJugAQS54Cxa5cq1QM5TUpByZfS2j9+dlJVt/tX5ZxbS4ZU9VLkQvSHKTIGRaVJYFmKrBbTCJxE2UgCdDzMZDkHrOV6b95V0US6UmgKodujEZbJg0B0ZgEModO5lrY1TMQf1TpyJGBEjD+E2NPN7ukIUDiF/BfEXgRiGEw8NgkffYGYwCi808fpn/6OvfUfsDr/Vc1IfRf8sKnFVqeiVQfDu0tf/nWH9gAAAABJRU5ErkJggg==")}.tui-image-editor-container .tui-image-editor-selectlist-wrap{position:relative}.tui-image-editor-container .tui-image-editor-selectlist-wrap select{width:100%;height:28px;margin-top:4px;border:0;outline:0;border-radius:0;border:1px solid #cbdbdb;background-color:#fff;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0 7px 0 10px}.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist{display:none;position:relative;top:-1px;border:1px solid #ccc;background-color:#fff;border-top:0;padding:4px 0}.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist li{display:block;text-align:left;padding:7px 10px;font-family:Noto Sans,sans-serif}.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist li:hover{background-color:rgba(81,92,230,.05)}.tui-image-editor-container .tui-image-editor-selectlist-wrap:before{content:"";position:absolute;display:inline-block;width:14px;height:14px;right:5px;top:10px;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAHlJREFUKBVjYBgFOEOAEVkmPDxc89+/f6eAYjzI4kD2FyYmJrOVK1deh4kzwRggGiQBVJCELAZig8SQNYHEmEEEMrh69eo1HR0dfqCYJUickZGxf9WqVf3IakBsFBthklpaWmVA9mEQhrJhUoTp0NBQCRAmrHL4qgAAuu4cWZOZIGsAAAAASUVORK5CYII=");background-size:cover}.tui-image-editor-container .tui-image-editor-selectlist-wrap select::-ms-expand{display:none}.tui-image-editor-container .tui-image-editor-virtual-range-bar .tui-image-editor-disabled,.tui-image-editor-container .tui-image-editor-virtual-range-pointer .tui-image-editor-disabled,.tui-image-editor-container .tui-image-editor-virtual-range-subbar .tui-image-editor-disabled{backbround-color:red}.tui-image-editor-container .tui-image-editor-range{position:relative;top:5px;width:166px;height:17px;display:inline-block}.tui-image-editor-container .tui-image-editor-virtual-range-bar{top:7px;position:absolute;width:100%;height:2px;background-color:#666}.tui-image-editor-container .tui-image-editor-virtual-range-subbar{position:absolute;height:100%;left:0;right:0;background-color:#d1d1d1}.tui-image-editor-container .tui-image-editor-virtual-range-pointer{position:absolute;cursor:pointer;top:-5px;left:0;width:12px;height:12px;background-color:#fff;border-radius:100%}.tui-image-editor-container .tui-image-editor-range-wrap{display:inline-block;margin-left:4px}.tui-image-editor-container .tui-image-editor-range-wrap.short .tui-image-editor-range{width:100px}.tui-image-editor-container .color-picker-control .tui-image-editor-range{width:108px;margin-left:10px}.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-pointer{background-color:#333}.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-bar{background-color:#ccc}.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-subbar{background-color:#606060}.tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short{margin-top:-2px;margin-left:19px}.tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label{color:#8e8e8e;font-weight:400}.tui-image-editor-container .tui-image-editor-range-wrap label{vertical-align:baseline;font-size:11px;margin-right:7px;color:#fff}.tui-image-editor-container .tui-image-editor-range-value{cursor:default;width:40px;height:24px;outline:none;border-radius:2px;box-shadow:none;border:1px solid #d5d5d5;text-align:center;background-color:#1c1c1c;color:#fff;font-weight:lighter;vertical-align:baseline;font-family:Noto Sans,sans-serif;margin-top:21px;margin-left:4px}.tui-image-editor-container .tui-image-editor-controls{position:absolute;background-color:#151515;width:100%;height:64px;display:table;bottom:0;z-index:2}.tui-image-editor-container .tui-image-editor-icpartition{display:inline-block;background-color:#282828;width:1px;height:24px}.tui-image-editor-container.left .tui-image-editor-menu>.tui-image-editor-item[title]:before{left:28px;top:11px;border-right:7px solid #2f2f2f;border-top:7px solid transparent;border-bottom:7px solid transparent}.tui-image-editor-container.left .tui-image-editor-menu>.tui-image-editor-item[title]:after{top:7px;left:39px;width:27px}.tui-image-editor-container.left .tui-image-editor-submenu{left:0;height:100%;width:248px}.tui-image-editor-container.left .tui-image-editor-main-container{left:64px;width:calc(100% - 64px);height:100%}.tui-image-editor-container.left .tui-image-editor-controls{width:64px;height:100%;display:table}.tui-image-editor-container.left .tui-image-editor-menu,.tui-image-editor-container.right .tui-image-editor-menu{white-space:inherit}.tui-image-editor-container.left .tui-image-editor-submenu,.tui-image-editor-container.right .tui-image-editor-submenu{white-space:normal}.tui-image-editor-container.left .tui-image-editor-submenu>div,.tui-image-editor-container.right .tui-image-editor-submenu>div{vertical-align:middle}.tui-image-editor-container.left .tui-image-editor-controls li,.tui-image-editor-container.right .tui-image-editor-controls li{display:inline-block;margin:4px auto}.tui-image-editor-container.left .tui-image-editor-icpartition,.tui-image-editor-container.right .tui-image-editor-icpartition{position:relative;top:-7px;width:24px;height:1px}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition{display:block;width:75%;margin:auto}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition>div,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition>div{border-left:0;height:10px;border-bottom:1px solid #3c3c3c;width:100%;margin:0}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-align,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-align{margin-right:0}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-item li,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-item li{margin-top:15px}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-colorpicker-clearfix li,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-colorpicker-clearfix li{margin-top:0}.tui-image-editor-container.left .tui-image-editor-checkbox-wrap.fixed-width,.tui-image-editor-container.right .tui-image-editor-checkbox-wrap.fixed-width{width:182px;white-space:normal}.tui-image-editor-container.left .tui-image-editor-range-wrap.tui-image-editor-newline label.range,.tui-image-editor-container.right .tui-image-editor-range-wrap.tui-image-editor-newline label.range{display:block;text-align:left;width:75%;margin:auto}.tui-image-editor-container.left .tui-image-editor-range,.tui-image-editor-container.right .tui-image-editor-range{width:136px}.tui-image-editor-container.right .tui-image-editor-menu>.tui-image-editor-item[title]:before{left:-3px;top:11px;border-left:7px solid #2f2f2f;border-top:7px solid transparent;border-bottom:7px solid transparent}.tui-image-editor-container.right .tui-image-editor-menu>.tui-image-editor-item[title]:after{top:7px;left:-44px;width:27px}.tui-image-editor-container.right .tui-image-editor-submenu{right:0;height:100%;width:248px}.tui-image-editor-container.right .tui-image-editor-main-container{right:64px;width:calc(100% - 64px);height:100%}.tui-image-editor-container.right .tui-image-editor-controls{right:0;width:64px;height:100%;display:table}.tui-image-editor-container.bottom .tui-image-editor-submenu .tui-image-editor-partition.only-left-right,.tui-image-editor-container.top .tui-image-editor-submenu .tui-image-editor-partition.only-left-right{display:none}.tui-image-editor-container.bottom .tui-image-editor-submenu>div{padding-bottom:24px}.tui-image-editor-container.top .color-picker-control .triangle{top:-8px;border-right:7px solid transparent;border-top:0;border-left:7px solid transparent;border-bottom:8px solid #fff}.tui-image-editor-container.top .tui-image-editor-size-wrap{height:100%}.tui-image-editor-container.top .tui-image-editor-main-container{bottom:0}.tui-image-editor-container.top .tui-image-editor-menu>.tui-image-editor-item[title]:before{left:13px;border-top:0;border-bottom:7px solid #2f2f2f;top:33px}.tui-image-editor-container.top .tui-image-editor-menu>.tui-image-editor-item[title]:after{top:38px}.tui-image-editor-container.top .tui-image-editor-submenu{top:0;bottom:inherit}.tui-image-editor-container.top .tui-image-editor-submenu>div{padding-top:24px;vertical-align:top}.tui-image-editor-container.top .tui-image-editor-controls-buttons,.tui-image-editor-container.top .tui-image-editor-controls-logo{display:table-cell}.tui-image-editor-container.top .tui-image-editor-main{top:64px;height:calc(100% - 64px)}.tui-image-editor-container.top .tui-image-editor-controls{top:0;bottom:inherit}.tui-image-editor-container #tie-icon-add-button .tui-image-editor-button{min-width:42px}.tui-image-editor-container .svg_ic-menu{width:24px;height:24px}.tui-image-editor-container .svg_ic-submenu{width:32px;height:32px}.tui-image-editor-container .svg_img-bi{width:257px;height:26px}.tui-image-editor-container .tui-image-editor-controls svg>use{display:none}.tui-image-editor-container .tui-image-editor-controls .enabled svg:hover>use.hover,.tui-image-editor-container .tui-image-editor-controls .normal svg:hover>use.hover{display:block}.tui-image-editor-container .tui-image-editor-controls .active svg:hover>use.hover{display:none}.tui-image-editor-container .tui-image-editor-controls .active svg>use.active,.tui-image-editor-container .tui-image-editor-controls .enabled svg>use.enabled,.tui-image-editor-container .tui-image-editor-controls svg>use.normal{display:block}.tui-image-editor-container .tui-image-editor-controls .active svg>use.normal,.tui-image-editor-container .tui-image-editor-controls .enabled svg>use.normal{display:none}.tui-image-editor-container .tui-image-editor-controls:hover{z-index:3}.tui-image-editor-container div.tui-colorpicker-clearfix{width:159px;height:28px;border:1px solid #d5d5d5;border-radius:2px;background-color:#f5f5f5;margin-top:6px;padding:4px 7px}.tui-image-editor-container .tui-colorpicker-palette-hex{width:114px;background-color:#f5f5f5;border:0;font-size:11px;margin-top:2px;font-family:Noto Sans,sans-serif}.tui-image-editor-container .tui-colorpicker-palette-hex[value=""]+.tui-colorpicker-palette-preview,.tui-image-editor-container .tui-colorpicker-palette-hex[value="#ffffff"]+.tui-colorpicker-palette-preview{border:1px solid #ccc}.tui-image-editor-container .tui-colorpicker-palette-hex[value=""]+.tui-colorpicker-palette-preview{background-size:cover;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAdBJREFUWAnFl0FuwjAQRZ0ukiugHqFSOQNdseuKW3ALzkA4BateICvUGyCxrtRFd4WuunH/TzykaYJrnLEYaTJJsP2+x8GZZCbQrLU5mj7Bn+EP8HvnCObd+R7xBV5lWfaNON4AnsA38E94qLEt+0yiFaBzAV/Bv+Cxxr4co7hKCDpw1q9wLeNYYdlAwyn8TYt8Hme3+8D5ozcTaMCZ68PXa2tnM2sbEcOZAJhrrpl2DAcTOGNjZPSfCdzkw6JrfbiMv+osBe4y9WOedhm4jZfhbENWuxS44H9Wz/xw4WzqLOAqh1+zycgAwzEMzr5k5gaHOa9ULBwuuDkFlHI1Kl4PJ66kgIpnoywOTmRFAYcbwYk9UMApWkD8zAV5ihcwHk4Rx7gl0IFTQL0EFc+CTQ9OZHWH3YhlVJiVpTHbrTGLhTHLZVgff6s9lyBsI9KduSS83oj+34rTwJutmBmCnMsvozRwZqB5GTkBw6/jdPDu69iJ6BYk6eCcfbcgcQIK/MByaaiMqm8rHcjol2TnpWDhyAKSGdA3FrxtJUToX0ODqatetfGE+8tyEUOV8GY5dGRwLP/MBS4RHQr4bT7NRAQjlcOTfZxmv2G+c4hI8nn+Ax5PG/zhI393AAAAAElFTkSuQmCC")}.tui-image-editor-container .tui-colorpicker-palette-preview{border-radius:100%;float:left;width:17px;height:17px;border:0}.tui-image-editor-container .color-picker-control{position:absolute;display:none;z-index:99;width:192px;background-color:#fff;box-shadow:0 3px 22px 6px rgba(0,0,0,.15);padding:16px;border-radius:2px}.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-toggle-slider{display:none}.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button{border:0;border-radius:100%;margin:2px;background-size:cover;font-size:1px}.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button[title=""],.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button[title="#ffffff"]{border:1px solid #ccc}.tui-image-editor-container .color-picker-control .triangle{width:0;height:0;border-right:7px solid transparent;border-top:8px solid #fff;border-left:7px solid transparent;position:absolute;bottom:-8px;left:84px}.tui-image-editor-container .color-picker-control .tui-colorpicker-container,.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-container,.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-container ul{width:100%;height:auto}.tui-image-editor-container .filter-color-item .color-picker-control label{font-color:#333;font-weight:400;margin-right:7pxleft}.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox{margin-top:0}.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox input+label:before{left:-16px}.tui-image-editor-container .color-picker{width:100%;height:auto}.tui-image-editor-container .color-picker-value{width:32px;height:32px;border:0;border-radius:100%;margin:auto;margin-bottom:1px}.tui-image-editor-container .color-picker-value.transparent{border:1px solid #cbcbcb;background-size:cover;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAdBJREFUWAnFl0FuwjAQRZ0ukiugHqFSOQNdseuKW3ALzkA4BateICvUGyCxrtRFd4WuunH/TzykaYJrnLEYaTJJsP2+x8GZZCbQrLU5mj7Bn+EP8HvnCObd+R7xBV5lWfaNON4AnsA38E94qLEt+0yiFaBzAV/Bv+Cxxr4co7hKCDpw1q9wLeNYYdlAwyn8TYt8Hme3+8D5ozcTaMCZ68PXa2tnM2sbEcOZAJhrrpl2DAcTOGNjZPSfCdzkw6JrfbiMv+osBe4y9WOedhm4jZfhbENWuxS44H9Wz/xw4WzqLOAqh1+zycgAwzEMzr5k5gaHOa9ULBwuuDkFlHI1Kl4PJ66kgIpnoywOTmRFAYcbwYk9UMApWkD8zAV5ihcwHk4Rx7gl0IFTQL0EFc+CTQ9OZHWH3YhlVJiVpTHbrTGLhTHLZVgff6s9lyBsI9KduSS83oj+34rTwJutmBmCnMsvozRwZqB5GTkBw6/jdPDu69iJ6BYk6eCcfbcgcQIK/MByaaiMqm8rHcjol2TnpWDhyAKSGdA3FrxtJUToX0ODqatetfGE+8tyEUOV8GY5dGRwLP/MBS4RHQr4bT7NRAQjlcOTfZxmv2G+c4hI8nn+Ax5PG/zhI393AAAAAElFTkSuQmCC")}.tui-image-editor-container .color-picker-value+label{color:#fff}.tui-image-editor-container .tui-image-editor-submenu svg>use{display:none}#tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype=icon-arrow-2] svg>use.active,#tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype=icon-arrow-3] svg>use.active,#tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype=icon-arrow] svg>use.active,#tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype=icon-bubble] svg>use.active,#tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype=icon-heart] svg>use.active,#tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype=icon-location] svg>use.active,#tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype=icon-polygon] svg>use.active,#tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype=icon-star] svg>use.active,.tui-image-editor-container .tui-image-editor-submenu svg>use.normal{display:block}#tie-draw-line-select-button.free .tui-image-editor-button.free svg>use.normal,#tie-draw-line-select-button.line .tui-image-editor-button.line svg>use.normal{display:none}#tie-draw-line-select-button.free .tui-image-editor-button.free svg>use.active,#tie-draw-line-select-button.line .tui-image-editor-button.line svg>use.active{display:block}#tie-flip-button.flipX .tui-image-editor-button.flipX svg>use.normal,#tie-flip-button.flipY .tui-image-editor-button.flipY svg>use.normal,#tie-flip-button.resetFlip .tui-image-editor-button.resetFlip svg>use.normal{display:none}#tie-flip-button.flipX .tui-image-editor-button.flipX svg>use.active,#tie-flip-button.flipY .tui-image-editor-button.flipY svg>use.active,#tie-flip-button.resetFlip .tui-image-editor-button.resetFlip svg>use.active{display:block}#tie-mask-apply.apply.active .tui-image-editor-button.apply label{color:#fff}#tie-mask-apply.apply.active .tui-image-editor-button.apply svg>use.active{display:block}#tie-crop-button .tui-image-editor-button.apply,#tie-crop-preset-button .tui-image-editor-button.apply{margin-right:24px}#tie-crop-button .tui-image-editor-button.apply.active svg>use.active,#tie-crop-button .tui-image-editor-button.preset.active svg>use.active,#tie-crop-preset-button .tui-image-editor-button.apply.active svg>use.active,#tie-crop-preset-button .tui-image-editor-button.preset.active svg>use.active{display:block}#tie-shape-button.circle .tui-image-editor-button.circle svg>use.normal,#tie-shape-button.rect .tui-image-editor-button.rect svg>use.normal,#tie-shape-button.triangle .tui-image-editor-button.triangle svg>use.normal{display:none}#tie-shape-button.circle .tui-image-editor-button.circle svg>use.active,#tie-shape-button.rect .tui-image-editor-button.rect svg>use.active,#tie-shape-button.triangle .tui-image-editor-button.triangle svg>use.active,#tie-text-align-button.center .tui-image-editor-button.center svg>use.active,#tie-text-align-button.left .tui-image-editor-button.left svg>use.active,#tie-text-align-button.right .tui-image-editor-button.right svg>use.active,#tie-text-effect-button .tui-image-editor-button.active svg>use.active{display:block}#tie-icon-image-file,#tie-mask-image-file{opacity:0;position:absolute;width:100%;height:100%;border:1px solid green;cursor:inherit;left:0;top:0}.tui-image-editor-container.top.tui-image-editor-top-optimization .tui-image-editor-controls ul{text-align:right}.tui-image-editor-container.top.tui-image-editor-top-optimization .tui-image-editor-controls-logo{display:none} \ No newline at end of file +body>textarea{position:fixed!important}.tui-image-editor-container{marign:0;padding:0;box-sizing:border-box;min-height:300px;height:100%;position:relative;background-color:#282828;overflow:hidden;letter-spacing:.3px}.tui-image-editor-container div,.tui-image-editor-container input,.tui-image-editor-container label,.tui-image-editor-container li,.tui-image-editor-container ul{box-sizing:border-box;margin:0;padding:0;-ms-user-select:none;-moz-user-select:-moz-none;-khtml-user-select:none;-webkit-user-select:none;user-select:none}.tui-image-editor-container .tui-image-editor-header{min-width:533px;position:absolute;background-color:#151515;top:0;width:100%}.tui-image-editor-container .tui-image-editor-controls-buttons,.tui-image-editor-container .tui-image-editor-header-buttons{float:right;margin:8px}.tui-image-editor-container .tui-image-editor-controls-logo,.tui-image-editor-container .tui-image-editor-header-logo{float:left;width:30%;padding:17px}.tui-image-editor-container .tui-image-editor-controls-buttons,.tui-image-editor-container .tui-image-editor-controls-logo{width:270px;height:100%;display:none}.tui-image-editor-container .tui-image-editor-controls-buttons button,.tui-image-editor-container .tui-image-editor-header-buttons button{position:relative;width:120px;height:40px;padding:0;line-height:40px;outline:none;border-radius:20px;border:1px solid #ddd;font-family:Noto Sans,sans-serif;font-size:12px;font-weight:700;cursor:pointer;vertical-align:middle;letter-spacing:.3px}.tui-image-editor-container .tui-image-editor-download-btn{background-color:#fdba3b;border-color:#fdba3b;color:#fff}.tui-image-editor-container .tui-image-editor-load-btn{position:absolute;left:0;right:0;display:inline-block;top:0;bottom:0;width:100%;cursor:pointer;opacity:0}.tui-image-editor-container .tui-image-editor-main-container{position:absolute;width:100%;top:0;bottom:64px}.tui-image-editor-container .tui-image-editor-main{position:absolute;text-align:center;top:64px;bottom:0;right:0;left:0}.tui-image-editor-container .tui-image-editor-wrap{bottom:0;width:100%;overflow:auto}.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap{display:table;width:100%;height:100%}.tui-image-editor-container .tui-image-editor-wrap .tui-image-editor-size-wrap .tui-image-editor-align-wrap{display:table-cell;vertical-align:middle}.tui-image-editor-container .tui-image-editor{position:relative;display:inline-block}.tui-image-editor-container .tui-image-editor-menu{width:auto;list-style:none;padding:0;margin:0 auto;display:table-cell;text-align:center;vertical-align:middle;white-space:nowrap}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item{position:relative;display:inline-block;border-radius:2px;padding:7px 8px 3px;cursor:pointer;margin:0 4px}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item[title]:hover:before{content:"";display:inline-block;margin:0 auto;width:0;height:0;border-right:7px solid transparent;border-top:7px solid #2f2f2f;border-left:7px solid transparent;position:absolute;left:13px;top:-2px}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item[title]:hover:after{content:attr(title);position:absolute;display:inline-block;background-color:#2f2f2f;color:#fff;padding:5px 8px;font-size:11px;font-weight:lighter;border-radius:3px;max-height:23px;top:-22px;left:0;min-width:24px}.tui-image-editor-container .tui-image-editor-menu>.tui-image-editor-item.active{background-color:#fff;transition:all .3s ease}.tui-image-editor-container .tui-image-editor-wrap{position:absolute}.tui-image-editor-container .tui-image-editor-grid-visual{display:none;position:absolute;width:100%;height:100%;border:1px solid hsla(0,0%,100%,.7)}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor{transition:none}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-grid-visual,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-grid-visual{display:block}.tui-image-editor-container .tui-image-editor-grid-visual table{width:100%;height:100%;border-collapse:collapse}.tui-image-editor-container .tui-image-editor-grid-visual table td{border:1px solid hsla(0,0%,100%,.3)}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot:before{content:"";position:absolute;box-sizing:border-box;width:10px;height:10px;border:0;box-shadow:0 0 1px 0 rgba(0,0,0,.3);border-radius:100%;background-color:#fff}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-top:before{top:-5px;left:-5px}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-top:before{top:-5px;right:-5px}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.left-bottom:before{bottom:-5px;left:-5px}.tui-image-editor-container .tui-image-editor-grid-visual table td.dot.right-bottom:before{bottom:-5px;right:-5px}.tui-image-editor-container .tui-image-editor-submenu{display:none;position:absolute;bottom:0;width:100%;height:150px;white-space:nowrap;z-index:2}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover svg>use.active{display:block}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item li{display:inline-block;vertical-align:top}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-newline{display:block;margin-top:0}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button{position:relative;cursor:pointer;display:inline-block;font-weight:400;font-size:11px;margin:0 9px}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.preset{margin:0 9px 20px 5px}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item label{display:inline-block;cursor:pointer;padding-top:5px;font-family:Noto Sans,sans-serif;font-size:11px}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.apply label,.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-image-editor-button.cancel label{vertical-align:7px}.tui-image-editor-container .tui-image-editor-submenu>div{display:none;vertical-align:bottom}.tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-submenu-style{opacity:.95;z-index:-1;position:absolute;top:0;bottom:0;left:0;right:0;display:block}.tui-image-editor-container .tui-image-editor-partition>div{width:1px;height:52px;border-left:1px solid #3c3c3c;margin:0 8px}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-partition>div{height:108px;margin:0 29px 0 0}.tui-image-editor-container .tui-image-editor-submenu-align{text-align:left;margin-right:30px}.tui-image-editor-container .tui-image-editor-submenu-align label{width:55px;white-space:nowrap}.tui-image-editor-container .tui-image-editor-submenu-align:first-child{margin-right:0}.tui-image-editor-container .tui-image-editor-submenu-align:first-child label{width:70px}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-crop .tui-image-editor-submenu>div.tui-image-editor-menu-crop,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-draw .tui-image-editor-submenu>div.tui-image-editor-menu-draw,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-submenu>div.tui-image-editor-menu-filter,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-submenu>div.tui-image-editor-menu-flip,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-icon .tui-image-editor-submenu>div.tui-image-editor-menu-icon,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-mask .tui-image-editor-submenu>div.tui-image-editor-menu-mask,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-submenu>div.tui-image-editor-menu-rotate,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-shape .tui-image-editor-submenu>div.tui-image-editor-menu-shape,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-text .tui-image-editor-submenu>div.tui-image-editor-menu-text{display:table-cell}.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-crop .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-draw .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-filter .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-flip .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-icon .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-mask .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-rotate .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-shape .tui-image-editor-submenu,.tui-image-editor-container .tui-image-editor-main.tui-image-editor-menu-text .tui-image-editor-submenu{display:table}.tui-image-editor-container .filter-color-item{display:inline-block}.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox{display:block}.tui-image-editor-container .tui-image-editor-checkbox-wrap{display:inline-block!important;text-align:left}.tui-image-editor-container .tui-image-editor-checkbox-wrap.fixed-width{width:187px;white-space:normal}.tui-image-editor-container .tui-image-editor-checkbox{display:inline-block;margin:1px 0}.tui-image-editor-container .tui-image-editor-checkbox input{width:14px;height:14px;opacity:0}.tui-image-editor-container .tui-image-editor-checkbox input+label{color:#fff;height:14px;position:relative}.tui-image-editor-container .tui-image-editor-checkbox input+label:before{content:"";position:absolute;width:14px;height:14px;background-color:#fff;top:6px;left:-19px;display:inline-block;margin:0;text-align:center;font-size:11px;border:0;border-radius:2px;padding-top:1px;box-sizing:border-box}.tui-image-editor-container .tui-image-editor-checkbox input[type=checkbox]:checked+label:before{background-size:cover;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAMBJREFUKBWVkjEOwjAMRe2WgZW7IIHEDdhghhuwcQ42rlJugAQS54Cxa5cq1QM5TUpByZfS2j9+dlJVt/tX5ZxbS4ZU9VLkQvSHKTIGRaVJYFmKrBbTCJxE2UgCdDzMZDkHrOV6b95V0US6UmgKodujEZbJg0B0ZgEModO5lrY1TMQf1TpyJGBEjD+E2NPN7ukIUDiF/BfEXgRiGEw8NgkffYGYwCi808fpn/6OvfUfsDr/Vc1IfRf8sKnFVqeiVQfDu0tf/nWH9gAAAABJRU5ErkJggg==")}.tui-image-editor-container .tui-image-editor-selectlist-wrap{position:relative}.tui-image-editor-container .tui-image-editor-selectlist-wrap select{width:100%;height:28px;margin-top:4px;border:0;outline:0;border-radius:0;border:1px solid #cbdbdb;background-color:#fff;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0 7px 0 10px}.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist{display:none;position:relative;top:-1px;border:1px solid #ccc;background-color:#fff;border-top:0;padding:4px 0}.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist li{display:block;text-align:left;padding:7px 10px;font-family:Noto Sans,sans-serif}.tui-image-editor-container .tui-image-editor-selectlist-wrap .tui-image-editor-selectlist li:hover{background-color:rgba(81,92,230,.05)}.tui-image-editor-container .tui-image-editor-selectlist-wrap:before{content:"";position:absolute;display:inline-block;width:14px;height:14px;right:5px;top:10px;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAAXNSR0IArs4c6QAAAHlJREFUKBVjYBgFOEOAEVkmPDxc89+/f6eAYjzI4kD2FyYmJrOVK1deh4kzwRggGiQBVJCELAZig8SQNYHEmEEEMrh69eo1HR0dfqCYJUickZGxf9WqVf3IakBsFBthklpaWmVA9mEQhrJhUoTp0NBQCRAmrHL4qgAAuu4cWZOZIGsAAAAASUVORK5CYII=");background-size:cover}.tui-image-editor-container .tui-image-editor-selectlist-wrap select::-ms-expand{display:none}.tui-image-editor-container .tui-image-editor-virtual-range-bar .tui-image-editor-disabled,.tui-image-editor-container .tui-image-editor-virtual-range-pointer .tui-image-editor-disabled,.tui-image-editor-container .tui-image-editor-virtual-range-subbar .tui-image-editor-disabled{backbround-color:red}.tui-image-editor-container .tui-image-editor-range{position:relative;top:5px;width:166px;height:17px;display:inline-block}.tui-image-editor-container .tui-image-editor-virtual-range-bar{top:7px;position:absolute;width:100%;height:2px;background-color:#666}.tui-image-editor-container .tui-image-editor-virtual-range-subbar{position:absolute;height:100%;left:0;right:0;background-color:#d1d1d1}.tui-image-editor-container .tui-image-editor-virtual-range-pointer{position:absolute;cursor:pointer;top:-5px;left:0;width:12px;height:12px;background-color:#fff;border-radius:100%}.tui-image-editor-container .tui-image-editor-range-wrap{display:inline-block;margin-left:4px}.tui-image-editor-container .tui-image-editor-range-wrap.short .tui-image-editor-range{width:100px}.tui-image-editor-container .color-picker-control .tui-image-editor-range{width:108px;margin-left:10px}.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-pointer{background-color:#333}.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-bar{background-color:#ccc}.tui-image-editor-container .color-picker-control .tui-image-editor-virtual-range-subbar{background-color:#606060}.tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short{margin-top:-2px;margin-left:19px}.tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label{color:#8e8e8e;font-weight:400}.tui-image-editor-container .tui-image-editor-range-wrap label{vertical-align:baseline;font-size:11px;margin-right:7px;color:#fff}.tui-image-editor-container .tui-image-editor-range-value{cursor:default;width:40px;height:24px;outline:none;border-radius:2px;box-shadow:none;border:1px solid #d5d5d5;text-align:center;background-color:#1c1c1c;color:#fff;font-weight:lighter;vertical-align:baseline;font-family:Noto Sans,sans-serif;margin-top:21px;margin-left:4px}.tui-image-editor-container .tui-image-editor-controls{position:absolute;background-color:#151515;width:100%;height:64px;display:table;bottom:0;z-index:2}.tui-image-editor-container .tui-image-editor-icpartition{display:inline-block;background-color:#282828;width:1px;height:24px}.tui-image-editor-container.left .tui-image-editor-menu>.tui-image-editor-item[title]:before{left:28px;top:11px;border-right:7px solid #2f2f2f;border-top:7px solid transparent;border-bottom:7px solid transparent}.tui-image-editor-container.left .tui-image-editor-menu>.tui-image-editor-item[title]:after{top:7px;left:39px;white-space:nowrap}.tui-image-editor-container.left .tui-image-editor-submenu{left:0;height:100%;width:248px}.tui-image-editor-container.left .tui-image-editor-main-container{left:64px;width:calc(100% - 64px);height:100%}.tui-image-editor-container.left .tui-image-editor-controls{width:64px;height:100%;display:table}.tui-image-editor-container.left .tui-image-editor-menu,.tui-image-editor-container.right .tui-image-editor-menu{white-space:inherit}.tui-image-editor-container.left .tui-image-editor-submenu,.tui-image-editor-container.right .tui-image-editor-submenu{white-space:normal}.tui-image-editor-container.left .tui-image-editor-submenu>div,.tui-image-editor-container.right .tui-image-editor-submenu>div{vertical-align:middle}.tui-image-editor-container.left .tui-image-editor-controls li,.tui-image-editor-container.right .tui-image-editor-controls li{display:inline-block;margin:4px auto}.tui-image-editor-container.left .tui-image-editor-icpartition,.tui-image-editor-container.right .tui-image-editor-icpartition{position:relative;top:-7px;width:24px;height:1px}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition{display:block;width:75%;margin:auto}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition>div,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition>div{border-left:0;height:10px;border-bottom:1px solid #3c3c3c;width:100%;margin:0}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-align,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-align{margin-right:0}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-item li,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-item li{margin-top:15px}.tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-colorpicker-clearfix li,.tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-submenu-item .tui-colorpicker-clearfix li{margin-top:0}.tui-image-editor-container.left .tui-image-editor-checkbox-wrap.fixed-width,.tui-image-editor-container.right .tui-image-editor-checkbox-wrap.fixed-width{width:182px;white-space:normal}.tui-image-editor-container.left .tui-image-editor-range-wrap.tui-image-editor-newline label.range,.tui-image-editor-container.right .tui-image-editor-range-wrap.tui-image-editor-newline label.range{display:block;text-align:left;width:75%;margin:auto}.tui-image-editor-container.left .tui-image-editor-range,.tui-image-editor-container.right .tui-image-editor-range{width:136px}.tui-image-editor-container.right .tui-image-editor-menu>.tui-image-editor-item[title]:before{left:-3px;top:11px;border-left:7px solid #2f2f2f;border-top:7px solid transparent;border-bottom:7px solid transparent}.tui-image-editor-container.right .tui-image-editor-menu>.tui-image-editor-item[title]:after{top:7px;left:-44px;white-space:nowrap}.tui-image-editor-container.right .tui-image-editor-submenu{right:0;height:100%;width:248px}.tui-image-editor-container.right .tui-image-editor-main-container{right:64px;width:calc(100% - 64px);height:100%}.tui-image-editor-container.right .tui-image-editor-controls{right:0;width:64px;height:100%;display:table}.tui-image-editor-container.bottom .tui-image-editor-submenu .tui-image-editor-partition.only-left-right,.tui-image-editor-container.top .tui-image-editor-submenu .tui-image-editor-partition.only-left-right{display:none}.tui-image-editor-container.bottom .tui-image-editor-submenu>div{padding-bottom:24px}.tui-image-editor-container.top .color-picker-control .triangle{top:-8px;border-right:7px solid transparent;border-top:0;border-left:7px solid transparent;border-bottom:8px solid #fff}.tui-image-editor-container.top .tui-image-editor-size-wrap{height:100%}.tui-image-editor-container.top .tui-image-editor-main-container{bottom:0}.tui-image-editor-container.top .tui-image-editor-menu>.tui-image-editor-item[title]:before{left:13px;border-top:0;border-bottom:7px solid #2f2f2f;top:33px}.tui-image-editor-container.top .tui-image-editor-menu>.tui-image-editor-item[title]:after{top:38px}.tui-image-editor-container.top .tui-image-editor-submenu{top:0;bottom:inherit}.tui-image-editor-container.top .tui-image-editor-submenu>div{padding-top:24px;vertical-align:top}.tui-image-editor-container.top .tui-image-editor-controls-buttons,.tui-image-editor-container.top .tui-image-editor-controls-logo{display:table-cell}.tui-image-editor-container.top .tui-image-editor-main{top:64px;height:calc(100% - 64px)}.tui-image-editor-container.top .tui-image-editor-controls{top:0;bottom:inherit}.tui-image-editor-container #tie-icon-add-button .tui-image-editor-button{min-width:42px}.tui-image-editor-container .svg_ic-menu{width:24px;height:24px}.tui-image-editor-container .svg_ic-submenu{width:32px;height:32px}.tui-image-editor-container .svg_img-bi{width:257px;height:26px}.tui-image-editor-container .tui-image-editor-controls svg>use{display:none}.tui-image-editor-container .tui-image-editor-controls .enabled svg:hover>use.hover,.tui-image-editor-container .tui-image-editor-controls .normal svg:hover>use.hover{display:block}.tui-image-editor-container .tui-image-editor-controls .active svg:hover>use.hover{display:none}.tui-image-editor-container .tui-image-editor-controls .active svg>use.active,.tui-image-editor-container .tui-image-editor-controls .enabled svg>use.enabled,.tui-image-editor-container .tui-image-editor-controls svg>use.normal{display:block}.tui-image-editor-container .tui-image-editor-controls .active svg>use.normal,.tui-image-editor-container .tui-image-editor-controls .enabled svg>use.normal{display:none}.tui-image-editor-container .tui-image-editor-controls:hover{z-index:3}.tui-image-editor-container div.tui-colorpicker-clearfix{width:159px;height:28px;border:1px solid #d5d5d5;border-radius:2px;background-color:#f5f5f5;margin-top:6px;padding:4px 7px}.tui-image-editor-container .tui-colorpicker-palette-hex{width:114px;background-color:#f5f5f5;border:0;font-size:11px;margin-top:2px;font-family:Noto Sans,sans-serif}.tui-image-editor-container .tui-colorpicker-palette-hex[value=""]+.tui-colorpicker-palette-preview,.tui-image-editor-container .tui-colorpicker-palette-hex[value="#ffffff"]+.tui-colorpicker-palette-preview{border:1px solid #ccc}.tui-image-editor-container .tui-colorpicker-palette-hex[value=""]+.tui-colorpicker-palette-preview{background-size:cover;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAdBJREFUWAnFl0FuwjAQRZ0ukiugHqFSOQNdseuKW3ALzkA4BateICvUGyCxrtRFd4WuunH/TzykaYJrnLEYaTJJsP2+x8GZZCbQrLU5mj7Bn+EP8HvnCObd+R7xBV5lWfaNON4AnsA38E94qLEt+0yiFaBzAV/Bv+Cxxr4co7hKCDpw1q9wLeNYYdlAwyn8TYt8Hme3+8D5ozcTaMCZ68PXa2tnM2sbEcOZAJhrrpl2DAcTOGNjZPSfCdzkw6JrfbiMv+osBe4y9WOedhm4jZfhbENWuxS44H9Wz/xw4WzqLOAqh1+zycgAwzEMzr5k5gaHOa9ULBwuuDkFlHI1Kl4PJ66kgIpnoywOTmRFAYcbwYk9UMApWkD8zAV5ihcwHk4Rx7gl0IFTQL0EFc+CTQ9OZHWH3YhlVJiVpTHbrTGLhTHLZVgff6s9lyBsI9KduSS83oj+34rTwJutmBmCnMsvozRwZqB5GTkBw6/jdPDu69iJ6BYk6eCcfbcgcQIK/MByaaiMqm8rHcjol2TnpWDhyAKSGdA3FrxtJUToX0ODqatetfGE+8tyEUOV8GY5dGRwLP/MBS4RHQr4bT7NRAQjlcOTfZxmv2G+c4hI8nn+Ax5PG/zhI393AAAAAElFTkSuQmCC")}.tui-image-editor-container .tui-colorpicker-palette-preview{border-radius:100%;float:left;width:17px;height:17px;border:0}.tui-image-editor-container .color-picker-control{position:absolute;display:none;z-index:99;width:192px;background-color:#fff;box-shadow:0 3px 22px 6px rgba(0,0,0,.15);padding:16px;border-radius:2px}.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-toggle-slider{display:none}.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button{border:0;border-radius:100%;margin:2px;background-size:cover;font-size:1px}.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button[title=""],.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-button[title="#ffffff"]{border:1px solid #ccc}.tui-image-editor-container .color-picker-control .triangle{width:0;height:0;border-right:7px solid transparent;border-top:8px solid #fff;border-left:7px solid transparent;position:absolute;bottom:-8px;left:84px}.tui-image-editor-container .color-picker-control .tui-colorpicker-container,.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-container,.tui-image-editor-container .color-picker-control .tui-colorpicker-palette-container ul{width:100%;height:auto}.tui-image-editor-container .filter-color-item .color-picker-control label{font-color:#333;font-weight:400;margin-right:7pxleft}.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox{margin-top:0}.tui-image-editor-container .filter-color-item .tui-image-editor-checkbox input+label:before{left:-16px}.tui-image-editor-container .color-picker{width:100%;height:auto}.tui-image-editor-container .color-picker-value{width:32px;height:32px;border:0;border-radius:100%;margin:auto;margin-bottom:1px}.tui-image-editor-container .color-picker-value.transparent{border:1px solid #cbcbcb;background-size:cover;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAdBJREFUWAnFl0FuwjAQRZ0ukiugHqFSOQNdseuKW3ALzkA4BateICvUGyCxrtRFd4WuunH/TzykaYJrnLEYaTJJsP2+x8GZZCbQrLU5mj7Bn+EP8HvnCObd+R7xBV5lWfaNON4AnsA38E94qLEt+0yiFaBzAV/Bv+Cxxr4co7hKCDpw1q9wLeNYYdlAwyn8TYt8Hme3+8D5ozcTaMCZ68PXa2tnM2sbEcOZAJhrrpl2DAcTOGNjZPSfCdzkw6JrfbiMv+osBe4y9WOedhm4jZfhbENWuxS44H9Wz/xw4WzqLOAqh1+zycgAwzEMzr5k5gaHOa9ULBwuuDkFlHI1Kl4PJ66kgIpnoywOTmRFAYcbwYk9UMApWkD8zAV5ihcwHk4Rx7gl0IFTQL0EFc+CTQ9OZHWH3YhlVJiVpTHbrTGLhTHLZVgff6s9lyBsI9KduSS83oj+34rTwJutmBmCnMsvozRwZqB5GTkBw6/jdPDu69iJ6BYk6eCcfbcgcQIK/MByaaiMqm8rHcjol2TnpWDhyAKSGdA3FrxtJUToX0ODqatetfGE+8tyEUOV8GY5dGRwLP/MBS4RHQr4bT7NRAQjlcOTfZxmv2G+c4hI8nn+Ax5PG/zhI393AAAAAElFTkSuQmCC")}.tui-image-editor-container .color-picker-value+label{color:#fff}.tui-image-editor-container .tui-image-editor-submenu svg>use{display:none}#tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype=icon-arrow-2] svg>use.active,#tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype=icon-arrow-3] svg>use.active,#tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype=icon-arrow] svg>use.active,#tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype=icon-bubble] svg>use.active,#tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype=icon-heart] svg>use.active,#tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype=icon-location] svg>use.active,#tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype=icon-polygon] svg>use.active,#tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype=icon-star] svg>use.active,.tui-image-editor-container .tui-image-editor-submenu svg>use.normal{display:block}#tie-draw-line-select-button.free .tui-image-editor-button.free svg>use.normal,#tie-draw-line-select-button.line .tui-image-editor-button.line svg>use.normal{display:none}#tie-draw-line-select-button.free .tui-image-editor-button.free svg>use.active,#tie-draw-line-select-button.line .tui-image-editor-button.line svg>use.active{display:block}#tie-flip-button.flipX .tui-image-editor-button.flipX svg>use.normal,#tie-flip-button.flipY .tui-image-editor-button.flipY svg>use.normal,#tie-flip-button.resetFlip .tui-image-editor-button.resetFlip svg>use.normal{display:none}#tie-flip-button.flipX .tui-image-editor-button.flipX svg>use.active,#tie-flip-button.flipY .tui-image-editor-button.flipY svg>use.active,#tie-flip-button.resetFlip .tui-image-editor-button.resetFlip svg>use.active{display:block}#tie-mask-apply.apply.active .tui-image-editor-button.apply label{color:#fff}#tie-mask-apply.apply.active .tui-image-editor-button.apply svg>use.active{display:block}#tie-crop-button .tui-image-editor-button.apply,#tie-crop-preset-button .tui-image-editor-button.apply{margin-right:24px}#tie-crop-button .tui-image-editor-button.apply.active svg>use.active,#tie-crop-button .tui-image-editor-button.preset.active svg>use.active,#tie-crop-preset-button .tui-image-editor-button.apply.active svg>use.active,#tie-crop-preset-button .tui-image-editor-button.preset.active svg>use.active{display:block}#tie-shape-button.circle .tui-image-editor-button.circle svg>use.normal,#tie-shape-button.rect .tui-image-editor-button.rect svg>use.normal,#tie-shape-button.triangle .tui-image-editor-button.triangle svg>use.normal{display:none}#tie-shape-button.circle .tui-image-editor-button.circle svg>use.active,#tie-shape-button.rect .tui-image-editor-button.rect svg>use.active,#tie-shape-button.triangle .tui-image-editor-button.triangle svg>use.active,#tie-text-align-button.center .tui-image-editor-button.center svg>use.active,#tie-text-align-button.left .tui-image-editor-button.left svg>use.active,#tie-text-align-button.right .tui-image-editor-button.right svg>use.active,#tie-text-effect-button .tui-image-editor-button.active svg>use.active{display:block}#tie-icon-image-file,#tie-mask-image-file{opacity:0;position:absolute;width:100%;height:100%;border:1px solid green;cursor:inherit;left:0;top:0}.tui-image-editor-container.top.tui-image-editor-top-optimization .tui-image-editor-controls ul{text-align:right}.tui-image-editor-container.top.tui-image-editor-top-optimization .tui-image-editor-controls-logo{display:none} \ No newline at end of file diff --git a/dist/tui-image-editor.min.js b/dist/tui-image-editor.min.js index ef75da260..50a16b47d 100644 --- a/dist/tui-image-editor.min.js +++ b/dist/tui-image-editor.min.js @@ -1,24 +1,24 @@ /*! * tui-image-editor.min.js - * @version 3.3.0 + * @version 3.3.1 * @author NHNEnt FE Development Lab * @license MIT */ -!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("tui-code-snippet"),require("fabric/dist/fabric.require")):"function"==typeof define&&define.amd?define(["tui-code-snippet","fabric/dist/fabric.require"],t):"object"==typeof exports?exports.ImageEditor=t(require("tui-code-snippet"),require("fabric/dist/fabric.require")):(e.tui=e.tui||{},e.tui.ImageEditor=t(e.tui&&e.tui.util,e.fabric))}(this,function(e,t){return function(e){function t(i){if(n[i])return n[i].exports;var o=n[i]={exports:{},id:i,loaded:!1};return e[i].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var n={};return t.m=e,t.c=n,t.p="dist",t(0)}([function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}n(91);var o=n(88),r=i(o);n(148),n(45),n(46),n(47),n(48),n(49),n(50),n(51),n(52),n(53),n(54),n(55),n(56),n(57),n(58),n(59),n(60),n(61),n(63),n(62),e.exports=r.default},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(5),r=i(o);e.exports={componentNames:r.default.keyMirror("IMAGE_LOADER","CROPPER","FLIP","ROTATION","FREE_DRAWING","LINE","TEXT","ICON","FILTER","SHAPE"),commandNames:{CLEAR_OBJECTS:"clearObjects",LOAD_IMAGE:"loadImage",FLIP_IMAGE:"flip",ROTATE_IMAGE:"rotate",ADD_OBJECT:"addObject",REMOVE_OBJECT:"removeObject",APPLY_FILTER:"applyFilter",REMOVE_FILTER:"removeFilter",ADD_ICON:"addIcon",CHANGE_ICON_COLOR:"changeIconColor",ADD_SHAPE:"addShape",CHANGE_SHAPE:"changeShape",ADD_TEXT:"addText",CHANGE_TEXT:"changeText",CHANGE_TEXT_STYLE:"changeTextStyle",ADD_IMAGE_OBJECT:"addImageObject",RESIZE_CANVAS_DIMENSION:"resizeCanvasDimension",SET_OBJECT_PROPERTIES:"setObjectProperties",SET_OBJECT_POSITION:"setObjectPosition"},eventNames:{OBJECT_ACTIVATED:"objectActivated",OBJECT_MOVED:"objectMoved",OBJECT_SCALED:"objectScaled",OBJECT_CREATED:"objectCreated",TEXT_EDITING:"textEditing",TEXT_CHANGED:"textChanged",ICON_CREATE_RESIZE:"iconCreateResize",ICON_CREATE_END:"iconCreateEnd",ADD_TEXT:"addText",ADD_OBJECT:"addObject",ADD_OBJECT_AFTER:"addObjectAfter",MOUSE_DOWN:"mousedown",MOUSE_UP:"mouseup",MOUSE_MOVE:"mousemove",REDO_STACK_CHANGED:"redoStackChanged",UNDO_STACK_CHANGED:"undoStackChanged",SELECTION_CLEARED:"selectionCleared",SELECTION_CREATED:"selectionCreated"},drawingModes:r.default.keyMirror("NORMAL","CROPPER","FREE_DRAWING","LINE_DRAWING","TEXT","SHAPE"),keyCodes:{Z:90,Y:89,SHIFT:16,BACKSPACE:8,DEL:46},fObjectOptions:{SELECTION_STYLE:{borderColor:"red",cornerColor:"green",cornerSize:10,originX:"center",originY:"center",transparentCorners:!1}},rejectMessages:{flip:"The flipX and flipY setting values are not changed.",rotation:"The current angle is same the old angle.",loadImage:"The background image is empty.",isLock:"The executing command state is locked.",undo:"The promise of undo command is reject.",redo:"The promise of redo command is reject.",invalidDrawingMode:"This operation is not supported in the drawing mode",invalidParameters:"Invalid parameters",noActiveObject:"There is no active object.",unsupportedType:"Unsupported object type",noObject:"The object is not in canvas.",addedObject:"The object is already added."},defaultIconPath:{"icon-arrow":"M40 12V0l24 24-24 24V36H0V12h40z","icon-arrow-2":"M49,32 H3 V22 h46 l-18,-18 h12 l23,23 L43,50 h-12 l18,-18 z ","icon-arrow-3":"M43.349998,27 L17.354,53 H1.949999 l25.996,-26 L1.949999,1 h15.404 L43.349998,27 z ","icon-star":"M35,54.557999 l-19.912001,10.468 l3.804,-22.172001 l-16.108,-15.7 l22.26,-3.236 L35,3.746 l9.956,20.172001 l22.26,3.236 l-16.108,15.7 l3.804,22.172001 z ","icon-star-2":"M17,31.212 l-7.194,4.08 l-4.728,-6.83 l-8.234,0.524 l-1.328,-8.226 l-7.644,-3.14 l2.338,-7.992 l-5.54,-6.18 l5.54,-6.176 l-2.338,-7.994 l7.644,-3.138 l1.328,-8.226 l8.234,0.522 l4.728,-6.83 L17,-24.312 l7.194,-4.08 l4.728,6.83 l8.234,-0.522 l1.328,8.226 l7.644,3.14 l-2.338,7.992 l5.54,6.178 l-5.54,6.178 l2.338,7.992 l-7.644,3.14 l-1.328,8.226 l-8.234,-0.524 l-4.728,6.83 z ","icon-polygon":"M3,31 L19,3 h32 l16,28 l-16,28 H19 z ","icon-location":"M24 62C8 45.503 0 32.837 0 24 0 10.745 10.745 0 24 0s24 10.745 24 24c0 8.837-8 21.503-24 38zm0-28c5.523 0 10-4.477 10-10s-4.477-10-10-10-10 4.477-10 10 4.477 10 10 10z","icon-heart":"M49.994999,91.349998 l-6.96,-6.333 C18.324001,62.606995 2.01,47.829002 2.01,29.690998 C2.01,14.912998 13.619999,3.299999 28.401001,3.299999 c8.349,0 16.362,5.859 21.594,12 c5.229,-6.141 13.242001,-12 21.591,-12 c14.778,0 26.390999,11.61 26.390999,26.390999 c0,18.138 -16.314001,32.916 -41.025002,55.374001 l-6.96,6.285 z ","icon-bubble":"M44 48L34 58V48H12C5.373 48 0 42.627 0 36V12C0 5.373 5.373 0 12 0h40c6.627 0 12 5.373 12 12v24c0 6.627-5.373 12-12 12h-8z"},defaultRotateRangeValus:{realTimeEvent:!0,min:-360,max:360,value:0},defaultDrawRangeValus:{min:5,max:30,value:12},defaultShapeStrokeValus:{realTimeEvent:!1,min:2,max:300,value:3},defaultTextRangeValus:{realTimeEvent:!0,min:10,max:100,value:50},defaultFilterRangeValus:{tintOpacityRange:{min:0,max:1,value:.7},removewhiteThresholdRange:{min:0,max:255,value:60},removewhiteDistanceRange:{min:0,max:255,value:10},gradientTransparencyRange:{min:0,max:255,value:100},brightnessRange:{min:-255,max:255,value:100},noiseRange:{min:0,max:1e3,value:100},pixelateRange:{min:2,max:20,value:4},colorfilterThresholeRange:{min:0,max:255,value:45}}}},function(t,n){t.exports=e},function(e,t,n){n(144),n(146),n(147),n(145),e.exports=n(16).Promise},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e){var t=l[e];if(t){for(var n=arguments.length,i=Array(n>1?n-1:0),o=1;on&&(i=t,t=n,n=i),r(t,o(e,n))},keyMirror:function(){for(var e={},t=arguments.length,n=Array(t),o=0;o1&&void 0!==arguments[1]?arguments[1]:"#7e7e7e",i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"up";o(this,e);var r=t.getAttribute("title");this._show=!1,this._colorpickerElement=t,this._toggleDirection=i,this._makePickerButtonElement(t,n),this._makePickerLayerElement(t,r),this._color=n,this.picker=c.default.create({container:this.pickerElement,preset:u,color:n}),this._addEvent(t)}return r(e,[{key:"_changeColorElement",value:function(e){e?(this.colorElement.classList.remove("transparent"),this.colorElement.style.backgroundColor=e):(this.colorElement.style.backgroundColor="#fff",this.colorElement.classList.add("transparent"))}},{key:"_makePickerButtonElement",value:function(e,t){e.classList.add("tui-image-editor-button"),this.colorElement=document.createElement("div"),this.colorElement.className="color-picker-value",t?this.colorElement.style.backgroundColor=t:this.colorElement.classList.add("transparent")}},{key:"_makePickerLayerElement",value:function(e,t){var n=document.createElement("label"),i=document.createElement("div");this.pickerControl=document.createElement("div"),this.pickerControl.className="color-picker-control",this.pickerElement=document.createElement("div"),this.pickerElement.className="color-picker",n.innerHTML=t,i.className="triangle",this.pickerControl.appendChild(this.pickerElement),this.pickerControl.appendChild(i),e.appendChild(this.pickerControl),e.appendChild(this.colorElement),e.appendChild(n)}},{key:"_addEvent",value:function(e){var t=this;this.picker.on("selectColor",function(e){t._changeColorElement(e.color),t._color=e.color,t.fire("change",e.color)}),e.addEventListener("click",function(e){t._show=!t._show,t.pickerControl.style.display=t._show?"block":"none",t._setPickerControlPosition(),t.fire("changeShow",t),e.stopPropagation()}),document.body.addEventListener("click",function(){t.hide()})}},{key:"hide",value:function(){this._show=!1,this.pickerControl.style.display="none"}},{key:"_setPickerControlPosition",value:function(){var e=this.pickerControl.style,t=this._colorpickerElement.clientWidth/2+2,n=this.pickerControl.offsetWidth/2-t,i=(this.pickerControl.offsetHeight+10)*-1;"down"===this._toggleDirection&&(i=30),e.top=i+"px",e.left="-"+n+"px"}},{key:"color",get:function(){return this._color},set:function(e){this._color=e,this._changeColorElement(e)}}]),e}();s.default.CustomEvents.mixin(d),t.default=d},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var r=function(){function e(e,t){for(var n=0;n1&&void 0!==arguments[1]?arguments[1]:{};o(this,e),this._value=n.value||0,this.rangeElement=t,this._drawRangeElement(),this.rangeWidth=(0,l.toInteger)(window.getComputedStyle(t,null).width)-12,this._min=n.min||0,this._max=n.max||100,this._absMax=this._min*-1+this._max,this.realTimeEvent=n.realTimeEvent||!1,this._addClickEvent(),this._addDragEvent(),this.value=n.value,this.trigger("change")}return r(e,[{key:"trigger",value:function(e){this.fire(e,this._value)}},{key:"_drawRangeElement",value:function(){this.rangeElement.classList.add("tui-image-editor-range"),this.bar=document.createElement("div"),this.bar.className="tui-image-editor-virtual-range-bar",this.subbar=document.createElement("div"),this.subbar.className="tui-image-editor-virtual-range-subbar",this.pointer=document.createElement("div"),this.pointer.className="tui-image-editor-virtual-range-pointer",this.bar.appendChild(this.subbar),this.bar.appendChild(this.pointer),this.rangeElement.appendChild(this.bar)}},{key:"_addClickEvent",value:function(){var e=this;this.rangeElement.addEventListener("click",function(t){if(t.stopPropagation(),"tui-image-editor-range"===t.target.className){var n=t.offsetX,i=n/e.rangeWidth,o=e._absMax*i+e._min;e.pointer.style.left=i*e.rangeWidth+"px",e.subbar.style.right=(1-i)*e.rangeWidth+"px",e._value=o,e.fire("change",o)}})}},{key:"_addDragEvent",value:function(){var e=this;this.pointer.addEventListener("mousedown",function(t){e.firstPosition=t.screenX,e.firstLeft=(0,l.toInteger)(e.pointer.style.left)||0,e.dragEventHandler={changeAngle:e._changeAngle.bind(e),stopChangingAngle:e._stopChangingAngle.bind(e)},document.addEventListener("mousemove",e.dragEventHandler.changeAngle),document.addEventListener("mouseup",e.dragEventHandler.stopChangingAngle)})}},{key:"_changeAngle",value:function(e){var t=e.screenX,n=t-this.firstPosition,i=this.firstLeft+n;i=i>this.rangeWidth?this.rangeWidth:i,i=i<0?0:i,this.pointer.style.left=i+"px",this.subbar.style.right=this.rangeWidth-i+"px";var o=i/this.rangeWidth,r=this._absMax*o+this._min;this._value=r,this.realTimeEvent&&this.fire("change",r)}},{key:"_stopChangingAngle",value:function(){this.fire("change",this._value),document.removeEventListener("mousemove",this.dragEventHandler.changeAngle),document.removeEventListener("mouseup",this.dragEventHandler.stopChangingAngle)}},{key:"max",set:function(e){this._max=e,this._absMax=this._min*-1+this._max,this.value=this._value},get:function(){return this._max}},{key:"value",get:function(){return this._value},set:function(e){var t=e-this._min,n=t*this.rangeWidth/this._absMax;this.rangeWidth0?i:n)(e)}},function(e,t,n){var i=n(122),o=n(25);e.exports=function(e){return i(o(e))}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(2),r=i(o),a=n(5),s=(0,a.keyMirror)("UN_IMPLEMENTATION","NO_COMPONENT_NAME"),l={UN_IMPLEMENTATION:"Should implement a method: ",NO_COMPONENT_NAME:"Should set a component name"},c={UN_IMPLEMENTATION:function(e){return l.UN_IMPLEMENTATION+e},NO_COMPONENT_NAME:function(){return l.NO_COMPONENT_NAME}};e.exports={types:r.default.extend({},s),create:function(e){e=e.toLowerCase();for(var t=c[e],n=arguments.length,i=Array(n>1?n-1:0),o=1;on;)t.push(arguments[n++]);return v[++g]=function(){s("function"==typeof e?e:Function(e),t)},i(g),g},f=function(e){delete v[e]},"process"==n(19)(d)?i=function(e){d.nextTick(a(b,e,1))}:p?(o=new p,r=o.port2,o.port1.onmessage=y,i=a(r.postMessage,r,1)):u.addEventListener&&"function"==typeof postMessage&&!u.importScripts?(i=function(e){u.postMessage(e+"","*")},u.addEventListener("message",y,!1)):i=m in c("script")?function(e){l.appendChild(c("script"))[m]=function(){l.removeChild(this),b.call(e)}}:function(e){setTimeout(a(b,e,1),0)}),e.exports={set:h,clear:f}},function(e,t,n){var i=n(29),o=Math.min;e.exports=function(e){return e>0?o(i(e),9007199254740991):0}},function(e,t){var n=0,i=Math.random();e.exports=function(e){return"Symbol(".concat(void 0===e?"":e,")_",(++n+i).toString(36))}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0});var o=n(2),r=n(5),a=i(r),s=n(86),l=i(s);t.default={getActions:function(){return{main:this._mainAction(),shape:this._shapeAction(),crop:this._cropAction(),flip:this._flipAction(),rotate:this._rotateAction(),text:this._textAction(),mask:this._maskAction(),draw:this._drawAction(),icon:this._iconAction(),filter:this._filterAction()}},_mainAction:function(){var e=this,t=function(){"crop"===e.ui.submenu&&(e.stopDrawingMode(),e.ui.changeMenu("crop"))};return(0,o.extend)({initLoadImage:function(n,i){return e.loadImageFromURL(n,i).then(function(i){t(),e.ui.initializeImgUrl=n,e.ui.resizeEditor({imageSize:i}),e.clearUndoStack()})},undo:function(){e.isEmptyUndoStack()||(t(),e.undo())},redo:function(){e.isEmptyRedoStack()||(t(),e.redo())},reset:function(){t(),e.loadImageFromURL(e.ui.initializeImgUrl,"resetImage").then(function(n){t(),e.ui.resizeEditor({imageSize:n}),e.clearUndoStack()})},delete:function(){e.ui.changeDeleteButtonEnabled(!1),t(),e.removeActiveObject(),e.activeObjectId=null},deleteAll:function(){t(),e.clearObjects(),e.ui.changeDeleteButtonEnabled(!1),e.ui.changeDeleteAllButtonEnabled(!1)},load:function(n){a.default.isSupportFileApi()||alert("This browser does not support file-api"),e.ui.initializeImgUrl=URL.createObjectURL(n),e.loadImageFromFile(n).then(function(n){t(),e.clearUndoStack(),e.ui.activeMenuEvent(),e.ui.resizeEditor({imageSize:n})}).catch(function(e){return Promise.reject(e)})},download:function(){var t=e.toDataURL(),n=e.getImageName(),i=void 0,o=void 0,r=void 0;a.default.isSupportFileApi()&&window.saveAs?(i=a.default.base64ToBlob(t),o=i.type.split("/")[1],n.split(".").pop()!==o&&(n+="."+o),saveAs(i,n)):(r=window.open(),r.document.body.innerHTML="")}},this._commonAction())},_iconAction:function(){var e=this,t=void 0,n=void 0,i=void 0,r=void 0,a=void 0,s=void 0,c=void 0;this.on({iconCreateResize:function(t){var n=t.moveOriginPointer,o=(n.x-i)/a,l=(n.y-r)/s;e.setObjectPropertiesQuietly(c,{scaleX:Math.abs(2*o),scaleY:Math.abs(2*l)})},iconCreateEnd:function(){e.ui.icon.clearIconType(),e.changeSelectableAll(!0)}});var u=function(o,l){i=l.x,r=l.y,e.addIcon(t,{left:l.x,top:l.y,fill:n}).then(function(e){c=e.id,a=e.width,s=e.height})};return(0,o.extend)({changeColor:function(t){e.activeObjectId&&e.changeIconColor(e.activeObjectId,t)},addIcon:function(i,o){t=i,n=o,e.changeCursor("crosshair"),e.off("mousedown"),e.once("mousedown",u.bind(e))},cancelAddIcon:function(){e.off("mousedown"),e.ui.icon.clearIconType(),e.changeSelectableAll(!0),e.changeCursor("default")},registDefalutIcons:function(t,n){var i={};i[t]=n,e.registerIcons(i)},registCustomIcon:function(t,n){var i=new l.default;i.imageToSVG(t,function(t){var i=t.match(/path[^>]*d="([^"]*)"/),o=i[1],r={};r[n.name]=o,e.registerIcons(r),e.addIcon(n.name,{left:100,top:100})},l.default.tracerDefaultOption())}},this._commonAction())},_drawAction:function(){var e=this;return(0,o.extend)({setDrawMode:function(t,n){e.stopDrawingMode(),"free"===t?e.startDrawingMode("FREE_DRAWING",n):e.startDrawingMode("LINE_DRAWING",n)},setColor:function(t){e.setBrush({color:t})}},this._commonAction())},_maskAction:function(){var e=this;return(0,o.extend)({loadImageFromURL:function(t,n){return e.loadImageFromURL(e.toDataURL(),"FilterImage").then(function(){e.addImageObject(t).then(function(){URL.revokeObjectURL(n)})})},applyFilter:function(){e.applyFilter("mask",{maskObjId:e.activeObjectId})}},this._commonAction())},_textAction:function(){var e=this;return(0,o.extend)({changeTextStyle:function(t){e.activeObjectId&&e.changeTextStyle(e.activeObjectId,t)}},this._commonAction())},_rotateAction:function(){var e=this;return(0,o.extend)({rotate:function(t){e.rotate(t),e.ui.resizeEditor()},setAngle:function(t){e.setAngle(t),e.ui.resizeEditor()}},this._commonAction())},_shapeAction:function(){var e=this;return(0,o.extend)({changeShape:function(t){e.activeObjectId&&e.changeShape(e.activeObjectId,t)},setDrawingShape:function(t){e.setDrawingShape(t)}},this._commonAction())},_cropAction:function(){var e=this;return(0,o.extend)({crop:function(){var t=e.getCropzoneRect();t&&e.crop(t).then(function(){e.stopDrawingMode(),e.ui.resizeEditor(),e.ui.changeMenu("crop")}).catch(function(e){return Promise.reject(e)})},cancel:function(){e.stopDrawingMode(),e.ui.changeMenu("crop")},preset:function(t){switch(t){case"preset-square":e.setCropzoneRect(1);break;case"preset-3-2":e.setCropzoneRect(1.5);break;case"preset-4-3":e.setCropzoneRect(4/3);break;case"preset-5-4":e.setCropzoneRect(5/4);break;case"preset-7-5":e.setCropzoneRect(1.4);break;case"preset-16-9":e.setCropzoneRect(16/9);break;default:e.setCropzoneRect(),e.ui.crop.changeApplyButtonStatus(!1)}}},this._commonAction())},_flipAction:function(){var e=this;return(0,o.extend)({flip:function(t){return e[t]()}},this._commonAction())},_filterAction:function(){var e=this;return(0,o.extend)({applyFilter:function(t,n,i){t?e.applyFilter(n,i):e.hasFilter(n)&&e.removeFilter(n)}},this._commonAction())},setReAction:function(){var e=this;this.on({undoStackChanged:function(t){t?(e.ui.changeUndoButtonStatus(!0),e.ui.changeResetButtonStatus(!0)):(e.ui.changeUndoButtonStatus(!1),e.ui.changeResetButtonStatus(!1)),e.ui.resizeEditor()},redoStackChanged:function(t){t?e.ui.changeRedoButtonStatus(!0):e.ui.changeRedoButtonStatus(!1),e.ui.resizeEditor()},objectActivated:function(t){e.activeObjectId=t.id,e.ui.changeDeleteButtonEnabled(!0),e.ui.changeDeleteAllButtonEnabled(!0),"cropzone"===t.type?e.ui.crop.changeApplyButtonStatus(!0):["rect","circle","triangle"].indexOf(t.type)>-1?(e.stopDrawingMode(),"shape"!==e.ui.submenu&&e.ui.changeMenu("shape",!1,!1),e.ui.shape.setShapeStatus({strokeColor:t.stroke,strokeWidth:t.strokeWidth,fillColor:t.fill}),e.ui.shape.setMaxStrokeValue(Math.min(t.width,t.height))):"path"===t.type||"line"===t.type?"draw"!==e.ui.submenu&&(e.ui.changeMenu("draw",!1,!1),e.ui.draw.changeStandbyMode()):["i-text","text"].indexOf(t.type)>-1?"text"!==e.ui.submenu&&e.ui.changeMenu("text",!1,!1):"icon"===t.type&&(e.stopDrawingMode(),"icon"!==e.ui.submenu&&e.ui.changeMenu("icon",!1,!1),e.ui.icon.setIconPickerColor(t.fill))},addText:function(t){e.addText("Double Click",{position:t.originPosition,styles:{fill:e.ui.text.textColor,fontSize:a.default.toInteger(e.ui.text.fontSize),fontFamily:"Noto Sans"}}).then(function(){e.changeCursor("default")})},addObjectAfter:function(t){["rect","circle","triangle"].indexOf(t.type)>-1&&(e.ui.shape.setMaxStrokeValue(Math.min(t.width,t.height)),e.ui.shape.changeStandbyMode())},objectScaled:function(t){if(["i-text","text"].indexOf(t.type)>-1)e.ui.text.fontSize=a.default.toInteger(t.fontSize);else if(["rect","circle","triangle"].indexOf(t.type)>=0){var n=t.width,i=t.height,o=e.ui.shape.getStrokeValue();nb&&(r.remove(),r.set(this._calcRectDimensionFromPoint(i,o)),t.add(r))}},{key:"_calcRectDimensionFromPoint",value:function(e,t){var n=this.getCanvas(),i=n.getWidth(),o=n.getHeight(),r=this._startX,a=this._startY,s=(0,m.clamp)(e,0,r),l=(0,m.clamp)(t,0,a),c=(0,m.clamp)(e,r,i)-s,u=(0,m.clamp)(t,a,o)-l;return this._withShiftKey&&(c>u?u=c:u>c&&(c=u),r>=e&&(s=r-c),a>=t&&(l=a-u)),{left:s,top:l,width:c,height:u}}},{key:"_onFabricMouseUp",value:function(){var e=this._cropzone,t=this._listeners,n=this.getCanvas();n.setActiveObject(e),n.off({"mouse:move":t.mousemove,"mouse:up":t.mouseup})}},{key:"getCroppedImageData",value:function(e){var t=this.getCanvas(),n=t.contains(this._cropzone);if(!e)return null;n&&this._cropzone.remove();var i={imageName:this.getImageName(),url:t.toDataURL(e)};return n&&t.add(this._cropzone),i}},{key:"getCropzoneRect",value:function(){var e=this._cropzone;return e.isValid()?{left:e.getLeft(),top:e.getTop(),width:e.getWidth(),height:e.getHeight()}:null}},{key:"setCropzoneRect",value:function(e){var t=this.getCanvas(),n=this._cropzone;t.deactivateAll(),t.selection=!1,n.remove(),n.set(e?this._getPresetCropSizePosition(e):y),t.add(n),t.selection=!0,e&&t.setActiveObject(n)}},{key:"_getPresetCropSizePosition",value:function(e){var t=this.getCanvas(),n=t.getWidth(),i=t.getHeight(),o=n>=i?n:i,r=function(e,t){return e>t?t/e:1},a=o*e,s=o,l=r(a,n),u=c.default.map([a,s],function(e){return e*l});a=u[0],s=u[1];var d=r(s,i),h=c.default.map([a,s],function(e){return e*d});return a=h[0],s=h[1],{top:(i-s)/2,left:(n-a)/2,width:a,height:s}}},{key:"_onKeyDown",value:function(e){e.keyCode===v.keyCodes.SHIFT&&(this._withShiftKey=!0)}},{key:"_onKeyUp",value:function(e){e.keyCode===v.keyCodes.SHIFT&&(this._withShiftKey=!1)}}]),t}(f.default);e.exports=_},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;n=0,c=n.useDragAddIcon&&l,u=a?n._createIcon(a):null;u||o(y.invalidParameters),u.set(d.default.extend({type:"icon",fill:n._oColor},s,t,n.graphics.controlStyle)),r.add(u).setActiveObject(u),c&&n._addWithDragEvent(r),i(n.graphics.createObjectProperties(u))})}},{key:"_addWithDragEvent",value:function(e){var t=this;e.on({"mouse:move":function(n){e.selection=!1,t.fire(b.ICON_CREATE_RESIZE,{moveOriginPointer:e.getPointer(n.e)})},"mouse:up":function(n){t.fire(b.ICON_CREATE_END,{moveOriginPointer:e.getPointer(n.e)}),e.defaultCursor="default",e.off("mouse:up"),e.off("mouse:move"),e.selection=!0}})}},{key:"registerPaths",value:function(e){var t=this;d.default.forEach(e,function(e,n){t._pathMap[n]=e},this)}},{key:"setColor",value:function(e,t){this._oColor=e,t&&"icon"===t.get("type")&&(t.setFill(this._oColor),this.getCanvas().renderAll())}},{key:"getColor",value:function(e){return e.fill}},{key:"_createIcon",value:function(e){return new c.default.Path(e)}}]),t}(g.default);e.exports=k},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;nn},_getColor:function(e,t,n){var i=[0,0,0,0],o=e.data,r=e.width,a=4,s=(r*n+t)*a;return i[0]=o[s],i[1]=o[s+1],i[2]=o[s+2],i[3]=o[s+3],i}});e.exports=a},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(2),r=i(o),a=n(6),s=i(a),l=n(5),c="tl",u="tr",d="mt",h="ml",f="mr",p="mb",g="bl",v="br",m=s.default.util.createClass(s.default.Rect,{initialize:function(e,t){e=r.default.extend(e,t),e.type="cropzone",this.callSuper("initialize",e),this.options=e,this.on({moving:this._onMoving,scaling:this._onScaling})},_render:function(e){var t=7,n=7;this.callSuper("_render",e);var i=this.flipX?-1:1,o=this.flipY?-1:1,r=i/this.scaleX,a=o/this.scaleY;e.scale(r,a),this._fillOuterRect(e,"rgba(0, 0, 0, 0.55)"),this.options.lineWidth?(this._fillInnerRect(e),this._strokeBorder(e,"rgb(255, 255, 255)",{lineWidth:this.options.lineWidth})):(this._strokeBorder(e,"rgb(0, 0, 0)",{lineDashWidth:t}),this._strokeBorder(e,"rgb(255, 255, 255)",{lineDashWidth:t,lineDashOffset:n})),e.scale(1/r,1/a)},_fillOuterRect:function(e,t){var n=this._getCoordinates(e),i=n.x,o=n.y;e.save(),e.fillStyle=t,e.beginPath(),e.moveTo(i[0]-1,o[0]-1),e.lineTo(i[3]+1,o[0]-1),e.lineTo(i[3]+1,o[3]+1),e.lineTo(i[0]-1,o[3]+1),e.lineTo(i[0]-1,o[0]-1),e.closePath(),e.moveTo(i[1],o[1]),e.lineTo(i[1],o[2]),e.lineTo(i[2],o[2]),e.lineTo(i[2],o[1]),e.lineTo(i[1],o[1]),e.closePath(),e.fill(),e.restore()},_fillInnerRect:function(e){var t=this._getCoordinates(e),n=t.x,i=t.y,o=this._caculateInnerPosition(n,(n[2]-n[1])/3),r=this._caculateInnerPosition(i,(i[2]-i[1])/3);e.save(),e.strokeStyle="rgba(255, 255, 255, 0.7)",e.lineWidth=this.options.lineWidth,e.beginPath(),e.moveTo(o[0],r[1]),e.lineTo(o[3],r[1]),e.moveTo(o[0],r[2]),e.lineTo(o[3],r[2]),e.moveTo(o[1],r[0]),e.lineTo(o[1],r[3]),e.moveTo(o[2],r[0]),e.lineTo(o[2],r[3]),e.stroke(),e.closePath(),e.restore()},_caculateInnerPosition:function(e,t){var n=[];return n[0]=e[1],n[1]=e[1]+t,n[2]=e[1]+2*t,n[3]=e[2],n},_getCoordinates:function(e){var t=this.getWidth(),n=this.getHeight(),i=t/2,o=n/2,a=this.getLeft(),s=this.getTop(),l=e.canvas;return{x:r.default.map([-(i+a),-i,i,i+(l.width-a-t)],Math.ceil),y:r.default.map([-(o+s),-o,o,o+(l.height-s-n)],Math.ceil)}},_strokeBorder:function(e,t,n){var i=n.lineDashWidth,o=n.lineDashOffset,r=n.lineWidth,a=this.getWidth()/2,s=this.getHeight()/2;e.save(),e.strokeStyle=t,e.setLineDash&&e.setLineDash([i,i]),o&&(e.lineDashOffset=o),r&&(e.lineWidth=r),e.beginPath(),e.moveTo(-a,-s),e.lineTo(a,-s),e.lineTo(a,s),e.lineTo(-a,s),e.lineTo(-a,-s),e.stroke(),e.restore()},_onMoving:function(){var e=this.getLeft(),t=this.getTop(),n=this.getWidth(),i=this.getHeight(),o=this.canvas.getWidth()-n,r=this.canvas.getHeight()-i;this.setLeft((0,l.clamp)(e,0,o)),this.setTop((0,l.clamp)(t,0,r))},_onScaling:function(e){var t=this.canvas.getPointer(e.e),n=this._calcScalingSizeFromPointer(t);this.scale(1).set(n)},_calcScalingSizeFromPointer:function(e){var t=e.x,n=e.y,i=this._calcTopLeftScalingSizeFromPointer(t,n),o=this._calcBottomRightScalingSizeFromPointer(t,n);return this._makeScalingSettings(i,o)},_calcTopLeftScalingSizeFromPointer:function(e,t){var n=this.getHeight()+this.top,i=this.getWidth()+this.left,o=(0,l.clamp)(t,0,n-1),r=(0,l.clamp)(e,0,i-1);return{top:o,left:r,width:i-r,height:n-o}},_calcBottomRightScalingSizeFromPointer:function(e,t){var n=this.canvas,i=n.width,o=n.height,r=this.left,a=this.top;return{width:(0,l.clamp)(e,r+1,i)-r,height:(0,l.clamp)(t,a+1,o)-a}},_makeScalingSettings:function(e,t){var n=e.width,i=e.height,o=t.height,r=t.width,a=e.left,s=e.top,l=void 0;switch(this.__corner){case c:l=e;break;case u:l={width:r,height:i,top:s};break;case g:l={width:n,height:o,left:a};break;case v:l=t;break;case h:l={width:n,left:a};break;case d:l={height:i,top:s};break;case f:l={width:r};break;case p:l={height:o}}return l},isValid:function(){return this.left>=0&&this.top>=0&&this.width>0&&this.height>0}});e.exports=m},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(6),r=i(o),a=r.default.util.createClass(r.default.Image.filters.Convolute,{type:"Emboss",initialize:function(){var e=[1,1,1,1,.7,-1,-1,-1,-1];this.matrix=e}});e.exports=a},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(6),r=i(o),a=r.default.util.createClass(r.default.Image.filters.Mask,{applyTo:function(e){if(this.mask){var t=e.width,n=e.height,i=this._createCanvasOfMask(t,n),o=e.getContext("2d"),r=i.getContext("2d"),a=o.getImageData(0,0,t,n);this._drawMask(r,e,o),this._mapData(r,a,t,n),o.putImageData(a,0,0)}},_createCanvasOfMask:function(e,t){var n=r.default.util.createCanvasElement();return n.width=e,n.height=t,n},_drawMask:function(e){var t=this.mask,n=t.getElement(),i=t.getLeft(),o=t.getTop(),r=t.getAngle();e.save(),e.translate(i,o),e.rotate(r*Math.PI/180),e.scale(t.scaleX,t.scaleY),e.drawImage(n,-n.width/2,-n.height/2),e.restore()},_mapData:function(e,t,n,i){for(var o=t.data,r=e.getImageData(0,0,n,i).data,a=this.channel,s=t.width*t.height*4,l=0;l1&&void 0!==arguments[1]?arguments[1]:{},i=n.cssMaxWidth,r=n.cssMaxHeight,a=n.useItext,s=void 0!==a&&a,l=n.useDragAddIcon,c=void 0!==l&&l;o(this,e),this.canvasImage=null,this.cssMaxWidth=i||ie,this.cssMaxHeight=r||oe,this.useItext=s,this.useDragAddIcon=c,this.cropSelectionStyle={},this.imageName="",this._objects={},this._canvas=null,this._drawingMode=q.NORMAL,this._drawingModeMap={},this._componentMap={},this._handler={onMouseDown:this._onMouseDown.bind(this),onObjectAdded:this._onObjectAdded.bind(this),onObjectRemoved:this._onObjectRemoved.bind(this),onObjectMoved:this._onObjectMoved.bind(this),onObjectScaled:this._onObjectScaled.bind(this),onObjectSelected:this._onObjectSelected.bind(this),onPathCreated:this._onPathCreated.bind(this),onSelectionCleared:this._onSelectionCleared.bind(this),onSelectionCreated:this._onSelectionCreated.bind(this)},this._setCanvasElement(t),this._createDrawingModeInstances(),this._createComponents(),this._attachCanvasEvents()}return r(e,[{key:"destroy",value:function(){var e=this._canvas.wrapperEl;this._canvas.clear(),e.parentNode.removeChild(e)}},{key:"deactivateAll",value:function(){return this._canvas.deactivateAll(),this}},{key:"renderAll",value:function(){return this._canvas.renderAll(),this}},{key:"add",value:function(e){var t,n=[];$(e)?n=e:n.push(e),(t=this._canvas).add.apply(t,n)}},{key:"contains",value:function(e){return this._canvas.contains(e)}},{key:"getObjects",value:function(){return this._canvas.getObjects().slice()}},{key:"getObject",value:function(e){return this._objects[e]}},{key:"remove",value:function(e){this._canvas.remove(e)}},{key:"removeAll",value:function(e){var t=this._canvas,n=t.getObjects().slice();return t.remove.apply(t,this._canvas.getObjects()),e&&t.clear(),n}},{key:"removeObjectById",value:function(e){var t=[],n=this._canvas,i=this.getObject(e),o=i&&i.isType("group")&&!i.isEmpty();return o?(n.discardActiveGroup(),i.forEachObject(function(e){t.push(e),e.remove()})):n.contains(i)&&(t.push(i),i.remove()),t}},{key:"getObjectId",value:function(e){var t=null;for(t in this._objects)if(this._objects.hasOwnProperty(t)&&e===this._objects[t])return t;return null}},{key:"getActiveObject",value:function(){return this._canvas.getActiveObject()}},{key:"getActiveGroupObject",value:function(){return this._canvas.getActiveGroup()}},{key:"setActiveObject",value:function(e){this._canvas.setActiveObject(e)}},{key:"setCropSelectionStyle",value:function(e){this.cropSelectionStyle=e}},{key:"getComponent",value:function(e){return this._componentMap[e]}},{key:"getDrawingMode",value:function(){return this._drawingMode}},{key:"startDrawingMode",value:function(e,t){if(this._isSameDrawingMode(e))return!0;this.stopDrawingMode();var n=this._getDrawingModeInstance(e);return n&&n.start&&(n.start(this,t),this._drawingMode=e),!!n}},{key:"stopDrawingMode",value:function(){if(!this._isSameDrawingMode(q.NORMAL)){var e=this._getDrawingModeInstance(this.getDrawingMode());e&&e.end&&e.end(this),this._drawingMode=q.NORMAL}}},{key:"toDataURL",value:function(e){return this._canvas&&this._canvas.toDataURL(e)}},{key:"setCanvasImage",value:function(e,t){t&&Z(t),this.imageName=e,this.canvasImage=t}},{key:"setCssMaxDimension",value:function(e){this.cssMaxWidth=e.width||this.cssMaxWidth,this.cssMaxHeight=e.height||this.cssMaxHeight}},{key:"adjustCanvasDimension",value:function(){var e=this.canvasImage.scale(1),t=e.getBoundingRect(),n=t.width,i=t.height,o=this._calcMaxDimension(n,i);this.setCanvasCssDimension({width:"100%",height:"100%","max-width":o.width+"px","max-height":o.height+"px"}),this.setCanvasBackstoreDimension({width:n,height:i}),this._canvas.centerObject(e)}},{key:"setCanvasCssDimension",value:function(e){this._canvas.setDimensions(e,re)}},{key:"setCanvasBackstoreDimension",value:function(e){this._canvas.setDimensions(e,ae)}},{key:"setImageProperties",value:function(e,t){var n=this.canvasImage;n&&(n.set(e).setCoords(),t&&this._canvas.renderAll())}},{key:"getCanvasElement",value:function(){return this._canvas.getElement()}},{key:"getCanvas",value:function(){return this._canvas}},{key:"getCanvasImage",value:function(){return this.canvasImage}},{key:"getImageName",value:function(){return this.imageName}},{key:"addImageObject",value:function(e){var t=this,n=this._callbackAfterLoadingImageObject.bind(this);return new c.default(function(i){d.default.Image.fromURL(e,function(e){n(e),i(t.createObjectProperties(e))},{crossOrigin:"Anonymous"})})}},{key:"getCenter",value:function(){return this._canvas.getCenter()}},{key:"getCropzoneRect",value:function(){return this.getComponent(G.CROPPER).getCropzoneRect()}},{key:"setCropzoneRect",value:function(e){return this.getComponent(G.CROPPER).setCropzoneRect(e)}},{key:"getCroppedImageData",value:function(e){return this.getComponent(G.CROPPER).getCroppedImageData(e)}},{key:"setBrush",value:function(e){var t=this._drawingMode,n=G.FREE_DRAWING;t===q.LINE&&(n=q.LINE),this.getComponent(n).setBrush(e)}},{key:"setDrawingShape",value:function(e,t){this.getComponent(G.SHAPE).setStates(e,t)}},{key:"registerPaths",value:function(e){this.getComponent(G.ICON).registerPaths(e)}},{key:"changeCursor",value:function(e){var t=this.getCanvas();t.defaultCursor=e,t.renderAll()}},{key:"hasFilter",value:function(e){return this.getComponent(G.FILTER).hasFilter(e)}},{key:"setSelectionStyle",value:function(e){J(K.SELECTION_STYLE,e)}},{key:"setObjectProperties",value:function(e,t){var n=this.getObject(e),i=J({},t);return n.set(i),n.setCoords(),this.getCanvas().renderAll(),i}},{key:"getObjectProperties",value:function(e,t){var n=this.getObject(e),i={};return Q(t)?i[t]=n[t]:$(t)?ee(t,function(e){i[e]=n[e]}):te(t,function(e,t){i[t]=n[t]}),i}},{key:"getObjectPosition",value:function(e,t,n){var i=this.getObject(e);return i?i.getPointByOrigin(t,n):null}},{key:"setObjectPosition",value:function(e,t){var n=this.getObject(e),i=t.x,o=t.y,r=t.originX,a=t.originY;if(!n)return!1;var s=n.getPointByOrigin(r,a),l=n.getPointByOrigin("center","center"),c=l.x-s.x,u=l.y-s.y;return n.set({left:i+c,top:o+u}),n.setCoords(),!0}},{key:"getCanvasSize",value:function(){var e=this.getCanvasImage();return{width:e?e.width:0,height:e?e.height:0}}},{key:"_getDrawingModeInstance",value:function(e){return this._drawingModeMap[e]}},{key:"_setCanvasElement",value:function(e){var t=void 0,n=void 0;t=e.jquery?e[0]:e.nodeType?e:document.querySelector(e),"CANVAS"!==t.nodeName.toUpperCase()&&(n=document.createElement("canvas"),t.appendChild(n)),this._canvas=new d.default.Canvas(n,{containerClass:"tui-image-editor-canvas-container",enableRetinaScaling:!1})}},{key:"_createDrawingModeInstances", -value:function(){this._register(this._drawingModeMap,new D.default),this._register(this._drawingModeMap,new R.default),this._register(this._drawingModeMap,new B.default),this._register(this._drawingModeMap,new F.default),this._register(this._drawingModeMap,new z.default)}},{key:"_createComponents",value:function(){this._register(this._componentMap,new f.default(this)),this._register(this._componentMap,new g.default(this)),this._register(this._componentMap,new m.default(this)),this._register(this._componentMap,new y.default(this)),this._register(this._componentMap,new k.default(this)),this._register(this._componentMap,new x.default(this)),this._register(this._componentMap,new C.default(this)),this._register(this._componentMap,new O.default(this)),this._register(this._componentMap,new j.default(this)),this._register(this._componentMap,new P.default(this))}},{key:"_register",value:function(e,t){e[t.getName()]=t}},{key:"_isSameDrawingMode",value:function(e){return this.getDrawingMode()===e}},{key:"_calcMaxDimension",value:function(e,t){var n=this.cssMaxWidth/e,i=this.cssMaxHeight/t,o=Math.min(e,this.cssMaxWidth),r=Math.min(t,this.cssMaxHeight);return n<1&&n-1&&J(n,this._createTextProperties(e,n)),n}},{key:"_createTextProperties",value:function(e){var t=["text","fontFamily","fontSize","fontStyle","textAlign","textDecoration"],n={};return J(n,X.default.getProperties(e,t)),n}},{key:"_addFabricObject",value:function(e){var t=Z(e);return this._objects[t]=e,t}},{key:"_removeFabricObject",value:function(e){delete this._objects[e]}}]),e}();ne.mixin(se),e.exports=se},function(e,t){"use strict";function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n0&&(e=this.blur(e,t.blurradius,t.blurdelta)),h=0;h0)for(d=0;d0&&(f[d]={r:Math.floor(s[d].r/s[d].n),g:Math.floor(s[d].g/s[d].n),b:Math.floor(s[d].b/s[d].n),a:Math.floor(s[d].a/s[d].n)}),s[d].n/ln[i].boundingbox[2]&&(n[i].boundingbox[2]=r-1),a-1n[i].boundingbox[3]&&(n[i].boundingbox[3]=a-1),h=this.pathscan_combined_lookup[e[a][r]][c],e[a][r]=h[0],c=h[1],r+=h[2],a+=h[3],r-1===n[i].points[0].x&&a-1===n[i].points[0].y)if(u=!0,n[i].points.lengtht[2]&&e[3]>t[3]}},{key:"batchpathscan",value:function(e,t){var n=[];for(var i in e)e.hasOwnProperty(i)&&(n[i]=this.pathscan(e[i],t));return n}},{key:"internodes",value:function(e,t){var n=[],i=0,o=0,r=0,a=0,s=0,l=void 0,c=void 0;for(l=0;l0&&(n[l].points[n[l].points.length-1].linesegment=this.getdirection(n[l].points[n[l].points.length-1].x,n[l].points[n[l].points.length-1].y,e[l].points[c].x,e[l].points[c].y)),n[l].points.push({x:e[l].points[c].x,y:e[l].points[c].y,linesegment:this.getdirection(e[l].points[c].x,e[l].points[c].y,(e[l].points[c].x+e[l].points[o].x)/2,(e[l].points[c].y+e[l].points[o].y)/2)})),n[l].points.push({x:(e[l].points[c].x+e[l].points[o].x)/2,y:(e[l].points[c].y+e[l].points[o].y)/2,linesegment:this.getdirection((e[l].points[c].x+e[l].points[o].x)/2,(e[l].points[c].y+e[l].points[o].y)/2,(e[l].points[o].x+e[l].points[r].x)/2,(e[l].points[o].y+e[l].points[r].y)/2)});return n}},{key:"testrightangle",value:function(e,t,n,i,o,r){return e.points[i].x===e.points[t].x&&e.points[i].x===e.points[n].x&&e.points[i].y===e.points[o].y&&e.points[i].y===e.points[r].y||e.points[i].y===e.points[t].y&&e.points[i].y===e.points[n].y&&e.points[i].x===e.points[o].x&&e.points[i].x===e.points[r].x}},{key:"getdirection",value:function(e,t,n,i){var o=8;return o=ei?7:0:e>n?ti?5:4:ti?6:8}},{key:"batchinternodes",value:function(e,t){var n=[];for(var i in e)e.hasOwnProperty(i)&&(n[i]=this.internodes(e[i],t));return n}},{key:"tracepath",value:function(e,t,n){var i=0,o=void 0,r=void 0,a=void 0,s={};for(s.segments=[],s.boundingbox=e.boundingbox,s.holechildren=e.holechildren,s.isholepath=e.isholepath;i0?a:e.points.length}return s}},{key:"fitseq",value:function(e,t,n,i,o){if(o>e.points.length||o<0)return[];var r=i,a=0,s=!0,l=void 0,c=void 0,u=void 0,d=o-i;d<0&&(d+=e.points.length);for(var h=(e.points[o].x-e.points[i].x)/d,f=(e.points[o].y-e.points[i].y)/d,p=(i+1)%e.points.length,g=void 0;p!=o;)g=p-i,g<0&&(g+=e.points.length),l=e.points[i].x+h*g,c=e.points[i].y+f*g,u=(e.points[p].x-l)*(e.points[p].x-l)+(e.points[p].y-c)*(e.points[p].y-c),u>t&&(s=!1),u>a&&(r=p,a=u),p=(p+1)%e.points.length;if(s)return[{type:"L",x1:e.points[i].x,y1:e.points[i].y,x2:e.points[o].x,y2:e.points[o].y}];var v=r;s=!0,a=0;var m=(v-i)/d,b=(1-m)*(1-m),y=2*(1-m)*m,_=m*m,k=(b*e.points[i].x+_*e.points[o].x-e.points[v].x)/-y,w=(b*e.points[i].y+_*e.points[o].y-e.points[v].y)/-y;for(p=i+1;p!=o;)m=(p-i)/d,b=(1-m)*(1-m),y=2*(1-m)*m,_=m*m,l=b*e.points[i].x+y*k+_*e.points[o].x,c=b*e.points[i].y+y*w+_*e.points[o].y,u=(e.points[p].x-l)*(e.points[p].x-l)+(e.points[p].y-c)*(e.points[p].y-c),u>n&&(s=!1),u>a&&(r=p,a=u),p=(p+1)%e.points.length;if(s)return[{type:"Q",x1:e.points[i].x,y1:e.points[i].y,x2:k,y2:w,x3:e.points[o].x,y3:e.points[o].y}];var x=v;return this.fitseq(e,t,n,i,x).concat(this.fitseq(e,t,n,x,o))}},{key:"batchtracepaths",value:function(e,t,n){var i=[];for(var o in e)e.hasOwnProperty(o)&&i.push(this.tracepath(e[o],t,n));return i}},{key:"batchtracelayers",value:function(e,t,n){var i=[];for(var o in e)e.hasOwnProperty(o)&&(i[o]=this.batchtracepaths(e[o],t,n));return i}},{key:"roundtodec",value:function(e,t){return Number(e.toFixed(t))}},{key:"svgpathstring",value:function(e,t,n,i){var o=e.layers[t],r=o[n],a="",s=void 0;if(i.linefilter&&r.segments.length<3)return a;if(a="=0;s--)a+=c.segments[s].type+" ",c.segments[s].hasOwnProperty("x3")&&(a+=c.segments[s].x2*i.scale+" "+c.segments[s].y2*i.scale+" "),a+=c.segments[s].x1*i.scale+" "+c.segments[s].y1*i.scale+" ";else for(a+=c.segments[c.segments.length-1].hasOwnProperty("x3")?"M "+this.roundtodec(c.segments[c.segments.length-1].x3*i.scale)+" "+this.roundtodec(c.segments[c.segments.length-1].y3*i.scale)+" ":"M "+this.roundtodec(c.segments[c.segments.length-1].x2*i.scale)+" "+this.roundtodec(c.segments[c.segments.length-1].y2*i.scale)+" ",s=c.segments.length-1;s>=0;s--)a+=c.segments[s].type+" ",c.segments[s].hasOwnProperty("x3")&&(a+=this.roundtodec(c.segments[s].x2*i.scale)+" "+this.roundtodec(c.segments[s].y2*i.scale)+" "),a+=this.roundtodec(c.segments[s].x1*i.scale)+" "+this.roundtodec(c.segments[s].y1*i.scale)+" ";a+="Z "}if(a+='" />',i.lcpr||i.qcpr){for(s=0;s',a+='',a+='',a+=''),!r.segments[s].hasOwnProperty("x3")&&i.lcpr&&(a+='');for(var l=0;l',a+='',a+='',a+=''),!c.segments[s].hasOwnProperty("x3")&&i.lcpr&&(a+='')}}return a}},{key:"getsvgstring",value:function(e,t){t=this.checkoptions(t);for(var n=e.width*t.scale,i=e.height*t.scale,o="',r=0;r5&&(t=5),n=Math.abs(n),n>1024&&(n=1024);var p=this.gks[t-1];for(o=0;o0&&i+r0&&o+rn&&(f.data[s]=e.data[s],f.data[s+1]=e.data[s+1],f.data[s+2]=e.data[s+2],f.data[s+3]=e.data[s+3]);return f}},{key:"loadImage",value:function(e,t,n){var i=new Image;n&&n.corsenabled&&(i.crossOrigin="Anonymous"),i.src=e,i.onload=function(){var e=document.createElement("canvas");e.width=i.width,e.height=i.height;var n=e.getContext("2d");n.drawImage(i,0,0),t(e)}}},{key:"getImgdata",value:function(e){var t=e.getContext("2d");return t.getImageData(0,0,e.width,e.height)}},{key:"drawLayers",value:function(e,t,n,i){n=n||1;var o=void 0,r=void 0,a=void 0,s=void 0,l=void 0,c=void 0;i?(c=document.getElementById(i),c||(c=document.createElement("div"),c.id=i,document.body.appendChild(c))):(c=document.createElement("div"),document.body.appendChild(c));for(l in e)if(e.hasOwnProperty(l)){o=e[l][0].length,r=e[l].length;var u=document.createElement("canvas");u.width=o*n,u.height=r*n;var d=u.getContext("2d");for(s=0;sl?"right":"left",originY:o>c?"bottom":"top"}}function o(e){return"center"===e.getOriginX()&&"center"===e.getOriginY()}function r(e,t){var n=t.getPointByOrigin("center","center"),o=-t.getAngle(),r=i(n,e,o),a=r.originX,s=r.originY,l=t.getPointByOrigin(a,s),c=t.getLeft()-(n.x-l.x),u=t.getTop()-(n.x-l.y);t.set({originX:a,originY:s,left:c,top:u}),t.setCoords()}function a(e,t){var n=t.startPoint,o=-t.getAngle(),r=i(n,e,o),a=r.originX,s=r.originY;t.setPositionByOrigin(n,a,s)}function s(e){var t=e.type,n=e.scaleX,i=e.scaleY,o=u[t],r=e[o.w]*n,a=e[o.h]*i;if(e.isRegular){var s=Math.max(n,i);r=e[o.w]*s,a=e[o.h]*s}var l={hasControls:!1,hasBorders:!1,scaleX:1,scaleY:1};l[o.w]=r,l[o.h]=a,e.set(l)}function l(e,t){var n=t.type,i=t.strokeWidth,o=t.startPoint,r=c[n],a=u[n],s=!("triangle"!==t.type),l={},d=Math.abs(o.x-e.x)/r,h=Math.abs(o.y-e.y)/r;d>i&&(d-=i/r),h>i&&(h-=i/r),t.isRegular&&(d=h=Math.max(d,h),s&&(h=Math.sqrt(3)/2*d)),l[a.w]=d,l[a.h]=h,t.set(l)}var c={rect:1,circle:2,triangle:1},u={rect:{w:"width",h:"height"},circle:{w:"rx",h:"ry"},triangle:{w:"width",h:"height"}};e.exports={setOrigins:function(e){var t=e.getPointByOrigin("left","top"),n=e.getPointByOrigin("right","top"),i=e.getPointByOrigin("right","bottom"),o=e.getPointByOrigin("left","bottom");e.origins={lt:t,rt:n,rb:i,lb:o}},resize:function(e,t,i){o(e)&&(r(t,e),n(e)),i?s(e,t):l(t,e),a(t,e)},adjustOriginToCenter:function(e){var t=e.getPointByOrigin("center","center"),n=e.getOriginX(),i=e.getOriginY(),o=e.getPointByOrigin(n,i),r=e.getLeft()+(t.x-o.x),a=e.getTop()+(t.y-o.y);e.set({hasControls:!0,hasBorders:!0,originX:"center",originY:"center",left:r,top:a}),e.setCoords()}}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var r=function(){function e(e,t){for(var n=0;n1?n-1:0),o=1;o1?n-1:0),o=1;on&&(i=t,t=n,n=i),r(t,o(e,n))},keyMirror:function(){for(var e={},t=arguments.length,n=Array(t),o=0;o1&&void 0!==arguments[1]?arguments[1]:"#7e7e7e",i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"up";o(this,e);var r=t.getAttribute("title");this._show=!1,this._colorpickerElement=t,this._toggleDirection=i,this._makePickerButtonElement(t,n),this._makePickerLayerElement(t,r),this._color=n,this.picker=c.default.create({container:this.pickerElement,preset:u,color:n}),this._addEvent(t)}return r(e,[{key:"_changeColorElement",value:function(e){e?(this.colorElement.classList.remove("transparent"),this.colorElement.style.backgroundColor=e):(this.colorElement.style.backgroundColor="#fff",this.colorElement.classList.add("transparent"))}},{key:"_makePickerButtonElement",value:function(e,t){e.classList.add("tui-image-editor-button"),this.colorElement=document.createElement("div"),this.colorElement.className="color-picker-value",t?this.colorElement.style.backgroundColor=t:this.colorElement.classList.add("transparent")}},{key:"_makePickerLayerElement",value:function(e,t){var n=document.createElement("label"),i=document.createElement("div");this.pickerControl=document.createElement("div"),this.pickerControl.className="color-picker-control",this.pickerElement=document.createElement("div"),this.pickerElement.className="color-picker",n.innerHTML=t,i.className="triangle",this.pickerControl.appendChild(this.pickerElement),this.pickerControl.appendChild(i),e.appendChild(this.pickerControl),e.appendChild(this.colorElement),e.appendChild(n)}},{key:"_addEvent",value:function(e){var t=this;this.picker.on("selectColor",function(e){t._changeColorElement(e.color),t._color=e.color,t.fire("change",e.color)}),e.addEventListener("click",function(e){t._show=!t._show,t.pickerControl.style.display=t._show?"block":"none",t._setPickerControlPosition(),t.fire("changeShow",t),e.stopPropagation()}),document.body.addEventListener("click",function(){t.hide()})}},{key:"hide",value:function(){this._show=!1,this.pickerControl.style.display="none"}},{key:"_setPickerControlPosition",value:function(){var e=this.pickerControl.style,t=this._colorpickerElement.clientWidth/2+2,n=this.pickerControl.offsetWidth/2-t,i=(this.pickerControl.offsetHeight+10)*-1;"down"===this._toggleDirection&&(i=30),e.top=i+"px",e.left="-"+n+"px"}},{key:"color",get:function(){return this._color},set:function(e){this._color=e,this._changeColorElement(e)}}]),e}();s.default.CustomEvents.mixin(d),t.default=d},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var r=function(){function e(e,t){for(var n=0;n1&&void 0!==arguments[1]?arguments[1]:{};o(this,e),this._value=n.value||0,this.rangeElement=t,this._drawRangeElement(),this.rangeWidth=(0,l.toInteger)(window.getComputedStyle(t,null).width)-12,this._min=n.min||0,this._max=n.max||100,this._absMax=this._min*-1+this._max,this.realTimeEvent=n.realTimeEvent||!1,this._addClickEvent(),this._addDragEvent(),this.value=n.value,this.trigger("change")}return r(e,[{key:"trigger",value:function(e){this.fire(e,this._value)}},{key:"_drawRangeElement",value:function(){this.rangeElement.classList.add("tui-image-editor-range"),this.bar=document.createElement("div"),this.bar.className="tui-image-editor-virtual-range-bar",this.subbar=document.createElement("div"),this.subbar.className="tui-image-editor-virtual-range-subbar",this.pointer=document.createElement("div"),this.pointer.className="tui-image-editor-virtual-range-pointer",this.bar.appendChild(this.subbar),this.bar.appendChild(this.pointer),this.rangeElement.appendChild(this.bar)}},{key:"_addClickEvent",value:function(){var e=this;this.rangeElement.addEventListener("click",function(t){if(t.stopPropagation(),"tui-image-editor-range"===t.target.className){var n=t.offsetX,i=n/e.rangeWidth,o=e._absMax*i+e._min;e.pointer.style.left=i*e.rangeWidth+"px",e.subbar.style.right=(1-i)*e.rangeWidth+"px",e._value=o,e.fire("change",o)}})}},{key:"_addDragEvent",value:function(){var e=this;this.pointer.addEventListener("mousedown",function(t){e.firstPosition=t.screenX,e.firstLeft=(0,l.toInteger)(e.pointer.style.left)||0,e.dragEventHandler={changeAngle:e._changeAngle.bind(e),stopChangingAngle:e._stopChangingAngle.bind(e)},document.addEventListener("mousemove",e.dragEventHandler.changeAngle),document.addEventListener("mouseup",e.dragEventHandler.stopChangingAngle)})}},{key:"_changeAngle",value:function(e){var t=e.screenX,n=t-this.firstPosition,i=this.firstLeft+n;i=i>this.rangeWidth?this.rangeWidth:i,i=i<0?0:i,this.pointer.style.left=i+"px",this.subbar.style.right=this.rangeWidth-i+"px";var o=i/this.rangeWidth,r=this._absMax*o+this._min;this._value=r,this.realTimeEvent&&this.fire("change",r)}},{key:"_stopChangingAngle",value:function(){this.fire("change",this._value),document.removeEventListener("mousemove",this.dragEventHandler.changeAngle),document.removeEventListener("mouseup",this.dragEventHandler.stopChangingAngle)}},{key:"max",set:function(e){this._max=e,this._absMax=this._min*-1+this._max,this.value=this._value},get:function(){return this._max}},{key:"value",get:function(){return this._value},set:function(e){var t=e-this._min,n=t*this.rangeWidth/this._absMax;this.rangeWidth0?i:n)(e)}},function(e,t,n){var i=n(123),o=n(25);e.exports=function(e){return i(o(e))}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(2),r=i(o),a=n(5),s=(0,a.keyMirror)("UN_IMPLEMENTATION","NO_COMPONENT_NAME"),l={UN_IMPLEMENTATION:"Should implement a method: ",NO_COMPONENT_NAME:"Should set a component name"},c={UN_IMPLEMENTATION:function(e){return l.UN_IMPLEMENTATION+e},NO_COMPONENT_NAME:function(){return l.NO_COMPONENT_NAME}};e.exports={types:r.default.extend({},s),create:function(e){e=e.toLowerCase();for(var t=c[e],n=arguments.length,i=Array(n>1?n-1:0),o=1;on;)t.push(arguments[n++]);return v[++g]=function(){s("function"==typeof e?e:Function(e),t)},i(g),g},f=function(e){delete v[e]},"process"==n(19)(d)?i=function(e){d.nextTick(a(b,e,1))}:p?(o=new p,r=o.port2,o.port1.onmessage=y,i=a(r.postMessage,r,1)):u.addEventListener&&"function"==typeof postMessage&&!u.importScripts?(i=function(e){u.postMessage(e+"","*")},u.addEventListener("message",y,!1)):i=m in c("script")?function(e){l.appendChild(c("script"))[m]=function(){l.removeChild(this),b.call(e)}}:function(e){setTimeout(a(b,e,1),0)}),e.exports={set:h,clear:f}},function(e,t,n){var i=n(29),o=Math.min;e.exports=function(e){return e>0?o(i(e),9007199254740991):0}},function(e,t){var n=0,i=Math.random();e.exports=function(e){return"Symbol(".concat(void 0===e?"":e,")_",(++n+i).toString(36))}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0});var o=n(2),r=n(5),a=i(r),s=n(86),l=i(s);t.default={getActions:function(){return{main:this._mainAction(),shape:this._shapeAction(),crop:this._cropAction(),flip:this._flipAction(),rotate:this._rotateAction(),text:this._textAction(),mask:this._maskAction(),draw:this._drawAction(),icon:this._iconAction(),filter:this._filterAction()}},_mainAction:function(){var e=this,t=function(){"crop"===e.ui.submenu&&(e.stopDrawingMode(),e.ui.changeMenu("crop"))};return(0,o.extend)({initLoadImage:function(n,i){return e.loadImageFromURL(n,i).then(function(i){t(),e.ui.initializeImgUrl=n,e.ui.resizeEditor({imageSize:i}),e.clearUndoStack()})},undo:function(){e.isEmptyUndoStack()||(t(),e.undo())},redo:function(){e.isEmptyRedoStack()||(t(),e.redo())},reset:function(){t(),e.loadImageFromURL(e.ui.initializeImgUrl,"resetImage").then(function(n){t(),e.ui.resizeEditor({imageSize:n}),e.clearUndoStack()})},delete:function(){e.ui.changeDeleteButtonEnabled(!1),t(),e.removeActiveObject(),e.activeObjectId=null},deleteAll:function(){t(),e.clearObjects(),e.ui.changeDeleteButtonEnabled(!1),e.ui.changeDeleteAllButtonEnabled(!1)},load:function(n){a.default.isSupportFileApi()||alert("This browser does not support file-api"),e.ui.initializeImgUrl=URL.createObjectURL(n),e.loadImageFromFile(n).then(function(n){t(),e.clearUndoStack(),e.ui.activeMenuEvent(),e.ui.resizeEditor({imageSize:n})}).catch(function(e){return Promise.reject(e)})},download:function(){var t=e.toDataURL(),n=e.getImageName(),i=void 0,o=void 0,r=void 0;a.default.isSupportFileApi()&&window.saveAs?(i=a.default.base64ToBlob(t),o=i.type.split("/")[1],n.split(".").pop()!==o&&(n+="."+o),saveAs(i,n)):(r=window.open(),r.document.body.innerHTML="")}},this._commonAction())},_iconAction:function(){var e=this,t=void 0,n=void 0,i=void 0,r=void 0,a=void 0,s=void 0,c=void 0;this.on({iconCreateResize:function(t){var n=t.moveOriginPointer,o=(n.x-i)/a,l=(n.y-r)/s;e.setObjectPropertiesQuietly(c,{scaleX:Math.abs(2*o),scaleY:Math.abs(2*l)})},iconCreateEnd:function(){e.ui.icon.clearIconType(),e.changeSelectableAll(!0)}});var u=function(o,l){i=l.x,r=l.y,e.addIcon(t,{left:l.x,top:l.y,fill:n}).then(function(e){c=e.id,a=e.width,s=e.height})};return(0,o.extend)({changeColor:function(t){e.activeObjectId&&e.changeIconColor(e.activeObjectId,t)},addIcon:function(i,o){t=i,n=o,e.changeCursor("crosshair"),e.off("mousedown"),e.once("mousedown",u.bind(e))},cancelAddIcon:function(){e.off("mousedown"),e.ui.icon.clearIconType(),e.changeSelectableAll(!0),e.changeCursor("default")},registDefalutIcons:function(t,n){var i={};i[t]=n,e.registerIcons(i)},registCustomIcon:function(t,n){var i=new l.default;i.imageToSVG(t,function(t){var i=t.match(/path[^>]*d="([^"]*)"/),o=i[1],r={};r[n.name]=o,e.registerIcons(r),e.addIcon(n.name,{left:100,top:100})},l.default.tracerDefaultOption())}},this._commonAction())},_drawAction:function(){var e=this;return(0,o.extend)({setDrawMode:function(t,n){e.stopDrawingMode(),"free"===t?e.startDrawingMode("FREE_DRAWING",n):e.startDrawingMode("LINE_DRAWING",n)},setColor:function(t){e.setBrush({color:t})}},this._commonAction())},_maskAction:function(){var e=this;return(0,o.extend)({loadImageFromURL:function(t,n){return e.loadImageFromURL(e.toDataURL(),"FilterImage").then(function(){e.addImageObject(t).then(function(){URL.revokeObjectURL(n)})})},applyFilter:function(){e.applyFilter("mask",{maskObjId:e.activeObjectId})}},this._commonAction())},_textAction:function(){var e=this;return(0,o.extend)({changeTextStyle:function(t){e.activeObjectId&&e.changeTextStyle(e.activeObjectId,t)}},this._commonAction())},_rotateAction:function(){var e=this;return(0,o.extend)({rotate:function(t){e.rotate(t),e.ui.resizeEditor()},setAngle:function(t){e.setAngle(t),e.ui.resizeEditor()}},this._commonAction())},_shapeAction:function(){var e=this;return(0,o.extend)({changeShape:function(t){e.activeObjectId&&e.changeShape(e.activeObjectId,t)},setDrawingShape:function(t){e.setDrawingShape(t)}},this._commonAction())},_cropAction:function(){var e=this;return(0,o.extend)({crop:function(){var t=e.getCropzoneRect();t&&e.crop(t).then(function(){e.stopDrawingMode(),e.ui.resizeEditor(),e.ui.changeMenu("crop")}).catch(function(e){return Promise.reject(e)})},cancel:function(){e.stopDrawingMode(),e.ui.changeMenu("crop")},preset:function(t){switch(t){case"preset-square":e.setCropzoneRect(1);break;case"preset-3-2":e.setCropzoneRect(1.5);break;case"preset-4-3":e.setCropzoneRect(4/3);break;case"preset-5-4":e.setCropzoneRect(5/4);break;case"preset-7-5":e.setCropzoneRect(1.4);break;case"preset-16-9":e.setCropzoneRect(16/9);break;default:e.setCropzoneRect(),e.ui.crop.changeApplyButtonStatus(!1)}}},this._commonAction())},_flipAction:function(){var e=this;return(0,o.extend)({flip:function(t){return e[t]()}},this._commonAction())},_filterAction:function(){var e=this;return(0,o.extend)({applyFilter:function(t,n,i){t?e.applyFilter(n,i):e.hasFilter(n)&&e.removeFilter(n)}},this._commonAction())},setReAction:function(){var e=this;this.on({undoStackChanged:function(t){t?(e.ui.changeUndoButtonStatus(!0),e.ui.changeResetButtonStatus(!0)):(e.ui.changeUndoButtonStatus(!1),e.ui.changeResetButtonStatus(!1)),e.ui.resizeEditor()},redoStackChanged:function(t){t?e.ui.changeRedoButtonStatus(!0):e.ui.changeRedoButtonStatus(!1),e.ui.resizeEditor()},objectActivated:function(t){e.activeObjectId=t.id,e.ui.changeDeleteButtonEnabled(!0),e.ui.changeDeleteAllButtonEnabled(!0),"cropzone"===t.type?e.ui.crop.changeApplyButtonStatus(!0):["rect","circle","triangle"].indexOf(t.type)>-1?(e.stopDrawingMode(),"shape"!==e.ui.submenu&&e.ui.changeMenu("shape",!1,!1),e.ui.shape.setShapeStatus({strokeColor:t.stroke,strokeWidth:t.strokeWidth,fillColor:t.fill}),e.ui.shape.setMaxStrokeValue(Math.min(t.width,t.height))):"path"===t.type||"line"===t.type?"draw"!==e.ui.submenu&&(e.ui.changeMenu("draw",!1,!1),e.ui.draw.changeStandbyMode()):["i-text","text"].indexOf(t.type)>-1?"text"!==e.ui.submenu&&e.ui.changeMenu("text",!1,!1):"icon"===t.type&&(e.stopDrawingMode(),"icon"!==e.ui.submenu&&e.ui.changeMenu("icon",!1,!1),e.ui.icon.setIconPickerColor(t.fill))},addText:function(t){e.addText("Double Click",{position:t.originPosition,styles:{fill:e.ui.text.textColor,fontSize:a.default.toInteger(e.ui.text.fontSize),fontFamily:"Noto Sans"}}).then(function(){e.changeCursor("default")})},addObjectAfter:function(t){["rect","circle","triangle"].indexOf(t.type)>-1&&(e.ui.shape.setMaxStrokeValue(Math.min(t.width,t.height)),e.ui.shape.changeStandbyMode())},objectScaled:function(t){if(["i-text","text"].indexOf(t.type)>-1)e.ui.text.fontSize=a.default.toInteger(t.fontSize);else if(["rect","circle","triangle"].indexOf(t.type)>=0){var n=t.width,i=t.height,o=e.ui.shape.getStrokeValue();nb&&(r.remove(),r.set(this._calcRectDimensionFromPoint(i,o)),t.add(r))}},{key:"_calcRectDimensionFromPoint",value:function(e,t){var n=this.getCanvas(),i=n.getWidth(),o=n.getHeight(),r=this._startX,a=this._startY,s=(0,m.clamp)(e,0,r),l=(0,m.clamp)(t,0,a),c=(0,m.clamp)(e,r,i)-s,u=(0,m.clamp)(t,a,o)-l;return this._withShiftKey&&(c>u?u=c:u>c&&(c=u),r>=e&&(s=r-c),a>=t&&(l=a-u)),{left:s,top:l,width:c,height:u}}},{key:"_onFabricMouseUp",value:function(){var e=this._cropzone,t=this._listeners,n=this.getCanvas();n.setActiveObject(e),n.off({"mouse:move":t.mousemove,"mouse:up":t.mouseup})}},{key:"getCroppedImageData",value:function(e){var t=this.getCanvas(),n=t.contains(this._cropzone);if(!e)return null;n&&this._cropzone.remove();var i={imageName:this.getImageName(),url:t.toDataURL(e)};return n&&t.add(this._cropzone),i}},{key:"getCropzoneRect",value:function(){var e=this._cropzone;return e.isValid()?{left:e.getLeft(),top:e.getTop(),width:e.getWidth(),height:e.getHeight()}:null}},{key:"setCropzoneRect",value:function(e){var t=this.getCanvas(),n=this._cropzone;t.deactivateAll(),t.selection=!1,n.remove(),n.set(e?this._getPresetCropSizePosition(e):y),t.add(n),t.selection=!0,e&&t.setActiveObject(n)}},{key:"_getPresetCropSizePosition",value:function(e){var t=this.getCanvas(),n=t.getWidth(),i=t.getHeight(),o=n>=i?n:i,r=function(e,t){return e>t?t/e:1},a=o*e,s=o,l=r(a,n),u=c.default.map([a,s],function(e){return e*l});a=u[0],s=u[1];var d=r(s,i),h=c.default.map([a,s],function(e){return e*d});return a=h[0],s=h[1],{top:(i-s)/2,left:(n-a)/2,width:a,height:s}}},{key:"_onKeyDown",value:function(e){e.keyCode===v.keyCodes.SHIFT&&(this._withShiftKey=!0)}},{key:"_onKeyUp",value:function(e){e.keyCode===v.keyCodes.SHIFT&&(this._withShiftKey=!1)}}]),t}(f.default);e.exports=_},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;n=0,c=n.useDragAddIcon&&l,u=a?n._createIcon(a):null;u||o(y.invalidParameters),u.set(d.default.extend({type:"icon",fill:n._oColor},s,t,n.graphics.controlStyle)),r.add(u).setActiveObject(u),c&&n._addWithDragEvent(r),i(n.graphics.createObjectProperties(u))})}},{key:"_addWithDragEvent",value:function(e){var t=this;e.on({"mouse:move":function(n){e.selection=!1,t.fire(b.ICON_CREATE_RESIZE,{moveOriginPointer:e.getPointer(n.e)})},"mouse:up":function(n){t.fire(b.ICON_CREATE_END,{moveOriginPointer:e.getPointer(n.e)}),e.defaultCursor="default",e.off("mouse:up"),e.off("mouse:move"),e.selection=!0}})}},{key:"registerPaths",value:function(e){var t=this;d.default.forEach(e,function(e,n){t._pathMap[n]=e},this)}},{key:"setColor",value:function(e,t){this._oColor=e,t&&"icon"===t.get("type")&&(t.setFill(this._oColor),this.getCanvas().renderAll())}},{key:"getColor",value:function(e){return e.fill}},{key:"_createIcon",value:function(e){return new c.default.Path(e)}}]),t}(g.default);e.exports=k},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var s=function(){function e(e,t){for(var n=0;nn},_getColor:function(e,t,n){var i=[0,0,0,0],o=e.data,r=e.width,a=4,s=(r*n+t)*a;return i[0]=o[s],i[1]=o[s+1],i[2]=o[s+2],i[3]=o[s+3],i}});e.exports=a},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(2),r=i(o),a=n(6),s=i(a),l=n(5),c="tl",u="tr",d="mt",h="ml",f="mr",p="mb",g="bl",v="br",m=s.default.util.createClass(s.default.Rect,{initialize:function(e,t){e=r.default.extend(e,t),e.type="cropzone",this.callSuper("initialize",e),this.options=e,this.on({moving:this._onMoving,scaling:this._onScaling})},_render:function(e){var t=7,n=7;this.callSuper("_render",e);var i=this.flipX?-1:1,o=this.flipY?-1:1,r=i/this.scaleX,a=o/this.scaleY;e.scale(r,a),this._fillOuterRect(e,"rgba(0, 0, 0, 0.55)"),this.options.lineWidth?(this._fillInnerRect(e),this._strokeBorder(e,"rgb(255, 255, 255)",{lineWidth:this.options.lineWidth})):(this._strokeBorder(e,"rgb(0, 0, 0)",{lineDashWidth:t}),this._strokeBorder(e,"rgb(255, 255, 255)",{lineDashWidth:t,lineDashOffset:n})),e.scale(1/r,1/a)},_fillOuterRect:function(e,t){var n=this._getCoordinates(e),i=n.x,o=n.y;e.save(),e.fillStyle=t,e.beginPath(),e.moveTo(i[0]-1,o[0]-1),e.lineTo(i[3]+1,o[0]-1),e.lineTo(i[3]+1,o[3]+1),e.lineTo(i[0]-1,o[3]+1),e.lineTo(i[0]-1,o[0]-1),e.closePath(),e.moveTo(i[1],o[1]),e.lineTo(i[1],o[2]),e.lineTo(i[2],o[2]),e.lineTo(i[2],o[1]),e.lineTo(i[1],o[1]),e.closePath(),e.fill(),e.restore()},_fillInnerRect:function(e){var t=this._getCoordinates(e),n=t.x,i=t.y,o=this._caculateInnerPosition(n,(n[2]-n[1])/3),r=this._caculateInnerPosition(i,(i[2]-i[1])/3);e.save(),e.strokeStyle="rgba(255, 255, 255, 0.7)",e.lineWidth=this.options.lineWidth,e.beginPath(),e.moveTo(o[0],r[1]),e.lineTo(o[3],r[1]),e.moveTo(o[0],r[2]),e.lineTo(o[3],r[2]),e.moveTo(o[1],r[0]),e.lineTo(o[1],r[3]),e.moveTo(o[2],r[0]),e.lineTo(o[2],r[3]),e.stroke(),e.closePath(),e.restore()},_caculateInnerPosition:function(e,t){var n=[];return n[0]=e[1],n[1]=e[1]+t,n[2]=e[1]+2*t,n[3]=e[2],n},_getCoordinates:function(e){var t=this.getWidth(),n=this.getHeight(),i=t/2,o=n/2,a=this.getLeft(),s=this.getTop(),l=e.canvas;return{x:r.default.map([-(i+a),-i,i,i+(l.width-a-t)],Math.ceil),y:r.default.map([-(o+s),-o,o,o+(l.height-s-n)],Math.ceil)}},_strokeBorder:function(e,t,n){var i=n.lineDashWidth,o=n.lineDashOffset,r=n.lineWidth,a=this.getWidth()/2,s=this.getHeight()/2;e.save(),e.strokeStyle=t,e.setLineDash&&e.setLineDash([i,i]),o&&(e.lineDashOffset=o),r&&(e.lineWidth=r),e.beginPath(),e.moveTo(-a,-s),e.lineTo(a,-s),e.lineTo(a,s),e.lineTo(-a,s),e.lineTo(-a,-s),e.stroke(),e.restore()},_onMoving:function(){var e=this.getLeft(),t=this.getTop(),n=this.getWidth(),i=this.getHeight(),o=this.canvas.getWidth()-n,r=this.canvas.getHeight()-i;this.setLeft((0,l.clamp)(e,0,o)),this.setTop((0,l.clamp)(t,0,r))},_onScaling:function(e){var t=this.canvas.getPointer(e.e),n=this._calcScalingSizeFromPointer(t);this.scale(1).set(n)},_calcScalingSizeFromPointer:function(e){var t=e.x,n=e.y,i=this._calcTopLeftScalingSizeFromPointer(t,n),o=this._calcBottomRightScalingSizeFromPointer(t,n);return this._makeScalingSettings(i,o)},_calcTopLeftScalingSizeFromPointer:function(e,t){var n=this.getHeight()+this.top,i=this.getWidth()+this.left,o=(0,l.clamp)(t,0,n-1),r=(0,l.clamp)(e,0,i-1);return{top:o,left:r,width:i-r,height:n-o}},_calcBottomRightScalingSizeFromPointer:function(e,t){var n=this.canvas,i=n.width,o=n.height,r=this.left,a=this.top;return{width:(0,l.clamp)(e,r+1,i)-r,height:(0,l.clamp)(t,a+1,o)-a}},_makeScalingSettings:function(e,t){var n=e.width,i=e.height,o=t.height,r=t.width,a=e.left,s=e.top,l=void 0;switch(this.__corner){case c:l=e;break;case u:l={width:r,height:i,top:s};break;case g:l={width:n,height:o,left:a};break;case v:l=t;break;case h:l={width:n,left:a};break;case d:l={height:i,top:s};break;case f:l={width:r};break;case p:l={height:o}}return l},isValid:function(){return this.left>=0&&this.top>=0&&this.width>0&&this.height>0}});e.exports=m},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(6),r=i(o),a=r.default.util.createClass(r.default.Image.filters.Convolute,{type:"Emboss",initialize:function(){var e=[1,1,1,1,.7,-1,-1,-1,-1];this.matrix=e}});e.exports=a},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o=n(6),r=i(o),a=r.default.util.createClass(r.default.Image.filters.Mask,{applyTo:function(e){if(this.mask){var t=e.width,n=e.height,i=this._createCanvasOfMask(t,n),o=e.getContext("2d"),r=i.getContext("2d"),a=o.getImageData(0,0,t,n);this._drawMask(r,e,o),this._mapData(r,a,t,n),o.putImageData(a,0,0)}},_createCanvasOfMask:function(e,t){var n=r.default.util.createCanvasElement();return n.width=e,n.height=t,n},_drawMask:function(e){var t=this.mask,n=t.getElement(),i=t.getLeft(),o=t.getTop(),r=t.getAngle();e.save(),e.translate(i,o),e.rotate(r*Math.PI/180),e.scale(t.scaleX,t.scaleY),e.drawImage(n,-n.width/2,-n.height/2),e.restore()},_mapData:function(e,t,n,i){for(var o=t.data,r=e.getImageData(0,0,n,i).data,a=this.channel,s=t.width*t.height*4,l=0;l1&&void 0!==arguments[1]?arguments[1]:{},i=n.cssMaxWidth,r=n.cssMaxHeight,a=n.useItext,s=void 0!==a&&a,l=n.useDragAddIcon,c=void 0!==l&&l;o(this,e),this.canvasImage=null,this.cssMaxWidth=i||ie,this.cssMaxHeight=r||oe,this.useItext=s,this.useDragAddIcon=c,this.cropSelectionStyle={},this.imageName="",this._objects={},this._canvas=null,this._drawingMode=q.NORMAL,this._drawingModeMap={},this._componentMap={},this._handler={onMouseDown:this._onMouseDown.bind(this),onObjectAdded:this._onObjectAdded.bind(this),onObjectRemoved:this._onObjectRemoved.bind(this),onObjectMoved:this._onObjectMoved.bind(this),onObjectScaled:this._onObjectScaled.bind(this),onObjectSelected:this._onObjectSelected.bind(this),onPathCreated:this._onPathCreated.bind(this),onSelectionCleared:this._onSelectionCleared.bind(this),onSelectionCreated:this._onSelectionCreated.bind(this)},this._setCanvasElement(t),this._createDrawingModeInstances(),this._createComponents(),this._attachCanvasEvents()}return r(e,[{key:"destroy",value:function(){var e=this._canvas.wrapperEl;this._canvas.clear(),e.parentNode.removeChild(e)}},{key:"deactivateAll",value:function(){return this._canvas.deactivateAll(),this}},{key:"renderAll",value:function(){return this._canvas.renderAll(),this}},{key:"add",value:function(e){var t,n=[];$(e)?n=e:n.push(e),(t=this._canvas).add.apply(t,n)}},{key:"contains",value:function(e){return this._canvas.contains(e)}},{key:"getObjects",value:function(){return this._canvas.getObjects().slice()}},{key:"getObject",value:function(e){return this._objects[e]}},{key:"remove",value:function(e){this._canvas.remove(e)}},{key:"removeAll",value:function(e){var t=this._canvas,n=t.getObjects().slice();return t.remove.apply(t,this._canvas.getObjects()),e&&t.clear(),n}},{key:"removeObjectById",value:function(e){var t=[],n=this._canvas,i=this.getObject(e),o=i&&i.isType("group")&&!i.isEmpty();return o?(n.discardActiveGroup(),i.forEachObject(function(e){t.push(e),e.remove()})):n.contains(i)&&(t.push(i),i.remove()),t}},{key:"getObjectId",value:function(e){var t=null;for(t in this._objects)if(this._objects.hasOwnProperty(t)&&e===this._objects[t])return t;return null}},{key:"getActiveObject",value:function(){return this._canvas.getActiveObject()}},{key:"getActiveGroupObject",value:function(){return this._canvas.getActiveGroup()}},{key:"setActiveObject",value:function(e){this._canvas.setActiveObject(e)}},{key:"setCropSelectionStyle",value:function(e){this.cropSelectionStyle=e}},{key:"getComponent",value:function(e){return this._componentMap[e]}},{key:"getDrawingMode",value:function(){return this._drawingMode}},{key:"startDrawingMode",value:function(e,t){if(this._isSameDrawingMode(e))return!0;this.stopDrawingMode();var n=this._getDrawingModeInstance(e);return n&&n.start&&(n.start(this,t),this._drawingMode=e),!!n}},{key:"stopDrawingMode",value:function(){if(!this._isSameDrawingMode(q.NORMAL)){var e=this._getDrawingModeInstance(this.getDrawingMode());e&&e.end&&e.end(this),this._drawingMode=q.NORMAL}}},{key:"toDataURL",value:function(e){return this._canvas&&this._canvas.toDataURL(e)}},{key:"setCanvasImage",value:function(e,t){t&&Z(t),this.imageName=e,this.canvasImage=t}},{key:"setCssMaxDimension",value:function(e){this.cssMaxWidth=e.width||this.cssMaxWidth,this.cssMaxHeight=e.height||this.cssMaxHeight}},{key:"adjustCanvasDimension",value:function(){var e=this.canvasImage.scale(1),t=e.getBoundingRect(),n=t.width,i=t.height,o=this._calcMaxDimension(n,i);this.setCanvasCssDimension({width:"100%",height:"100%","max-width":o.width+"px","max-height":o.height+"px"}),this.setCanvasBackstoreDimension({width:n,height:i}),this._canvas.centerObject(e)}},{key:"setCanvasCssDimension",value:function(e){this._canvas.setDimensions(e,re)}},{key:"setCanvasBackstoreDimension",value:function(e){this._canvas.setDimensions(e,ae)}},{key:"setImageProperties",value:function(e,t){var n=this.canvasImage;n&&(n.set(e).setCoords(),t&&this._canvas.renderAll())}},{key:"getCanvasElement",value:function(){return this._canvas.getElement()}},{key:"getCanvas",value:function(){return this._canvas}},{key:"getCanvasImage",value:function(){return this.canvasImage}},{key:"getImageName",value:function(){return this.imageName}},{key:"addImageObject",value:function(e){var t=this,n=this._callbackAfterLoadingImageObject.bind(this);return new c.default(function(i){d.default.Image.fromURL(e,function(e){n(e),i(t.createObjectProperties(e))},{crossOrigin:"Anonymous"})})}},{key:"getCenter",value:function(){return this._canvas.getCenter()}},{key:"getCropzoneRect",value:function(){return this.getComponent(G.CROPPER).getCropzoneRect()}},{key:"setCropzoneRect",value:function(e){this.getComponent(G.CROPPER).setCropzoneRect(e)}},{key:"getCroppedImageData",value:function(e){return this.getComponent(G.CROPPER).getCroppedImageData(e)}},{key:"setBrush",value:function(e){var t=this._drawingMode,n=G.FREE_DRAWING;t===q.LINE&&(n=q.LINE),this.getComponent(n).setBrush(e)}},{key:"setDrawingShape",value:function(e,t){this.getComponent(G.SHAPE).setStates(e,t)}},{key:"registerPaths",value:function(e){this.getComponent(G.ICON).registerPaths(e)}},{key:"changeCursor",value:function(e){var t=this.getCanvas();t.defaultCursor=e,t.renderAll()}},{key:"hasFilter",value:function(e){return this.getComponent(G.FILTER).hasFilter(e)}},{key:"setSelectionStyle",value:function(e){J(K.SELECTION_STYLE,e)}},{key:"setObjectProperties",value:function(e,t){var n=this.getObject(e),i=J({},t);return n.set(i),n.setCoords(),this.getCanvas().renderAll(),i}},{key:"getObjectProperties",value:function(e,t){var n=this.getObject(e),i={};return Q(t)?i[t]=n[t]:$(t)?ee(t,function(e){i[e]=n[e]}):te(t,function(e,t){i[t]=n[t]}),i}},{key:"getObjectPosition",value:function(e,t,n){var i=this.getObject(e);return i?i.getPointByOrigin(t,n):null}},{key:"setObjectPosition",value:function(e,t){var n=this.getObject(e),i=t.x,o=t.y,r=t.originX,a=t.originY;if(!n)return!1;var s=n.getPointByOrigin(r,a),l=n.getPointByOrigin("center","center"),c=l.x-s.x,u=l.y-s.y;return n.set({left:i+c,top:o+u}),n.setCoords(),!0}},{key:"getCanvasSize",value:function(){var e=this.getCanvasImage();return{width:e?e.width:0,height:e?e.height:0}}},{key:"_getDrawingModeInstance",value:function(e){return this._drawingModeMap[e]}},{key:"_setCanvasElement",value:function(e){var t=void 0,n=void 0;t=e.jquery?e[0]:e.nodeType?e:document.querySelector(e),"CANVAS"!==t.nodeName.toUpperCase()&&(n=document.createElement("canvas"),t.appendChild(n)),this._canvas=new d.default.Canvas(n,{containerClass:"tui-image-editor-canvas-container", +enableRetinaScaling:!1})}},{key:"_createDrawingModeInstances",value:function(){this._register(this._drawingModeMap,new D.default),this._register(this._drawingModeMap,new R.default),this._register(this._drawingModeMap,new B.default),this._register(this._drawingModeMap,new z.default),this._register(this._drawingModeMap,new H.default)}},{key:"_createComponents",value:function(){this._register(this._componentMap,new f.default(this)),this._register(this._componentMap,new g.default(this)),this._register(this._componentMap,new m.default(this)),this._register(this._componentMap,new y.default(this)),this._register(this._componentMap,new k.default(this)),this._register(this._componentMap,new x.default(this)),this._register(this._componentMap,new C.default(this)),this._register(this._componentMap,new O.default(this)),this._register(this._componentMap,new j.default(this)),this._register(this._componentMap,new P.default(this))}},{key:"_register",value:function(e,t){e[t.getName()]=t}},{key:"_isSameDrawingMode",value:function(e){return this.getDrawingMode()===e}},{key:"_calcMaxDimension",value:function(e,t){var n=this.cssMaxWidth/e,i=this.cssMaxHeight/t,o=Math.min(e,this.cssMaxWidth),r=Math.min(t,this.cssMaxHeight);return n<1&&n-1&&J(n,this._createTextProperties(e,n)),n}},{key:"_createTextProperties",value:function(e){var t=["text","fontFamily","fontSize","fontStyle","textAlign","textDecoration"],n={};return J(n,X.default.getProperties(e,t)),n}},{key:"_addFabricObject",value:function(e){var t=Z(e);return this._objects[t]=e,t}},{key:"_removeFabricObject",value:function(e){delete this._objects[e]}}]),e}();ne.mixin(se),e.exports=se},function(e,t){"use strict";function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var i=function(){function e(e,t){for(var n=0;n0&&(e=this.blur(e,t.blurradius,t.blurdelta)),h=0;h0)for(d=0;d0&&(f[d]={r:Math.floor(s[d].r/s[d].n),g:Math.floor(s[d].g/s[d].n),b:Math.floor(s[d].b/s[d].n),a:Math.floor(s[d].a/s[d].n)}),s[d].n/ln[i].boundingbox[2]&&(n[i].boundingbox[2]=r-1),a-1n[i].boundingbox[3]&&(n[i].boundingbox[3]=a-1),h=this.pathscan_combined_lookup[e[a][r]][c],e[a][r]=h[0],c=h[1],r+=h[2],a+=h[3],r-1===n[i].points[0].x&&a-1===n[i].points[0].y)if(u=!0,n[i].points.lengtht[2]&&e[3]>t[3]}},{key:"batchpathscan",value:function(e,t){var n=[];for(var i in e)e.hasOwnProperty(i)&&(n[i]=this.pathscan(e[i],t));return n}},{key:"internodes",value:function(e,t){var n=[],i=0,o=0,r=0,a=0,s=0,l=void 0,c=void 0;for(l=0;l0&&(n[l].points[n[l].points.length-1].linesegment=this.getdirection(n[l].points[n[l].points.length-1].x,n[l].points[n[l].points.length-1].y,e[l].points[c].x,e[l].points[c].y)),n[l].points.push({x:e[l].points[c].x,y:e[l].points[c].y,linesegment:this.getdirection(e[l].points[c].x,e[l].points[c].y,(e[l].points[c].x+e[l].points[o].x)/2,(e[l].points[c].y+e[l].points[o].y)/2)})),n[l].points.push({x:(e[l].points[c].x+e[l].points[o].x)/2,y:(e[l].points[c].y+e[l].points[o].y)/2,linesegment:this.getdirection((e[l].points[c].x+e[l].points[o].x)/2,(e[l].points[c].y+e[l].points[o].y)/2,(e[l].points[o].x+e[l].points[r].x)/2,(e[l].points[o].y+e[l].points[r].y)/2)});return n}},{key:"testrightangle",value:function(e,t,n,i,o,r){return e.points[i].x===e.points[t].x&&e.points[i].x===e.points[n].x&&e.points[i].y===e.points[o].y&&e.points[i].y===e.points[r].y||e.points[i].y===e.points[t].y&&e.points[i].y===e.points[n].y&&e.points[i].x===e.points[o].x&&e.points[i].x===e.points[r].x}},{key:"getdirection",value:function(e,t,n,i){var o=8;return o=ei?7:0:e>n?ti?5:4:ti?6:8}},{key:"batchinternodes",value:function(e,t){var n=[];for(var i in e)e.hasOwnProperty(i)&&(n[i]=this.internodes(e[i],t));return n}},{key:"tracepath",value:function(e,t,n){var i=0,o=void 0,r=void 0,a=void 0,s={};for(s.segments=[],s.boundingbox=e.boundingbox,s.holechildren=e.holechildren,s.isholepath=e.isholepath;i0?a:e.points.length}return s}},{key:"fitseq",value:function(e,t,n,i,o){if(o>e.points.length||o<0)return[];var r=i,a=0,s=!0,l=void 0,c=void 0,u=void 0,d=o-i;d<0&&(d+=e.points.length);for(var h=(e.points[o].x-e.points[i].x)/d,f=(e.points[o].y-e.points[i].y)/d,p=(i+1)%e.points.length,g=void 0;p!=o;)g=p-i,g<0&&(g+=e.points.length),l=e.points[i].x+h*g,c=e.points[i].y+f*g,u=(e.points[p].x-l)*(e.points[p].x-l)+(e.points[p].y-c)*(e.points[p].y-c),u>t&&(s=!1),u>a&&(r=p,a=u),p=(p+1)%e.points.length;if(s)return[{type:"L",x1:e.points[i].x,y1:e.points[i].y,x2:e.points[o].x,y2:e.points[o].y}];var v=r;s=!0,a=0;var m=(v-i)/d,b=(1-m)*(1-m),y=2*(1-m)*m,_=m*m,k=(b*e.points[i].x+_*e.points[o].x-e.points[v].x)/-y,w=(b*e.points[i].y+_*e.points[o].y-e.points[v].y)/-y;for(p=i+1;p!=o;)m=(p-i)/d,b=(1-m)*(1-m),y=2*(1-m)*m,_=m*m,l=b*e.points[i].x+y*k+_*e.points[o].x,c=b*e.points[i].y+y*w+_*e.points[o].y,u=(e.points[p].x-l)*(e.points[p].x-l)+(e.points[p].y-c)*(e.points[p].y-c),u>n&&(s=!1),u>a&&(r=p,a=u),p=(p+1)%e.points.length;if(s)return[{type:"Q",x1:e.points[i].x,y1:e.points[i].y,x2:k,y2:w,x3:e.points[o].x,y3:e.points[o].y}];var x=v;return this.fitseq(e,t,n,i,x).concat(this.fitseq(e,t,n,x,o))}},{key:"batchtracepaths",value:function(e,t,n){var i=[];for(var o in e)e.hasOwnProperty(o)&&i.push(this.tracepath(e[o],t,n));return i}},{key:"batchtracelayers",value:function(e,t,n){var i=[];for(var o in e)e.hasOwnProperty(o)&&(i[o]=this.batchtracepaths(e[o],t,n));return i}},{key:"roundtodec",value:function(e,t){return Number(e.toFixed(t))}},{key:"svgpathstring",value:function(e,t,n,i){var o=e.layers[t],r=o[n],a="",s=void 0;if(i.linefilter&&r.segments.length<3)return a;if(a="=0;s--)a+=c.segments[s].type+" ",c.segments[s].hasOwnProperty("x3")&&(a+=c.segments[s].x2*i.scale+" "+c.segments[s].y2*i.scale+" "),a+=c.segments[s].x1*i.scale+" "+c.segments[s].y1*i.scale+" ";else for(a+=c.segments[c.segments.length-1].hasOwnProperty("x3")?"M "+this.roundtodec(c.segments[c.segments.length-1].x3*i.scale)+" "+this.roundtodec(c.segments[c.segments.length-1].y3*i.scale)+" ":"M "+this.roundtodec(c.segments[c.segments.length-1].x2*i.scale)+" "+this.roundtodec(c.segments[c.segments.length-1].y2*i.scale)+" ",s=c.segments.length-1;s>=0;s--)a+=c.segments[s].type+" ",c.segments[s].hasOwnProperty("x3")&&(a+=this.roundtodec(c.segments[s].x2*i.scale)+" "+this.roundtodec(c.segments[s].y2*i.scale)+" "),a+=this.roundtodec(c.segments[s].x1*i.scale)+" "+this.roundtodec(c.segments[s].y1*i.scale)+" ";a+="Z "}if(a+='" />',i.lcpr||i.qcpr){for(s=0;s',a+='',a+='',a+=''),!r.segments[s].hasOwnProperty("x3")&&i.lcpr&&(a+='');for(var l=0;l',a+='',a+='',a+=''),!c.segments[s].hasOwnProperty("x3")&&i.lcpr&&(a+='')}}return a}},{key:"getsvgstring",value:function(e,t){t=this.checkoptions(t);for(var n=e.width*t.scale,i=e.height*t.scale,o="',r=0;r5&&(t=5),n=Math.abs(n),n>1024&&(n=1024);var p=this.gks[t-1];for(o=0;o0&&i+r0&&o+rn&&(f.data[s]=e.data[s],f.data[s+1]=e.data[s+1],f.data[s+2]=e.data[s+2],f.data[s+3]=e.data[s+3]);return f}},{key:"loadImage",value:function(e,t,n){var i=new Image;n&&n.corsenabled&&(i.crossOrigin="Anonymous"),i.src=e,i.onload=function(){var e=document.createElement("canvas");e.width=i.width,e.height=i.height;var n=e.getContext("2d");n.drawImage(i,0,0),t(e)}}},{key:"getImgdata",value:function(e){var t=e.getContext("2d");return t.getImageData(0,0,e.width,e.height)}},{key:"drawLayers",value:function(e,t,n,i){n=n||1;var o=void 0,r=void 0,a=void 0,s=void 0,l=void 0,c=void 0;i?(c=document.getElementById(i),c||(c=document.createElement("div"),c.id=i,document.body.appendChild(c))):(c=document.createElement("div"),document.body.appendChild(c));for(l in e)if(e.hasOwnProperty(l)){o=e[l][0].length,r=e[l].length;var u=document.createElement("canvas");u.width=o*n,u.height=r*n;var d=u.getContext("2d");for(s=0;sl?"right":"left",originY:o>c?"bottom":"top"}}function o(e){return"center"===e.getOriginX()&&"center"===e.getOriginY()}function r(e,t){var n=t.getPointByOrigin("center","center"),o=-t.getAngle(),r=i(n,e,o),a=r.originX,s=r.originY,l=t.getPointByOrigin(a,s),c=t.getLeft()-(n.x-l.x),u=t.getTop()-(n.x-l.y);t.set({originX:a,originY:s,left:c,top:u}),t.setCoords()}function a(e,t){var n=t.startPoint,o=-t.getAngle(),r=i(n,e,o),a=r.originX,s=r.originY;t.setPositionByOrigin(n,a,s)}function s(e){var t=e.type,n=e.scaleX,i=e.scaleY,o=u[t],r=e[o.w]*n,a=e[o.h]*i;if(e.isRegular){var s=Math.max(n,i);r=e[o.w]*s,a=e[o.h]*s}var l={hasControls:!1,hasBorders:!1,scaleX:1,scaleY:1};l[o.w]=r,l[o.h]=a,e.set(l)}function l(e,t){var n=t.type,i=t.strokeWidth,o=t.startPoint,r=c[n],a=u[n],s=!("triangle"!==t.type),l={},d=Math.abs(o.x-e.x)/r,h=Math.abs(o.y-e.y)/r;d>i&&(d-=i/r),h>i&&(h-=i/r),t.isRegular&&(d=h=Math.max(d,h),s&&(h=Math.sqrt(3)/2*d)),l[a.w]=d,l[a.h]=h,t.set(l)}var c={rect:1,circle:2,triangle:1},u={rect:{w:"width",h:"height"},circle:{w:"rx",h:"ry"},triangle:{w:"width",h:"height"}};e.exports={setOrigins:function(e){var t=e.getPointByOrigin("left","top"),n=e.getPointByOrigin("right","top"),i=e.getPointByOrigin("right","bottom"),o=e.getPointByOrigin("left","bottom");e.origins={lt:t,rt:n,rb:i,lb:o}},resize:function(e,t,i){o(e)&&(r(t,e),n(e)),i?s(e,t):l(t,e),a(t,e)},adjustOriginToCenter:function(e){var t=e.getPointByOrigin("center","center"),n=e.getOriginX(),i=e.getOriginY(),o=e.getPointByOrigin(n,i),r=e.getLeft()+(t.x-o.x),a=e.getTop()+(t.y-o.y);e.set({hasControls:!0,hasBorders:!0,originX:"center",originY:"center",left:r,top:a}),e.setCoords()}}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var r=function(){function e(e,t){for(var n=0;n1?n-1:0),o=1;o0&&void 0!==arguments[0]?arguments[0]:{},t=e.uiSize,n=e.imageSize,i=void 0===n?this.imageSize:n;i!==this.imageSize&&(this.imageSize=i),t&&this._setUiSize(t);var o=this._getEditorDimension(),r=o.width,a=o.height,s=this._editorElement.style,l=this.options.menuBarPosition;s.height=a+"px",s.width=r+"px",this._setEditorPosition(l),this._editorElementWrap.style.bottom="0px",this._editorElementWrap.style.top="0px",this._editorElementWrap.style.left="0px",this._editorElementWrap.style.width="100%";var c=this._selectedElement.classList;"top"===l&&this._selectedElement.offsetWidth0&&void 0!==arguments[0]?arguments[0]:this.options.uiSize,t=this._selectedElement.style;t.width=e.width,t.height=e.height}},{key:"_makeSubMenu",value:function(){var e=this;s.default.forEach(this.options.menu,function(t){var n=I[t.replace(/^[a-z]/,function(e){return e.toUpperCase()})];e._makeMenuElement(t),e._els[t]=e._menuElement.querySelector("#tie-btn-"+t),e[t]=new n(e._subMenuElement,{iconStyle:e.theme.getStyle("submenu.icon"),menuBarPosition:e.options.menuBarPosition})})}},{key:"_makeUiElement",value:function(e){var t=void 0;window.snippet=s.default,t=e.jquery?e[0]:e.nodeType?e:document.querySelector(e);var n=c.default.getSelector(t);t.classList.add("tui-image-editor-container"),t.innerHTML=(0,f.default)({biImage:this.theme.getStyle("common.bi"),iconStyle:this.theme.getStyle("menu.icon"),loadButtonStyle:this.theme.getStyle("loadButton"),downloadButtonStyle:this.theme.getStyle("downloadButton")})+(0,d.default)({biImage:this.theme.getStyle("common.bi"),commonStyle:this.theme.getStyle("common"),headerStyle:this.theme.getStyle("header"),loadButtonStyle:this.theme.getStyle("loadButton"),downloadButtonStyle:this.theme.getStyle("downloadButton"),submenuStyle:this.theme.getStyle("submenu")}),this._selectedElement=t,this._selectedElement.classList.add(this.options.menuBarPosition),this._mainElement=n(".tui-image-editor-main"),this._editorElementWrap=n(".tui-image-editor-wrap"),this._editorElement=n(".tui-image-editor"),this._menuElement=n(".tui-image-editor-menu"),this._subMenuElement=n(".tui-image-editor-submenu")}},{key:"_makeMenuElement",value:function(e){var t=document.createElement("li"),n=this.theme.getStyle("menu.icon"),i=n.normal,o=n.active,r=n.hover,a='\n \n \n \n \n \n ';t.id="tie-btn-"+e,t.className="tui-image-editor-item normal",t.title=e.replace(/^[a-z]/g,function(e){return e.toUpperCase()}),t.innerHTML=a,this._menuElement.appendChild(t)}},{key:"_addHelpActionEvent",value:function(e){var t=this;this._els[e].addEventListener("click",function(){t._actions.main[e]()})}},{key:"_addDownloadEvent",value:function(){var e=this;s.default.forEach(this._els.download,function(t){t.addEventListener("click",function(){e._actions.main.download()})})}},{key:"_addLoadEvent",value:function(){var e=this;s.default.forEach(this._els.load,function(t){t.addEventListener("change",function(t){e._actions.main.load(t.target.files[0])})})}},{key:"_addMenuEvent",value:function(e){var t=this;this._els[e].addEventListener("click",function(){t.changeMenu(e)})}},{key:"_addSubMenuEvent",value:function(e){this[e].addEvent(this._actions[e])}},{key:"getEditorArea",value:function(){return this._editorElement}},{key:"activeMenuEvent",value:function(){var e=this;this._initMenuEvent||(this._addHelpActionEvent("undo"),this._addHelpActionEvent("redo"),this._addHelpActionEvent("reset"),this._addHelpActionEvent("delete"),this._addHelpActionEvent("deleteAll"),this._addDownloadEvent(),s.default.forEach(this.options.menu,function(t){e._addMenuEvent(t),e._addSubMenuEvent(t)}),this._initMenu(),this._initMenuEvent=!0)}},{key:"initCanvas",value:function(){var e=this,t=this._getLoadImage();t.path&&this._actions.main.initLoadImage(t.path,t.name).then(function(){e.activeMenuEvent()}),this._addLoadEvent();var n=document.createElement("div");n.className="tui-image-editor-grid-visual";var i='\n \n \n \n
    ';n.innerHTML=i,this._editorContainerElement=this._editorElement.querySelector(".tui-image-editor-canvas-container"),this._editorContainerElement.appendChild(n)}},{key:"_getLoadImage",value:function(){return this.options.loadImage}},{key:"changeMenu",value:function(e){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],n=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];this._submenuChangeTransection||(this._submenuChangeTransection=!0,this._changeMenu(e,t,n),this._submenuChangeTransection=!1)}},{key:"_changeMenu",value:function(e,t,n){this.submenu&&(this._els[this.submenu].classList.remove("active"),this._mainElement.classList.remove("tui-image-editor-menu-"+this.submenu),n&&this._actions.main.discardSelection(),this._actions.main.changeSelectableAll(!0),this[this.submenu].changeStandbyMode()),this.submenu===e&&t?this.submenu=null:(this._els[e].classList.add("active"),this._mainElement.classList.add("tui-image-editor-menu-"+e),this.submenu=e,this[this.submenu].changeStartMode()),this.resizeEditor()}},{key:"_initMenu",value:function(){if(this.options.initMenu){var e=document.createEvent("MouseEvents");e.initEvent("click",!0,!1),this._els[this.options.initMenu].dispatchEvent(e),this.icon&&this.icon.registDefaultIcon()}}},{key:"_getEditorDimension",value:function(){var e=parseFloat(this._editorContainerElement.style.maxHeight),t=this.imageSize.newHeight>e?e:this.imageSize.newHeight,n=parseFloat(this._editorContainerElement.style.maxWidth),i=this.imageSize.newWidth>n?n:this.imageSize.newWidth;return{width:i,height:t}}},{key:"_setEditorPosition",value:function(e){var t=this._getEditorDimension(),n=t.width,i=t.height,o=this._editorElement.style,r=0,a=0;this.submenu&&("bottom"===e?r=i>this._editorElementWrap.scrollHeight-150?(i-this._editorElementWrap.scrollHeight)/2:-75:"top"===e?r=i>this._editorElementWrap.offsetHeight-150?75-(i-(this._editorElementWrap.offsetHeight-150))/2:75:"left"===e?a=n>this._editorElementWrap.offsetWidth-248?124-(n-(this._editorElementWrap.offsetWidth-248))/2:124:"right"===e&&(a=n>this._editorElementWrap.scrollWidth-248?(n-this._editorElementWrap.scrollWidth)/2:-124)),o.top=r+"px",o.left=a+"px"}}]),e}();t.default=L},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n0&&void 0!==arguments[0]?arguments[0]:this.defaultPresetButton;c.default.forEach([].slice.call(this._els.preset.querySelectorAll(".preset")),function(e){e.classList.remove("active")}),e&&e.classList.add("active")}}]),t}(d.default);t.default=p},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n\n \n
      \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    \n\n
    \n \n \n
    \n \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.biImage,n=e.commonStyle,i=e.headerStyle,o=e.loadButtonStyle,r=e.downloadButtonStyle,a=e.submenuStyle;return'\n
    \n
    \n \n
    \n \n \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.subMenuLabelActive,n=e.subMenuLabelNormal,i=e.subMenuRangeTitle,o=e.submenuPartitionVertical,r=e.submenuPartitionHorizontal,a=e.submenuCheckbox,s=e.submenuRangePointer,l=e.submenuRangeValue,c=e.submenuColorpickerTitle,u=e.submenuColorpickerButton,d=e.submenuRangeBar,h=e.submenuRangeSubbar,f=e.submenuDisabledRangePointer,p=e.submenuDisabledRangeBar,g=e.submenuDisabledRangeSubbar,v=e.submenuIconSize,m=e.menuIconSize,b=e.biSize;return'\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype="icon-bubble"] label,\n #tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype="icon-heart"] label,\n #tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype="icon-location"] label,\n #tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype="icon-polygon"] label,\n #tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype="icon-star"] label,\n #tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype="icon-arrow-3"] label,\n #tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype="icon-arrow-2"] label,\n #tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype="icon-arrow"] label,\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype="icon-bubble"] label,\n #tie-draw-line-select-button.line .tui-image-editor-button.line label,\n #tie-draw-line-select-button.free .tui-image-editor-button.free label,\n #tie-flip-button.flipX .tui-image-editor-button.flipX label,\n #tie-flip-button.flipY .tui-image-editor-button.flipY label,\n #tie-flip-button.resetFlip .tui-image-editor-button.resetFlip label,\n #tie-crop-button .tui-image-editor-button.apply.active label,\n #tie-crop-preset-button .tui-image-editor-button.preset.active label,\n #tie-shape-button.rect .tui-image-editor-button.rect label,\n #tie-shape-button.circle .tui-image-editor-button.circle label,\n #tie-shape-button.triangle .tui-image-editor-button.triangle label,\n #tie-text-effect-button .tui-image-editor-button.active label,\n #tie-text-align-button.left .tui-image-editor-button.left label,\n #tie-text-align-button.center .tui-image-editor-button.center label,\n #tie-text-align-button.right .tui-image-editor-button.right label,\n #tie-mask-apply.apply.active .tui-image-editor-button.apply label,\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover > label,\n .tui-image-editor-container .tui-image-editor-checkbox input + label {\n '+t+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button > label,\n .tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label {\n "+n+"\n }\n .tui-image-editor-container .tui-image-editor-range-wrap label {\n "+i+"\n }\n .tui-image-editor-container .tui-image-editor-partition > div {\n "+o+"\n }\n .tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition > div,\n .tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition > div {\n "+r+"\n }\n .tui-image-editor-container .tui-image-editor-checkbox input + label:before {\n "+a+"\n }\n .tui-image-editor-container .tui-image-editor-checkbox input:checked + label:before {\n border: 0;\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-pointer {\n "+s+"\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-bar {\n "+d+"\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-subbar {\n "+h+"\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-pointer {\n "+f+"\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-subbar {\n "+g+"\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-bar {\n "+p+"\n }\n .tui-image-editor-container .tui-image-editor-range-value {\n "+l+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value + label {\n "+c+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value {\n "+u+"\n }\n .tui-image-editor-container .svg_ic-menu {\n "+m+"\n }\n .tui-image-editor-container .svg_ic-submenu {\n "+v+"\n }\n .tui-image-editor-container .tui-image-editor-controls-logo > img,\n .tui-image-editor-container .tui-image-editor-header-logo > img {\n "+b+"\n }\n\n"}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n \n \n \n \n \n
      \n
      \n \n \n \n \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(){return'\n
      \n
    • \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n\n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    \n'; -}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n \n \n \n \n \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.iconStyle,n=t.normal,i=t.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n-1&&"none"!==e&&(e="url("+e+")"),n.push(t._toUnderScore(i)+": "+e)}),n.join(";")}},{key:"_toUnderScore",value:function(e){return e.replace(/([A-Z])/g,function(e,t){return"-"+t.toLowerCase()})}}]),e}();t.default=h},function(e,t){e.exports=function(){}},function(e,t){e.exports=function(e,t,n,i){if(!(e instanceof t)||void 0!==i&&i in e)throw TypeError(n+": incorrect invocation!");return e}},function(e,t,n){var i=n(30),o=n(42),r=n(139);e.exports=function(e){return function(t,n,a){var s,l=i(t),c=o(l.length),u=r(a,c);if(e&&n!=n){for(;c>u;)if(s=l[u++],s!=s)return!0}else for(;c>u;u++)if((e||u in l)&&l[u]===n)return e||u||0;return!e&&-1}}},function(e,t,n){var i=n(20),o=n(124),r=n(123),a=n(11),s=n(42),l=n(142),c={},u={},t=e.exports=function(e,t,n,d,h){var f,p,g,v,m=h?function(){return e}:l(e),b=i(n,d,t?2:1),y=0;if("function"!=typeof m)throw TypeError(e+" is not iterable!");if(r(m)){for(f=s(e.length);f>y;y++)if(v=t?b(a(p=e[y])[0],p[1]):b(e[y]),v===c||v===u)return v}else for(g=m.call(e);!(p=g.next()).done;)if(v=o(g,b,p.value,t),v===c||v===u)return v};t.BREAK=c,t.RETURN=u},function(e,t,n){e.exports=!n(17)&&!n(35)(function(){return 7!=Object.defineProperty(n(26)("div"),"a",{get:function(){return 7}}).a})},function(e,t){e.exports=function(e,t,n){var i=void 0===n;switch(t.length){case 0:return i?e():e.call(n);case 1:return i?e(t[0]):e.call(n,t[0]);case 2:return i?e(t[0],t[1]):e.call(n,t[0],t[1]);case 3:return i?e(t[0],t[1],t[2]):e.call(n,t[0],t[1],t[2]);case 4:return i?e(t[0],t[1],t[2],t[3]):e.call(n,t[0],t[1],t[2],t[3])}return e.apply(n,t)}},function(e,t,n){var i=n(19);e.exports=Object("z").propertyIsEnumerable(0)?Object:function(e){return"String"==i(e)?e.split(""):Object(e)}},function(e,t,n){var i=n(18),o=n(7)("iterator"),r=Array.prototype;e.exports=function(e){return void 0!==e&&(i.Array===e||r[o]===e)}},function(e,t,n){var i=n(11);e.exports=function(e,t,n,o){try{return o?t(i(n)[0],n[1]):t(n)}catch(t){var r=e.return;throw void 0!==r&&i(r.call(e)),t}}},function(e,t,n){"use strict";var i=n(129),o=n(39),r=n(27),a={};n(12)(a,n(7)("iterator"),function(){return this}),e.exports=function(e,t,n){e.prototype=i(a,{next:o(1,n)}),r(e,t+" Iterator")}},function(e,t,n){var i=n(7)("iterator"),o=!1;try{var r=[7][i]();r.return=function(){o=!0},Array.from(r,function(){throw 2})}catch(e){}e.exports=function(e,t){if(!t&&!o)return!1;var n=!1;try{var r=[7],a=r[i]();a.next=function(){return{done:n=!0}},r[i]=function(){return a},e(r)}catch(e){}return n}},function(e,t){e.exports=function(e,t){return{value:t,done:!!e}}},function(e,t,n){var i=n(9),o=n(41).set,r=i.MutationObserver||i.WebKitMutationObserver,a=i.process,s=i.Promise,l="process"==n(19)(a);e.exports=function(){var e,t,n,c=function(){var i,o;for(l&&(i=a.domain)&&i.exit();e;){o=e.fn,e=e.next;try{o()}catch(i){throw e?n():t=void 0,i}}t=void 0,i&&i.enter()};if(l)n=function(){a.nextTick(c)};else if(r){var u=!0,d=document.createTextNode("");new r(c).observe(d,{characterData:!0}),n=function(){d.data=u=!u}}else if(s&&s.resolve){var h=s.resolve();n=function(){h.then(c)}}else n=function(){o.call(i,c)};return function(i){var o={fn:i,next:void 0};t&&(t.next=o),e||(e=o,n()),t=o}}},function(e,t,n){var i=n(11),o=n(130),r=n(33),a=n(28)("IE_PROTO"),s=function(){},l="prototype",c=function(){var e,t=n(26)("iframe"),i=r.length,o="<",a=">";for(t.style.display="none",n(36).appendChild(t),t.src="javascript:",e=t.contentWindow.document,e.open(),e.write(o+"script"+a+"document.F=Object"+o+"/script"+a),e.close(),c=e.F;i--;)delete c[l][r[i]];return c()};e.exports=Object.create||function(e,t){var n;return null!==e?(s[l]=i(e),n=new s,s[l]=null,n[a]=e):n=c(),void 0===t?n:o(n,t)}},function(e,t,n){var i=n(23),o=n(11),r=n(133);e.exports=n(17)?Object.defineProperties:function(e,t){o(e);for(var n,a=r(t),s=a.length,l=0;s>l;)i.f(e,n=a[l++],t[n]);return e}},function(e,t,n){var i=n(21),o=n(140),r=n(28)("IE_PROTO"),a=Object.prototype;e.exports=Object.getPrototypeOf||function(e){return e=o(e),i(e,r)?e[r]:"function"==typeof e.constructor&&e instanceof e.constructor?e.constructor.prototype:e instanceof Object?a:null}},function(e,t,n){var i=n(21),o=n(30),r=n(118)(!1),a=n(28)("IE_PROTO");e.exports=function(e,t){var n,s=o(e),l=0,c=[];for(n in s)n!=a&&i(s,n)&&c.push(n);for(;t.length>l;)i(s,n=t[l++])&&(~r(c,n)||c.push(n));return c}},function(e,t,n){var i=n(132),o=n(33);e.exports=Object.keys||function(e){return i(e,o)}},function(e,t,n){var i=n(12);e.exports=function(e,t,n){for(var o in t)n&&e[o]?e[o]=t[o]:i(e,o,t[o]);return e}},function(e,t,n){e.exports=n(12)},function(e,t,n){"use strict";var i=n(9),o=n(16),r=n(23),a=n(17),s=n(7)("species");e.exports=function(e){var t="function"==typeof o[e]?o[e]:i[e];a&&t&&!t[s]&&r.f(t,s,{configurable:!0,get:function(){return this}})}},function(e,t,n){var i=n(11),o=n(24),r=n(7)("species");e.exports=function(e,t){var n,a=i(e).constructor;return void 0===a||void 0==(n=i(a)[r])?t:o(n)}},function(e,t,n){var i=n(29),o=n(25);e.exports=function(e){return function(t,n){var r,a,s=String(o(t)),l=i(n),c=s.length;return l<0||l>=c?e?"":void 0:(r=s.charCodeAt(l),r<55296||r>56319||l+1===c||(a=s.charCodeAt(l+1))<56320||a>57343?e?s.charAt(l):r:e?s.slice(l,l+2):(r-55296<<10)+(a-56320)+65536)}}},function(e,t,n){var i=n(29),o=Math.max,r=Math.min;e.exports=function(e,t){return e=i(e),e<0?o(e+t,0):r(e,t)}},function(e,t,n){var i=n(25);e.exports=function(e){return Object(i(e))}},function(e,t,n){var i=n(22);e.exports=function(e,t){if(!i(e))return e;var n,o;if(t&&"function"==typeof(n=e.toString)&&!i(o=n.call(e)))return o;if("function"==typeof(n=e.valueOf)&&!i(o=n.call(e)))return o;if(!t&&"function"==typeof(n=e.toString)&&!i(o=n.call(e)))return o;throw TypeError("Can't convert object to primitive value")}},function(e,t,n){var i=n(32),o=n(7)("iterator"),r=n(18);e.exports=n(16).getIteratorMethod=function(e){if(void 0!=e)return e[o]||e["@@iterator"]||r[i(e)]}},function(e,t,n){"use strict";var i=n(116),o=n(127),r=n(18),a=n(30);e.exports=n(37)(Array,"Array",function(e,t){this._t=a(e),this._i=0,this._k=t},function(){var e=this._t,t=this._k,n=this._i++;return!e||n>=e.length?(this._t=void 0,o(1)):"keys"==t?o(0,n):"values"==t?o(0,e[n]):o(0,[n,e[n]])},"values"),r.Arguments=r.Array,i("keys"),i("values"),i("entries")},function(e,t){},function(e,t,n){"use strict";var i,o,r,a=n(38),s=n(9),l=n(20),c=n(32),u=n(34),d=n(22),h=n(24),f=n(117),p=n(119),g=n(137),v=n(41).set,m=n(128)(),b="Promise",y=s.TypeError,_=s.process,k=s[b],_=s.process,w="process"==c(_),x=function(){},E=!!function(){try{var e=k.resolve(1),t=(e.constructor={})[n(7)("species")]=function(e){e(x,x)};return(w||"function"==typeof PromiseRejectionEvent)&&e.then(x)instanceof t}catch(e){}}(),C=function(e,t){return e===t||e===k&&t===r},S=function(e){var t;return!(!d(e)||"function"!=typeof(t=e.then))&&t},O=function(e){return C(k,e)?new M(e):new o(e)},M=o=function(e){var t,n;this.promise=new e(function(e,i){if(void 0!==t||void 0!==n)throw y("Bad Promise constructor");t=e,n=i}),this.resolve=h(t),this.reject=h(n)},j=function(e){try{e()}catch(e){return{error:e}}},T=function(e,t){if(!e._n){e._n=!0;var n=e._c;m(function(){for(var i=e._v,o=1==e._s,r=0,a=function(t){var n,r,a=o?t.ok:t.fail,s=t.resolve,l=t.reject,c=t.domain;try{a?(o||(2==e._h&&D(e),e._h=1),a===!0?n=i:(c&&c.enter(),n=a(i),c&&c.exit()),n===t.promise?l(y("Promise-chain cycle")):(r=S(n))?r.call(n,s,l):s(n)):l(i)}catch(e){l(e)}};n.length>r;)a(n[r++]);e._c=[],e._n=!1,t&&!e._h&&P(e)})}},P=function(e){v.call(s,function(){var t,n,i,o=e._v;if(A(e)&&(t=j(function(){w?_.emit("unhandledRejection",o,e):(n=s.onunhandledrejection)?n({promise:e,reason:o}):(i=s.console)&&i.error&&i.error("Unhandled promise rejection",o)}),e._h=w||A(e)?2:1),e._a=void 0,t)throw t.error})},A=function(e){if(1==e._h)return!1;for(var t,n=e._a||e._c,i=0;n.length>i;)if(t=n[i++],t.fail||!A(t.promise))return!1;return!0},D=function(e){v.call(s,function(){var t;w?_.emit("rejectionHandled",e):(t=s.onrejectionhandled)&&t({promise:e,reason:e._v})})},I=function(e){var t=this;t._d||(t._d=!0,t=t._w||t,t._v=e,t._s=2,t._a||(t._a=t._c.slice()),T(t,!0))},R=function(e){var t,n=this;if(!n._d){n._d=!0,n=n._w||n;try{if(n===e)throw y("Promise can't be resolved itself"); -(t=S(e))?m(function(){var i={_w:n,_d:!1};try{t.call(e,l(R,i,1),l(I,i,1))}catch(e){I.call(i,e)}}):(n._v=e,n._s=1,T(n,!1))}catch(e){I.call({_w:n,_d:!1},e)}}};E||(k=function(e){f(this,k,b,"_h"),h(e),i.call(this);try{e(l(R,this,1),l(I,this,1))}catch(e){I.call(this,e)}},i=function(e){this._c=[],this._a=void 0,this._s=0,this._d=!1,this._v=void 0,this._h=0,this._n=!1},i.prototype=n(134)(k.prototype,{then:function(e,t){var n=O(g(this,k));return n.ok="function"!=typeof e||e,n.fail="function"==typeof t&&t,n.domain=w?_.domain:void 0,this._c.push(n),this._a&&this._a.push(n),this._s&&T(this,!1),n.promise},catch:function(e){return this.then(void 0,e)}}),M=function(){var e=new i;this.promise=e,this.resolve=l(R,e,1),this.reject=l(I,e,1)}),u(u.G+u.W+u.F*!E,{Promise:k}),n(27)(k,b),n(136)(b),r=n(16)[b],u(u.S+u.F*!E,b,{reject:function(e){var t=O(this),n=t.reject;return n(e),t.promise}}),u(u.S+u.F*(a||!E),b,{resolve:function(e){if(e instanceof k&&C(e.constructor,this))return e;var t=O(this),n=t.resolve;return n(e),t.promise}}),u(u.S+u.F*!(E&&n(126)(function(e){k.all(e).catch(x)})),b,{all:function(e){var t=this,n=O(t),i=n.resolve,o=n.reject,r=j(function(){var n=[],r=0,a=1;p(e,!1,function(e){var s=r++,l=!1;n.push(void 0),a++,t.resolve(e).then(function(e){l||(l=!0,n[s]=e,--a||i(n))},o)}),--a||i(n)});return r&&o(r.error),n.promise},race:function(e){var t=this,n=O(t),i=n.reject,o=j(function(){p(e,!1,function(e){t.resolve(e).then(n.resolve,i)})});return o&&i(o.error),n.promise}})},function(e,t,n){"use strict";var i=n(138)(!0);n(37)(String,"String",function(e){this._t=String(e),this._i=0},function(){var e,t=this._t,n=this._i;return n>=t.length?{value:void 0,done:!0}:(e=i(t,n),this._i+=e.length,{value:e,done:!1})})},function(e,t,n){n(143);for(var i=n(9),o=n(12),r=n(18),a=n(7)("toStringTag"),s=["NodeList","DOMTokenList","MediaList","StyleSheetList","CSSRuleList"],l=0;l<5;l++){var c=s[l],u=i[c],d=u&&u.prototype;d&&!d[a]&&o(d,a,c),r[c]=r.Array}},function(e,t){},function(e,t,n){/*! +function(){if("undefined"!=typeof window&&window.addEventListener){var e,t,n=Object.create(null),i=function(){clearTimeout(t),t=setTimeout(e,100)},o=function(){},r=function(){var e;window.addEventListener("resize",i,!1),window.addEventListener("orientationchange",i,!1),window.MutationObserver?(e=new MutationObserver(i),e.observe(document.documentElement,{childList:!0,subtree:!0,attributes:!0}),o=function(){try{e.disconnect(),window.removeEventListener("resize",i,!1),window.removeEventListener("orientationchange",i,!1)}catch(e){}}):(document.documentElement.addEventListener("DOMSubtreeModified",i,!1),o=function(){document.documentElement.removeEventListener("DOMSubtreeModified",i,!1),window.removeEventListener("resize",i,!1),window.removeEventListener("orientationchange",i,!1)})},a=function(e){function t(e){var t;return void 0!==e.protocol?t=e:(t=document.createElement("a"),t.href=e),t.protocol.replace(/:/g,"")+t.host}var n,i,o;return window.XMLHttpRequest&&(n=new XMLHttpRequest,i=t(location),o=t(e),n=void 0===n.withCredentials&&""!==o&&o!==i?XDomainRequest||void 0:XMLHttpRequest),n},s="http://www.w3.org/1999/xlink";e=function(){function e(){_-=1,0===_&&(o(),r())}function t(e){return function(){n[e.base]!==!0&&(e.useEl.setAttributeNS(s,"xlink:href","#"+e.hash),e.useEl.hasAttribute("href")&&e.useEl.setAttribute("href","#"+e.hash))}}function i(t){return function(){var n,i=document.body,o=document.createElement("x");t.onload=null,o.innerHTML=t.responseText,n=o.getElementsByTagName("svg")[0],n&&(n.setAttribute("aria-hidden","true"),n.style.position="absolute",n.style.width=0,n.style.height=0,n.style.overflow="hidden",i.insertBefore(n,i.firstChild)),e()}}function l(t){return function(){t.onerror=null,t.ontimeout=null,e()}}var c,u,d,h,f,p,g,v,m,b,y="",_=0;for(o(),m=document.getElementsByTagName("use"),f=0;f0&&void 0!==arguments[0]?arguments[0]:{},t=e.uiSize,n=e.imageSize,i=void 0===n?this.imageSize:n;i!==this.imageSize&&(this.imageSize=i),t&&this._setUiSize(t);var o=this._getEditorDimension(),r=o.width,a=o.height,s=this._editorElement.style,l=this.options.menuBarPosition;s.height=a+"px",s.width=r+"px",this._setEditorPosition(l),this._editorElementWrap.style.bottom="0px",this._editorElementWrap.style.top="0px",this._editorElementWrap.style.left="0px",this._editorElementWrap.style.width="100%";var c=this._selectedElement.classList;"top"===l&&this._selectedElement.offsetWidth0&&void 0!==arguments[0]?arguments[0]:this.options.uiSize,t=this._selectedElement.style;t.width=e.width,t.height=e.height}},{key:"_makeSubMenu",value:function(){var e=this;s.default.forEach(this.options.menu,function(t){var n=L[t.replace(/^[a-z]/,function(e){return e.toUpperCase()})];e._makeMenuElement(t),e._els[t]=e._menuElement.querySelector("#tie-btn-"+t),e[t]=new n(e._subMenuElement,{locale:e._locale,iconStyle:e.theme.getStyle("submenu.icon"),menuBarPosition:e.options.menuBarPosition})})}},{key:"_makeUiElement",value:function(e){var t=void 0;window.snippet=s.default,t=e.jquery?e[0]:e.nodeType?e:document.querySelector(e);var n=c.default.getSelector(t);t.classList.add("tui-image-editor-container"),t.innerHTML=(0,f.default)({locale:this._locale,biImage:this.theme.getStyle("common.bi"),iconStyle:this.theme.getStyle("menu.icon"),loadButtonStyle:this.theme.getStyle("loadButton"),downloadButtonStyle:this.theme.getStyle("downloadButton")})+(0,d.default)({locale:this._locale,biImage:this.theme.getStyle("common.bi"),commonStyle:this.theme.getStyle("common"),headerStyle:this.theme.getStyle("header"),loadButtonStyle:this.theme.getStyle("loadButton"),downloadButtonStyle:this.theme.getStyle("downloadButton"),submenuStyle:this.theme.getStyle("submenu")}),this._selectedElement=t,this._selectedElement.classList.add(this.options.menuBarPosition),this._mainElement=n(".tui-image-editor-main"),this._editorElementWrap=n(".tui-image-editor-wrap"),this._editorElement=n(".tui-image-editor"),this._menuElement=n(".tui-image-editor-menu"),this._subMenuElement=n(".tui-image-editor-submenu")}},{key:"_makeMenuElement",value:function(e){var t=document.createElement("li"),n=this.theme.getStyle("menu.icon"),i=n.normal,o=n.active,r=n.hover,a='\n \n \n \n \n \n ';t.id="tie-btn-"+e,t.className="tui-image-editor-item normal",t.title=this._locale.localize(e.replace(/^[a-z]/g,function(e){return e.toUpperCase()})),t.innerHTML=a,this._menuElement.appendChild(t)}},{key:"_addHelpActionEvent",value:function(e){var t=this;this._els[e].addEventListener("click",function(){t._actions.main[e]()})}},{key:"_addDownloadEvent",value:function(){var e=this;s.default.forEach(this._els.download,function(t){t.addEventListener("click",function(){e._actions.main.download()})})}},{key:"_addLoadEvent",value:function(){var e=this;s.default.forEach(this._els.load,function(t){t.addEventListener("change",function(t){e._actions.main.load(t.target.files[0])})})}},{key:"_addMenuEvent",value:function(e){var t=this;this._els[e].addEventListener("click",function(){t.changeMenu(e)})}},{key:"_addSubMenuEvent",value:function(e){this[e].addEvent(this._actions[e])}},{key:"getEditorArea",value:function(){return this._editorElement}},{key:"activeMenuEvent",value:function(){var e=this;this._initMenuEvent||(this._addHelpActionEvent("undo"),this._addHelpActionEvent("redo"),this._addHelpActionEvent("reset"),this._addHelpActionEvent("delete"),this._addHelpActionEvent("deleteAll"),this._addDownloadEvent(),s.default.forEach(this.options.menu,function(t){e._addMenuEvent(t),e._addSubMenuEvent(t)}),this._initMenu(),this._initMenuEvent=!0)}},{key:"initCanvas",value:function(){var e=this,t=this._getLoadImage();t.path&&this._actions.main.initLoadImage(t.path,t.name).then(function(){e.activeMenuEvent()}),this._addLoadEvent();var n=document.createElement("div");n.className="tui-image-editor-grid-visual";var i='\n \n \n \n
    ';n.innerHTML=i,this._editorContainerElement=this._editorElement.querySelector(".tui-image-editor-canvas-container"),this._editorContainerElement.appendChild(n)}},{key:"_getLoadImage",value:function(){return this.options.loadImage}},{key:"changeMenu",value:function(e){var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],n=!(arguments.length>2&&void 0!==arguments[2])||arguments[2];this._submenuChangeTransection||(this._submenuChangeTransection=!0,this._changeMenu(e,t,n),this._submenuChangeTransection=!1)}},{key:"_changeMenu",value:function(e,t,n){this.submenu&&(this._els[this.submenu].classList.remove("active"),this._mainElement.classList.remove("tui-image-editor-menu-"+this.submenu),n&&this._actions.main.discardSelection(),this._actions.main.changeSelectableAll(!0),this[this.submenu].changeStandbyMode()),this.submenu===e&&t?this.submenu=null:(this._els[e].classList.add("active"),this._mainElement.classList.add("tui-image-editor-menu-"+e),this.submenu=e,this[this.submenu].changeStartMode()),this.resizeEditor()}},{key:"_initMenu",value:function(){if(this.options.initMenu){var e=document.createEvent("MouseEvents");e.initEvent("click",!0,!1),this._els[this.options.initMenu].dispatchEvent(e),this.icon&&this.icon.registDefaultIcon()}}},{key:"_getEditorDimension",value:function(){var e=parseFloat(this._editorContainerElement.style.maxHeight),t=this.imageSize.newHeight>e?e:this.imageSize.newHeight,n=parseFloat(this._editorContainerElement.style.maxWidth),i=this.imageSize.newWidth>n?n:this.imageSize.newWidth;return{width:i,height:t}}},{key:"_setEditorPosition",value:function(e){var t=this._getEditorDimension(),n=t.width,i=t.height,o=this._editorElement.style,r=0,a=0;this.submenu&&("bottom"===e?r=i>this._editorElementWrap.scrollHeight-150?(i-this._editorElementWrap.scrollHeight)/2:-75:"top"===e?r=i>this._editorElementWrap.offsetHeight-150?75-(i-(this._editorElementWrap.offsetHeight-150))/2:75:"left"===e?a=n>this._editorElementWrap.offsetWidth-248?124-(n-(this._editorElementWrap.offsetWidth-248))/2:124:"right"===e&&(a=n>this._editorElementWrap.scrollWidth-248?(n-this._editorElementWrap.scrollWidth)/2:-124)),o.top=r+"px",o.left=a+"px"}}]),e}();t.default=N},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n0&&void 0!==arguments[0]?arguments[0]:this.defaultPresetButton;c.default.forEach([].slice.call(this._els.preset.querySelectorAll(".preset")),function(e){e.classList.remove("active")}),e&&e.classList.add("active")}}]),t}(d.default);t.default=p},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n\n \n
      \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n \n \n \n \n \n
      • \n
    • \n
      \n
      • \n
    \n\n
    \n \n \n
    \n \n"}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.locale,n=e.biImage,i=e.commonStyle,o=e.headerStyle,r=e.loadButtonStyle,a=e.downloadButtonStyle,s=e.submenuStyle;return'\n
    \n
    \n \n
    \n \n \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.subMenuLabelActive,n=e.subMenuLabelNormal,i=e.subMenuRangeTitle,o=e.submenuPartitionVertical,r=e.submenuPartitionHorizontal,a=e.submenuCheckbox,s=e.submenuRangePointer,l=e.submenuRangeValue,c=e.submenuColorpickerTitle,u=e.submenuColorpickerButton,d=e.submenuRangeBar,h=e.submenuRangeSubbar,f=e.submenuDisabledRangePointer,p=e.submenuDisabledRangeBar,g=e.submenuDisabledRangeSubbar,v=e.submenuIconSize,m=e.menuIconSize,b=e.biSize;return'\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype="icon-bubble"] label,\n #tie-icon-add-button.icon-heart .tui-image-editor-button[data-icontype="icon-heart"] label,\n #tie-icon-add-button.icon-location .tui-image-editor-button[data-icontype="icon-location"] label,\n #tie-icon-add-button.icon-polygon .tui-image-editor-button[data-icontype="icon-polygon"] label,\n #tie-icon-add-button.icon-star .tui-image-editor-button[data-icontype="icon-star"] label,\n #tie-icon-add-button.icon-arrow-3 .tui-image-editor-button[data-icontype="icon-arrow-3"] label,\n #tie-icon-add-button.icon-arrow-2 .tui-image-editor-button[data-icontype="icon-arrow-2"] label,\n #tie-icon-add-button.icon-arrow .tui-image-editor-button[data-icontype="icon-arrow"] label,\n #tie-icon-add-button.icon-bubble .tui-image-editor-button[data-icontype="icon-bubble"] label,\n #tie-draw-line-select-button.line .tui-image-editor-button.line label,\n #tie-draw-line-select-button.free .tui-image-editor-button.free label,\n #tie-flip-button.flipX .tui-image-editor-button.flipX label,\n #tie-flip-button.flipY .tui-image-editor-button.flipY label,\n #tie-flip-button.resetFlip .tui-image-editor-button.resetFlip label,\n #tie-crop-button .tui-image-editor-button.apply.active label,\n #tie-crop-preset-button .tui-image-editor-button.preset.active label,\n #tie-shape-button.rect .tui-image-editor-button.rect label,\n #tie-shape-button.circle .tui-image-editor-button.circle label,\n #tie-shape-button.triangle .tui-image-editor-button.triangle label,\n #tie-text-effect-button .tui-image-editor-button.active label,\n #tie-text-align-button.left .tui-image-editor-button.left label,\n #tie-text-align-button.center .tui-image-editor-button.center label,\n #tie-text-align-button.right .tui-image-editor-button.right label,\n #tie-mask-apply.apply.active .tui-image-editor-button.apply label,\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button:hover > label,\n .tui-image-editor-container .tui-image-editor-checkbox input + label {\n '+t+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button > label,\n .tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label {\n "+n+"\n }\n .tui-image-editor-container .tui-image-editor-range-wrap label {\n "+i+"\n }\n .tui-image-editor-container .tui-image-editor-partition > div {\n "+o+"\n }\n .tui-image-editor-container.left .tui-image-editor-submenu .tui-image-editor-partition > div,\n .tui-image-editor-container.right .tui-image-editor-submenu .tui-image-editor-partition > div {\n "+r+"\n }\n .tui-image-editor-container .tui-image-editor-checkbox input + label:before {\n "+a+"\n }\n .tui-image-editor-container .tui-image-editor-checkbox input:checked + label:before {\n border: 0;\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-pointer {\n "+s+"\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-bar {\n "+d+"\n }\n .tui-image-editor-container .tui-image-editor-virtual-range-subbar {\n "+h+"\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-pointer {\n "+f+"\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-subbar {\n "+g+"\n }\n .tui-image-editor-container .tui-image-editor-disabled .tui-image-editor-virtual-range-bar {\n "+p+"\n }\n .tui-image-editor-container .tui-image-editor-range-value {\n "+l+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value + label {\n "+c+"\n }\n .tui-image-editor-container .tui-image-editor-submenu .tui-image-editor-button .color-picker-value {\n "+u+"\n }\n .tui-image-editor-container .svg_ic-menu {\n "+m+"\n }\n .tui-image-editor-container .svg_ic-submenu {\n "+v+"\n }\n .tui-image-editor-container .tui-image-editor-controls-logo > img,\n .tui-image-editor-container .tui-image-editor-header-logo > img {\n "+b+"\n }\n\n"}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.locale,n=e.iconStyle,i=n.normal,o=n.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n \n \n \n \n \n
      \n
      \n \n \n \n \n \n
      \n
      • \n
    \n"}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.locale,n=e.iconStyle,i=n.normal,o=n.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.locale;return'\n
      \n
    • \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n \n \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n\n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n \n
      \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      \n
      \n
      \n \n \n
      \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{ +value:!0}),t.default=function(e){var t=e.locale,n=e.iconStyle,i=n.normal,o=n.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    \n"}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.locale,n=e.iconStyle,i=n.normal,o=n.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n\n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.locale,n=e.iconStyle,i=n.normal,o=n.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n \n \n \n \n \n
      \n
      • \n
    \n"}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.locale,n=e.iconStyle,i=n.normal,o=n.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.locale,n=e.iconStyle,i=n.normal,o=n.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e){var t=e.locale,n=e.iconStyle,i=n.normal,o=n.active;return'\n
      \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      \n
      \n \n \n \n \n
      \n \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n
      \n
      • \n
    • \n \n
      \n \n
      • \n
    \n'}},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function r(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var s=function(){function e(e,t){for(var n=0;n-1&&"none"!==e&&(e="url("+e+")"),n.push(t._toUnderScore(i)+": "+e)}),n.join(";")}},{key:"_toUnderScore",value:function(e){return e.replace(/([A-Z])/g,function(e,t){return"-"+t.toLowerCase()})}}]),e}();t.default=h},function(e,t){e.exports=function(){}},function(e,t){e.exports=function(e,t,n,i){if(!(e instanceof t)||void 0!==i&&i in e)throw TypeError(n+": incorrect invocation!");return e}},function(e,t,n){var i=n(30),o=n(42),r=n(140);e.exports=function(e){return function(t,n,a){var s,l=i(t),c=o(l.length),u=r(a,c);if(e&&n!=n){for(;c>u;)if(s=l[u++],s!=s)return!0}else for(;c>u;u++)if((e||u in l)&&l[u]===n)return e||u||0;return!e&&-1}}},function(e,t,n){var i=n(20),o=n(125),r=n(124),a=n(11),s=n(42),l=n(143),c={},u={},t=e.exports=function(e,t,n,d,h){var f,p,g,v,m=h?function(){return e}:l(e),b=i(n,d,t?2:1),y=0;if("function"!=typeof m)throw TypeError(e+" is not iterable!");if(r(m)){for(f=s(e.length);f>y;y++)if(v=t?b(a(p=e[y])[0],p[1]):b(e[y]),v===c||v===u)return v}else for(g=m.call(e);!(p=g.next()).done;)if(v=o(g,b,p.value,t),v===c||v===u)return v};t.BREAK=c,t.RETURN=u},function(e,t,n){e.exports=!n(17)&&!n(35)(function(){return 7!=Object.defineProperty(n(26)("div"),"a",{get:function(){return 7}}).a})},function(e,t){e.exports=function(e,t,n){var i=void 0===n;switch(t.length){case 0:return i?e():e.call(n);case 1:return i?e(t[0]):e.call(n,t[0]);case 2:return i?e(t[0],t[1]):e.call(n,t[0],t[1]);case 3:return i?e(t[0],t[1],t[2]):e.call(n,t[0],t[1],t[2]);case 4:return i?e(t[0],t[1],t[2],t[3]):e.call(n,t[0],t[1],t[2],t[3])}return e.apply(n,t)}},function(e,t,n){var i=n(19);e.exports=Object("z").propertyIsEnumerable(0)?Object:function(e){return"String"==i(e)?e.split(""):Object(e)}},function(e,t,n){var i=n(18),o=n(7)("iterator"),r=Array.prototype;e.exports=function(e){return void 0!==e&&(i.Array===e||r[o]===e)}},function(e,t,n){var i=n(11);e.exports=function(e,t,n,o){try{return o?t(i(n)[0],n[1]):t(n)}catch(t){var r=e.return;throw void 0!==r&&i(r.call(e)),t}}},function(e,t,n){"use strict";var i=n(130),o=n(39),r=n(27),a={};n(12)(a,n(7)("iterator"),function(){return this}),e.exports=function(e,t,n){e.prototype=i(a,{next:o(1,n)}),r(e,t+" Iterator")}},function(e,t,n){var i=n(7)("iterator"),o=!1;try{var r=[7][i]();r.return=function(){o=!0},Array.from(r,function(){throw 2})}catch(e){}e.exports=function(e,t){if(!t&&!o)return!1;var n=!1;try{var r=[7],a=r[i]();a.next=function(){return{done:n=!0}},r[i]=function(){return a},e(r)}catch(e){}return n}},function(e,t){e.exports=function(e,t){return{value:t,done:!!e}}},function(e,t,n){var i=n(9),o=n(41).set,r=i.MutationObserver||i.WebKitMutationObserver,a=i.process,s=i.Promise,l="process"==n(19)(a);e.exports=function(){var e,t,n,c=function(){var i,o;for(l&&(i=a.domain)&&i.exit();e;){o=e.fn,e=e.next;try{o()}catch(i){throw e?n():t=void 0,i}}t=void 0,i&&i.enter()};if(l)n=function(){a.nextTick(c)};else if(r){var u=!0,d=document.createTextNode("");new r(c).observe(d,{characterData:!0}),n=function(){d.data=u=!u}}else if(s&&s.resolve){var h=s.resolve();n=function(){h.then(c)}}else n=function(){o.call(i,c)};return function(i){var o={fn:i,next:void 0};t&&(t.next=o),e||(e=o,n()),t=o}}},function(e,t,n){var i=n(11),o=n(131),r=n(33),a=n(28)("IE_PROTO"),s=function(){},l="prototype",c=function(){var e,t=n(26)("iframe"),i=r.length,o="<",a=">";for(t.style.display="none",n(36).appendChild(t),t.src="javascript:",e=t.contentWindow.document,e.open(),e.write(o+"script"+a+"document.F=Object"+o+"/script"+a),e.close(),c=e.F;i--;)delete c[l][r[i]];return c()};e.exports=Object.create||function(e,t){var n;return null!==e?(s[l]=i(e),n=new s,s[l]=null,n[a]=e):n=c(),void 0===t?n:o(n,t)}},function(e,t,n){var i=n(23),o=n(11),r=n(134);e.exports=n(17)?Object.defineProperties:function(e,t){o(e);for(var n,a=r(t),s=a.length,l=0;s>l;)i.f(e,n=a[l++],t[n]);return e}},function(e,t,n){var i=n(21),o=n(141),r=n(28)("IE_PROTO"),a=Object.prototype;e.exports=Object.getPrototypeOf||function(e){return e=o(e),i(e,r)?e[r]:"function"==typeof e.constructor&&e instanceof e.constructor?e.constructor.prototype:e instanceof Object?a:null}},function(e,t,n){var i=n(21),o=n(30),r=n(119)(!1),a=n(28)("IE_PROTO");e.exports=function(e,t){var n,s=o(e),l=0,c=[];for(n in s)n!=a&&i(s,n)&&c.push(n);for(;t.length>l;)i(s,n=t[l++])&&(~r(c,n)||c.push(n));return c}},function(e,t,n){var i=n(133),o=n(33);e.exports=Object.keys||function(e){return i(e,o)}},function(e,t,n){var i=n(12);e.exports=function(e,t,n){for(var o in t)n&&e[o]?e[o]=t[o]:i(e,o,t[o]);return e}},function(e,t,n){e.exports=n(12)},function(e,t,n){"use strict";var i=n(9),o=n(16),r=n(23),a=n(17),s=n(7)("species");e.exports=function(e){var t="function"==typeof o[e]?o[e]:i[e];a&&t&&!t[s]&&r.f(t,s,{configurable:!0,get:function(){return this}})}},function(e,t,n){var i=n(11),o=n(24),r=n(7)("species");e.exports=function(e,t){var n,a=i(e).constructor;return void 0===a||void 0==(n=i(a)[r])?t:o(n)}},function(e,t,n){var i=n(29),o=n(25);e.exports=function(e){return function(t,n){var r,a,s=String(o(t)),l=i(n),c=s.length;return l<0||l>=c?e?"":void 0:(r=s.charCodeAt(l),r<55296||r>56319||l+1===c||(a=s.charCodeAt(l+1))<56320||a>57343?e?s.charAt(l):r:e?s.slice(l,l+2):(r-55296<<10)+(a-56320)+65536)}}},function(e,t,n){var i=n(29),o=Math.max,r=Math.min;e.exports=function(e,t){return e=i(e),e<0?o(e+t,0):r(e,t)}},function(e,t,n){var i=n(25);e.exports=function(e){return Object(i(e))}},function(e,t,n){var i=n(22);e.exports=function(e,t){if(!i(e))return e;var n,o;if(t&&"function"==typeof(n=e.toString)&&!i(o=n.call(e)))return o;if("function"==typeof(n=e.valueOf)&&!i(o=n.call(e)))return o;if(!t&&"function"==typeof(n=e.toString)&&!i(o=n.call(e)))return o;throw TypeError("Can't convert object to primitive value"); +}},function(e,t,n){var i=n(32),o=n(7)("iterator"),r=n(18);e.exports=n(16).getIteratorMethod=function(e){if(void 0!=e)return e[o]||e["@@iterator"]||r[i(e)]}},function(e,t,n){"use strict";var i=n(117),o=n(128),r=n(18),a=n(30);e.exports=n(37)(Array,"Array",function(e,t){this._t=a(e),this._i=0,this._k=t},function(){var e=this._t,t=this._k,n=this._i++;return!e||n>=e.length?(this._t=void 0,o(1)):"keys"==t?o(0,n):"values"==t?o(0,e[n]):o(0,[n,e[n]])},"values"),r.Arguments=r.Array,i("keys"),i("values"),i("entries")},function(e,t){},function(e,t,n){"use strict";var i,o,r,a=n(38),s=n(9),l=n(20),c=n(32),u=n(34),d=n(22),h=n(24),f=n(118),p=n(120),g=n(138),v=n(41).set,m=n(129)(),b="Promise",y=s.TypeError,_=s.process,k=s[b],_=s.process,w="process"==c(_),x=function(){},E=!!function(){try{var e=k.resolve(1),t=(e.constructor={})[n(7)("species")]=function(e){e(x,x)};return(w||"function"==typeof PromiseRejectionEvent)&&e.then(x)instanceof t}catch(e){}}(),C=function(e,t){return e===t||e===k&&t===r},S=function(e){var t;return!(!d(e)||"function"!=typeof(t=e.then))&&t},O=function(e){return C(k,e)?new M(e):new o(e)},M=o=function(e){var t,n;this.promise=new e(function(e,i){if(void 0!==t||void 0!==n)throw y("Bad Promise constructor");t=e,n=i}),this.resolve=h(t),this.reject=h(n)},j=function(e){try{e()}catch(e){return{error:e}}},T=function(e,t){if(!e._n){e._n=!0;var n=e._c;m(function(){for(var i=e._v,o=1==e._s,r=0,a=function(t){var n,r,a=o?t.ok:t.fail,s=t.resolve,l=t.reject,c=t.domain;try{a?(o||(2==e._h&&D(e),e._h=1),a===!0?n=i:(c&&c.enter(),n=a(i),c&&c.exit()),n===t.promise?l(y("Promise-chain cycle")):(r=S(n))?r.call(n,s,l):s(n)):l(i)}catch(e){l(e)}};n.length>r;)a(n[r++]);e._c=[],e._n=!1,t&&!e._h&&P(e)})}},P=function(e){v.call(s,function(){var t,n,i,o=e._v;if(A(e)&&(t=j(function(){w?_.emit("unhandledRejection",o,e):(n=s.onunhandledrejection)?n({promise:e,reason:o}):(i=s.console)&&i.error&&i.error("Unhandled promise rejection",o)}),e._h=w||A(e)?2:1),e._a=void 0,t)throw t.error})},A=function(e){if(1==e._h)return!1;for(var t,n=e._a||e._c,i=0;n.length>i;)if(t=n[i++],t.fail||!A(t.promise))return!1;return!0},D=function(e){v.call(s,function(){var t;w?_.emit("rejectionHandled",e):(t=s.onrejectionhandled)&&t({promise:e,reason:e._v})})},I=function(e){var t=this;t._d||(t._d=!0,t=t._w||t,t._v=e,t._s=2,t._a||(t._a=t._c.slice()),T(t,!0))},R=function(e){var t,n=this;if(!n._d){n._d=!0,n=n._w||n;try{if(n===e)throw y("Promise can't be resolved itself");(t=S(e))?m(function(){var i={_w:n,_d:!1};try{t.call(e,l(R,i,1),l(I,i,1))}catch(e){I.call(i,e)}}):(n._v=e,n._s=1,T(n,!1))}catch(e){I.call({_w:n,_d:!1},e)}}};E||(k=function(e){f(this,k,b,"_h"),h(e),i.call(this);try{e(l(R,this,1),l(I,this,1))}catch(e){I.call(this,e)}},i=function(e){this._c=[],this._a=void 0,this._s=0,this._d=!1,this._v=void 0,this._h=0,this._n=!1},i.prototype=n(135)(k.prototype,{then:function(e,t){var n=O(g(this,k));return n.ok="function"!=typeof e||e,n.fail="function"==typeof t&&t,n.domain=w?_.domain:void 0,this._c.push(n),this._a&&this._a.push(n),this._s&&T(this,!1),n.promise},catch:function(e){return this.then(void 0,e)}}),M=function(){var e=new i;this.promise=e,this.resolve=l(R,e,1),this.reject=l(I,e,1)}),u(u.G+u.W+u.F*!E,{Promise:k}),n(27)(k,b),n(137)(b),r=n(16)[b],u(u.S+u.F*!E,b,{reject:function(e){var t=O(this),n=t.reject;return n(e),t.promise}}),u(u.S+u.F*(a||!E),b,{resolve:function(e){if(e instanceof k&&C(e.constructor,this))return e;var t=O(this),n=t.resolve;return n(e),t.promise}}),u(u.S+u.F*!(E&&n(127)(function(e){k.all(e).catch(x)})),b,{all:function(e){var t=this,n=O(t),i=n.resolve,o=n.reject,r=j(function(){var n=[],r=0,a=1;p(e,!1,function(e){var s=r++,l=!1;n.push(void 0),a++,t.resolve(e).then(function(e){l||(l=!0,n[s]=e,--a||i(n))},o)}),--a||i(n)});return r&&o(r.error),n.promise},race:function(e){var t=this,n=O(t),i=n.reject,o=j(function(){p(e,!1,function(e){t.resolve(e).then(n.resolve,i)})});return o&&i(o.error),n.promise}})},function(e,t,n){"use strict";var i=n(139)(!0);n(37)(String,"String",function(e){this._t=String(e),this._i=0},function(){var e,t=this._t,n=this._i;return n>=t.length?{value:void 0,done:!0}:(e=i(t,n),this._i+=e.length,{value:e,done:!1})})},function(e,t,n){n(144);for(var i=n(9),o=n(12),r=n(18),a=n(7)("toStringTag"),s=["NodeList","DOMTokenList","MediaList","StyleSheetList","CSSRuleList"],l=0;l<5;l++){var c=s[l],u=i[c],d=u&&u.prototype;d&&!d[a]&&o(d,a,c),r[c]=r.Array}},function(e,t){},function(e,t,n){/*! * Toast UI Colorpicker * @version 2.2.0 * @author NHNEnt FE Development Team From a1219fe2febf72051c9c8f658674824a803e7ddc Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B9=80=EC=A7=84=EC=9A=B0?= Date: Fri, 11 Jan 2019 12:28:24 +0900 Subject: [PATCH 10/10] chore: version up v3.4.0 bundle --- dist/tui-image-editor.css | 2 +- dist/tui-image-editor.js | 2 +- dist/tui-image-editor.min.css | 2 +- dist/tui-image-editor.min.js | 2 +- index.d.ts | 2 +- 5 files changed, 5 insertions(+), 5 deletions(-) diff --git a/dist/tui-image-editor.css b/dist/tui-image-editor.css index 32f3688d3..51b7b8f44 100644 --- a/dist/tui-image-editor.css +++ b/dist/tui-image-editor.css @@ -1,6 +1,6 @@ /*! * tui-image-editor.js - * @version 3.3.1 + * @version 3.4.0 * @author NHNEnt FE Development Lab * @license MIT */ diff --git a/dist/tui-image-editor.js b/dist/tui-image-editor.js index fb3732b9a..7e97ac2a6 100644 --- a/dist/tui-image-editor.js +++ b/dist/tui-image-editor.js @@ -1,6 +1,6 @@ /*! * tui-image-editor.js - * @version 3.3.1 + * @version 3.4.0 * @author NHNEnt FE Development Lab * @license MIT */ diff --git a/dist/tui-image-editor.min.css b/dist/tui-image-editor.min.css index 4cf11bdb2..a3ccffce8 100644 --- a/dist/tui-image-editor.min.css +++ b/dist/tui-image-editor.min.css @@ -1,6 +1,6 @@ /*! * tui-image-editor.min.js - * @version 3.3.1 + * @version 3.4.0 * @author NHNEnt FE Development Lab * @license MIT */ diff --git a/dist/tui-image-editor.min.js b/dist/tui-image-editor.min.js index 50a16b47d..0df70cbcf 100644 --- a/dist/tui-image-editor.min.js +++ b/dist/tui-image-editor.min.js @@ -1,6 +1,6 @@ /*! * tui-image-editor.min.js - * @version 3.3.1 + * @version 3.4.0 * @author NHNEnt FE Development Lab * @license MIT */ diff --git a/index.d.ts b/index.d.ts index 37f3d2df0..27d99d840 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1,4 +1,4 @@ -// Type definitions for TOAST UI Image Editor v3.3.1 +// Type definitions for TOAST UI Image Editor v3.4.0 // TypeScript Version: 3.2.2 ///