26705 lines
1.0 MiB
26705 lines
1.0 MiB
/*!
|
|
* tui-image-editor.js
|
|
* @version 3.14.2
|
|
* @author NHN. FE Development Lab <dl_javascript@nhn.com>
|
|
* @license MIT
|
|
*/
|
|
(function webpackUniversalModuleDefinition(root, factory) {
|
|
if(typeof exports === 'object' && typeof module === 'object')
|
|
module.exports = factory(require("fabric")["fabric"], require("tui-code-snippet"), require("tui-color-picker"));
|
|
else if(typeof define === 'function' && define.amd)
|
|
define(["fabric", "tui-code-snippet", "tui-color-picker"], factory);
|
|
else if(typeof exports === 'object')
|
|
exports["ImageEditor"] = factory(require("fabric")["fabric"], require("tui-code-snippet"), require("tui-color-picker"));
|
|
else
|
|
root["tui"] = root["tui"] || {}, root["tui"]["ImageEditor"] = factory(root["fabric"], root["tui"]["util"], root["tui"]["colorPicker"]);
|
|
})(window, function(__WEBPACK_EXTERNAL_MODULE_fabric__, __WEBPACK_EXTERNAL_MODULE_tui_code_snippet__, __WEBPACK_EXTERNAL_MODULE_tui_color_picker__) {
|
|
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] = {
|
|
/******/ i: moduleId,
|
|
/******/ l: false,
|
|
/******/ exports: {}
|
|
/******/ };
|
|
/******/
|
|
/******/ // Execute the module function
|
|
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
|
|
/******/
|
|
/******/ // Flag the module as loaded
|
|
/******/ module.l = 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;
|
|
/******/
|
|
/******/ // define getter function for harmony exports
|
|
/******/ __webpack_require__.d = function(exports, name, getter) {
|
|
/******/ if(!__webpack_require__.o(exports, name)) {
|
|
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
|
|
/******/ }
|
|
/******/ };
|
|
/******/
|
|
/******/ // define __esModule on exports
|
|
/******/ __webpack_require__.r = function(exports) {
|
|
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
|
|
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
/******/ }
|
|
/******/ Object.defineProperty(exports, '__esModule', { value: true });
|
|
/******/ };
|
|
/******/
|
|
/******/ // create a fake namespace object
|
|
/******/ // mode & 1: value is a module id, require it
|
|
/******/ // mode & 2: merge all properties of value into the ns
|
|
/******/ // mode & 4: return value when already ns object
|
|
/******/ // mode & 8|1: behave like require
|
|
/******/ __webpack_require__.t = function(value, mode) {
|
|
/******/ if(mode & 1) value = __webpack_require__(value);
|
|
/******/ if(mode & 8) return value;
|
|
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
|
|
/******/ var ns = Object.create(null);
|
|
/******/ __webpack_require__.r(ns);
|
|
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
|
|
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
|
|
/******/ return ns;
|
|
/******/ };
|
|
/******/
|
|
/******/ // getDefaultExport function for compatibility with non-harmony modules
|
|
/******/ __webpack_require__.n = function(module) {
|
|
/******/ var getter = module && module.__esModule ?
|
|
/******/ function getDefault() { return module['default']; } :
|
|
/******/ function getModuleExports() { return module; };
|
|
/******/ __webpack_require__.d(getter, 'a', getter);
|
|
/******/ return getter;
|
|
/******/ };
|
|
/******/
|
|
/******/ // Object.prototype.hasOwnProperty.call
|
|
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
|
|
/******/
|
|
/******/ // __webpack_public_path__
|
|
/******/ __webpack_require__.p = "/dist";
|
|
/******/
|
|
/******/
|
|
/******/ // Load entry module and return exports
|
|
/******/ return __webpack_require__(__webpack_require__.s = "./src/index.js");
|
|
/******/ })
|
|
/************************************************************************/
|
|
/******/ ({
|
|
|
|
/***/ "./node_modules/core-js-pure/es/promise/index.js":
|
|
/*!*******************************************************!*\
|
|
!*** ./node_modules/core-js-pure/es/promise/index.js ***!
|
|
\*******************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
__webpack_require__(/*! ../../modules/es.object.to-string */ "./node_modules/core-js-pure/modules/es.object.to-string.js");
|
|
__webpack_require__(/*! ../../modules/es.string.iterator */ "./node_modules/core-js-pure/modules/es.string.iterator.js");
|
|
__webpack_require__(/*! ../../modules/web.dom-collections.iterator */ "./node_modules/core-js-pure/modules/web.dom-collections.iterator.js");
|
|
__webpack_require__(/*! ../../modules/es.promise */ "./node_modules/core-js-pure/modules/es.promise.js");
|
|
__webpack_require__(/*! ../../modules/es.promise.all-settled */ "./node_modules/core-js-pure/modules/es.promise.all-settled.js");
|
|
__webpack_require__(/*! ../../modules/es.promise.finally */ "./node_modules/core-js-pure/modules/es.promise.finally.js");
|
|
var path = __webpack_require__(/*! ../../internals/path */ "./node_modules/core-js-pure/internals/path.js");
|
|
|
|
module.exports = path.Promise;
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/features/promise/index.js":
|
|
/*!*************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/features/promise/index.js ***!
|
|
\*************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var parent = __webpack_require__(/*! ../../es/promise */ "./node_modules/core-js-pure/es/promise/index.js");
|
|
__webpack_require__(/*! ../../modules/esnext.aggregate-error */ "./node_modules/core-js-pure/modules/esnext.aggregate-error.js");
|
|
// TODO: Remove from `core-js@4`
|
|
__webpack_require__(/*! ../../modules/esnext.promise.all-settled */ "./node_modules/core-js-pure/modules/esnext.promise.all-settled.js");
|
|
__webpack_require__(/*! ../../modules/esnext.promise.try */ "./node_modules/core-js-pure/modules/esnext.promise.try.js");
|
|
__webpack_require__(/*! ../../modules/esnext.promise.any */ "./node_modules/core-js-pure/modules/esnext.promise.any.js");
|
|
|
|
module.exports = parent;
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/a-function.js":
|
|
/*!***********************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/a-function.js ***!
|
|
\***********************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
module.exports = function (it) {
|
|
if (typeof it != 'function') {
|
|
throw TypeError(String(it) + ' is not a function');
|
|
} return it;
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/a-possible-prototype.js":
|
|
/*!*********************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/a-possible-prototype.js ***!
|
|
\*********************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var isObject = __webpack_require__(/*! ../internals/is-object */ "./node_modules/core-js-pure/internals/is-object.js");
|
|
|
|
module.exports = function (it) {
|
|
if (!isObject(it) && it !== null) {
|
|
throw TypeError("Can't set " + String(it) + ' as a prototype');
|
|
} return it;
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/add-to-unscopables.js":
|
|
/*!*******************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/add-to-unscopables.js ***!
|
|
\*******************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
module.exports = function () { /* empty */ };
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/an-instance.js":
|
|
/*!************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/an-instance.js ***!
|
|
\************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
module.exports = function (it, Constructor, name) {
|
|
if (!(it instanceof Constructor)) {
|
|
throw TypeError('Incorrect ' + (name ? name + ' ' : '') + 'invocation');
|
|
} return it;
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/an-object.js":
|
|
/*!**********************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/an-object.js ***!
|
|
\**********************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var isObject = __webpack_require__(/*! ../internals/is-object */ "./node_modules/core-js-pure/internals/is-object.js");
|
|
|
|
module.exports = function (it) {
|
|
if (!isObject(it)) {
|
|
throw TypeError(String(it) + ' is not an object');
|
|
} return it;
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/array-includes.js":
|
|
/*!***************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/array-includes.js ***!
|
|
\***************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var toIndexedObject = __webpack_require__(/*! ../internals/to-indexed-object */ "./node_modules/core-js-pure/internals/to-indexed-object.js");
|
|
var toLength = __webpack_require__(/*! ../internals/to-length */ "./node_modules/core-js-pure/internals/to-length.js");
|
|
var toAbsoluteIndex = __webpack_require__(/*! ../internals/to-absolute-index */ "./node_modules/core-js-pure/internals/to-absolute-index.js");
|
|
|
|
// `Array.prototype.{ indexOf, includes }` methods implementation
|
|
var createMethod = function (IS_INCLUDES) {
|
|
return function ($this, el, fromIndex) {
|
|
var O = toIndexedObject($this);
|
|
var length = toLength(O.length);
|
|
var index = toAbsoluteIndex(fromIndex, length);
|
|
var value;
|
|
// Array#includes uses SameValueZero equality algorithm
|
|
// eslint-disable-next-line no-self-compare
|
|
if (IS_INCLUDES && el != el) while (length > index) {
|
|
value = O[index++];
|
|
// eslint-disable-next-line no-self-compare
|
|
if (value != value) return true;
|
|
// Array#indexOf ignores holes, Array#includes - not
|
|
} else for (;length > index; index++) {
|
|
if ((IS_INCLUDES || index in O) && O[index] === el) return IS_INCLUDES || index || 0;
|
|
} return !IS_INCLUDES && -1;
|
|
};
|
|
};
|
|
|
|
module.exports = {
|
|
// `Array.prototype.includes` method
|
|
// https://tc39.github.io/ecma262/#sec-array.prototype.includes
|
|
includes: createMethod(true),
|
|
// `Array.prototype.indexOf` method
|
|
// https://tc39.github.io/ecma262/#sec-array.prototype.indexof
|
|
indexOf: createMethod(false)
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/call-with-safe-iteration-closing.js":
|
|
/*!*********************************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/call-with-safe-iteration-closing.js ***!
|
|
\*********************************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var anObject = __webpack_require__(/*! ../internals/an-object */ "./node_modules/core-js-pure/internals/an-object.js");
|
|
|
|
// call something on iterator step with safe closing on error
|
|
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 (error) {
|
|
var returnMethod = iterator['return'];
|
|
if (returnMethod !== undefined) anObject(returnMethod.call(iterator));
|
|
throw error;
|
|
}
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/check-correctness-of-iteration.js":
|
|
/*!*******************************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/check-correctness-of-iteration.js ***!
|
|
\*******************************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var wellKnownSymbol = __webpack_require__(/*! ../internals/well-known-symbol */ "./node_modules/core-js-pure/internals/well-known-symbol.js");
|
|
|
|
var ITERATOR = wellKnownSymbol('iterator');
|
|
var SAFE_CLOSING = false;
|
|
|
|
try {
|
|
var called = 0;
|
|
var iteratorWithReturn = {
|
|
next: function () {
|
|
return { done: !!called++ };
|
|
},
|
|
'return': function () {
|
|
SAFE_CLOSING = true;
|
|
}
|
|
};
|
|
iteratorWithReturn[ITERATOR] = function () {
|
|
return this;
|
|
};
|
|
// eslint-disable-next-line no-throw-literal
|
|
Array.from(iteratorWithReturn, function () { throw 2; });
|
|
} catch (error) { /* empty */ }
|
|
|
|
module.exports = function (exec, SKIP_CLOSING) {
|
|
if (!SKIP_CLOSING && !SAFE_CLOSING) return false;
|
|
var ITERATION_SUPPORT = false;
|
|
try {
|
|
var object = {};
|
|
object[ITERATOR] = function () {
|
|
return {
|
|
next: function () {
|
|
return { done: ITERATION_SUPPORT = true };
|
|
}
|
|
};
|
|
};
|
|
exec(object);
|
|
} catch (error) { /* empty */ }
|
|
return ITERATION_SUPPORT;
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/classof-raw.js":
|
|
/*!************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/classof-raw.js ***!
|
|
\************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
var toString = {}.toString;
|
|
|
|
module.exports = function (it) {
|
|
return toString.call(it).slice(8, -1);
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/classof.js":
|
|
/*!********************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/classof.js ***!
|
|
\********************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var TO_STRING_TAG_SUPPORT = __webpack_require__(/*! ../internals/to-string-tag-support */ "./node_modules/core-js-pure/internals/to-string-tag-support.js");
|
|
var classofRaw = __webpack_require__(/*! ../internals/classof-raw */ "./node_modules/core-js-pure/internals/classof-raw.js");
|
|
var wellKnownSymbol = __webpack_require__(/*! ../internals/well-known-symbol */ "./node_modules/core-js-pure/internals/well-known-symbol.js");
|
|
|
|
var TO_STRING_TAG = wellKnownSymbol('toStringTag');
|
|
// ES3 wrong here
|
|
var CORRECT_ARGUMENTS = classofRaw(function () { return arguments; }()) == 'Arguments';
|
|
|
|
// fallback for IE11 Script Access Denied error
|
|
var tryGet = function (it, key) {
|
|
try {
|
|
return it[key];
|
|
} catch (error) { /* empty */ }
|
|
};
|
|
|
|
// getting tag from ES6+ `Object.prototype.toString`
|
|
module.exports = TO_STRING_TAG_SUPPORT ? classofRaw : function (it) {
|
|
var O, tag, result;
|
|
return it === undefined ? 'Undefined' : it === null ? 'Null'
|
|
// @@toStringTag case
|
|
: typeof (tag = tryGet(O = Object(it), TO_STRING_TAG)) == 'string' ? tag
|
|
// builtinTag case
|
|
: CORRECT_ARGUMENTS ? classofRaw(O)
|
|
// ES3 arguments fallback
|
|
: (result = classofRaw(O)) == 'Object' && typeof O.callee == 'function' ? 'Arguments' : result;
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/correct-prototype-getter.js":
|
|
/*!*************************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/correct-prototype-getter.js ***!
|
|
\*************************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var fails = __webpack_require__(/*! ../internals/fails */ "./node_modules/core-js-pure/internals/fails.js");
|
|
|
|
module.exports = !fails(function () {
|
|
function F() { /* empty */ }
|
|
F.prototype.constructor = null;
|
|
return Object.getPrototypeOf(new F()) !== F.prototype;
|
|
});
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/create-iterator-constructor.js":
|
|
/*!****************************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/create-iterator-constructor.js ***!
|
|
\****************************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
var IteratorPrototype = __webpack_require__(/*! ../internals/iterators-core */ "./node_modules/core-js-pure/internals/iterators-core.js").IteratorPrototype;
|
|
var create = __webpack_require__(/*! ../internals/object-create */ "./node_modules/core-js-pure/internals/object-create.js");
|
|
var createPropertyDescriptor = __webpack_require__(/*! ../internals/create-property-descriptor */ "./node_modules/core-js-pure/internals/create-property-descriptor.js");
|
|
var setToStringTag = __webpack_require__(/*! ../internals/set-to-string-tag */ "./node_modules/core-js-pure/internals/set-to-string-tag.js");
|
|
var Iterators = __webpack_require__(/*! ../internals/iterators */ "./node_modules/core-js-pure/internals/iterators.js");
|
|
|
|
var returnThis = function () { return this; };
|
|
|
|
module.exports = function (IteratorConstructor, NAME, next) {
|
|
var TO_STRING_TAG = NAME + ' Iterator';
|
|
IteratorConstructor.prototype = create(IteratorPrototype, { next: createPropertyDescriptor(1, next) });
|
|
setToStringTag(IteratorConstructor, TO_STRING_TAG, false, true);
|
|
Iterators[TO_STRING_TAG] = returnThis;
|
|
return IteratorConstructor;
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/create-non-enumerable-property.js":
|
|
/*!*******************************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/create-non-enumerable-property.js ***!
|
|
\*******************************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var DESCRIPTORS = __webpack_require__(/*! ../internals/descriptors */ "./node_modules/core-js-pure/internals/descriptors.js");
|
|
var definePropertyModule = __webpack_require__(/*! ../internals/object-define-property */ "./node_modules/core-js-pure/internals/object-define-property.js");
|
|
var createPropertyDescriptor = __webpack_require__(/*! ../internals/create-property-descriptor */ "./node_modules/core-js-pure/internals/create-property-descriptor.js");
|
|
|
|
module.exports = DESCRIPTORS ? function (object, key, value) {
|
|
return definePropertyModule.f(object, key, createPropertyDescriptor(1, value));
|
|
} : function (object, key, value) {
|
|
object[key] = value;
|
|
return object;
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/create-property-descriptor.js":
|
|
/*!***************************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/create-property-descriptor.js ***!
|
|
\***************************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
module.exports = function (bitmap, value) {
|
|
return {
|
|
enumerable: !(bitmap & 1),
|
|
configurable: !(bitmap & 2),
|
|
writable: !(bitmap & 4),
|
|
value: value
|
|
};
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/define-iterator.js":
|
|
/*!****************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/define-iterator.js ***!
|
|
\****************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
var $ = __webpack_require__(/*! ../internals/export */ "./node_modules/core-js-pure/internals/export.js");
|
|
var createIteratorConstructor = __webpack_require__(/*! ../internals/create-iterator-constructor */ "./node_modules/core-js-pure/internals/create-iterator-constructor.js");
|
|
var getPrototypeOf = __webpack_require__(/*! ../internals/object-get-prototype-of */ "./node_modules/core-js-pure/internals/object-get-prototype-of.js");
|
|
var setPrototypeOf = __webpack_require__(/*! ../internals/object-set-prototype-of */ "./node_modules/core-js-pure/internals/object-set-prototype-of.js");
|
|
var setToStringTag = __webpack_require__(/*! ../internals/set-to-string-tag */ "./node_modules/core-js-pure/internals/set-to-string-tag.js");
|
|
var createNonEnumerableProperty = __webpack_require__(/*! ../internals/create-non-enumerable-property */ "./node_modules/core-js-pure/internals/create-non-enumerable-property.js");
|
|
var redefine = __webpack_require__(/*! ../internals/redefine */ "./node_modules/core-js-pure/internals/redefine.js");
|
|
var wellKnownSymbol = __webpack_require__(/*! ../internals/well-known-symbol */ "./node_modules/core-js-pure/internals/well-known-symbol.js");
|
|
var IS_PURE = __webpack_require__(/*! ../internals/is-pure */ "./node_modules/core-js-pure/internals/is-pure.js");
|
|
var Iterators = __webpack_require__(/*! ../internals/iterators */ "./node_modules/core-js-pure/internals/iterators.js");
|
|
var IteratorsCore = __webpack_require__(/*! ../internals/iterators-core */ "./node_modules/core-js-pure/internals/iterators-core.js");
|
|
|
|
var IteratorPrototype = IteratorsCore.IteratorPrototype;
|
|
var BUGGY_SAFARI_ITERATORS = IteratorsCore.BUGGY_SAFARI_ITERATORS;
|
|
var ITERATOR = wellKnownSymbol('iterator');
|
|
var KEYS = 'keys';
|
|
var VALUES = 'values';
|
|
var ENTRIES = 'entries';
|
|
|
|
var returnThis = function () { return this; };
|
|
|
|
module.exports = function (Iterable, NAME, IteratorConstructor, next, DEFAULT, IS_SET, FORCED) {
|
|
createIteratorConstructor(IteratorConstructor, NAME, next);
|
|
|
|
var getIterationMethod = function (KIND) {
|
|
if (KIND === DEFAULT && defaultIterator) return defaultIterator;
|
|
if (!BUGGY_SAFARI_ITERATORS && KIND in IterablePrototype) return IterablePrototype[KIND];
|
|
switch (KIND) {
|
|
case KEYS: return function keys() { return new IteratorConstructor(this, KIND); };
|
|
case VALUES: return function values() { return new IteratorConstructor(this, KIND); };
|
|
case ENTRIES: return function entries() { return new IteratorConstructor(this, KIND); };
|
|
} return function () { return new IteratorConstructor(this); };
|
|
};
|
|
|
|
var TO_STRING_TAG = NAME + ' Iterator';
|
|
var INCORRECT_VALUES_NAME = false;
|
|
var IterablePrototype = Iterable.prototype;
|
|
var nativeIterator = IterablePrototype[ITERATOR]
|
|
|| IterablePrototype['@@iterator']
|
|
|| DEFAULT && IterablePrototype[DEFAULT];
|
|
var defaultIterator = !BUGGY_SAFARI_ITERATORS && nativeIterator || getIterationMethod(DEFAULT);
|
|
var anyNativeIterator = NAME == 'Array' ? IterablePrototype.entries || nativeIterator : nativeIterator;
|
|
var CurrentIteratorPrototype, methods, KEY;
|
|
|
|
// fix native
|
|
if (anyNativeIterator) {
|
|
CurrentIteratorPrototype = getPrototypeOf(anyNativeIterator.call(new Iterable()));
|
|
if (IteratorPrototype !== Object.prototype && CurrentIteratorPrototype.next) {
|
|
if (!IS_PURE && getPrototypeOf(CurrentIteratorPrototype) !== IteratorPrototype) {
|
|
if (setPrototypeOf) {
|
|
setPrototypeOf(CurrentIteratorPrototype, IteratorPrototype);
|
|
} else if (typeof CurrentIteratorPrototype[ITERATOR] != 'function') {
|
|
createNonEnumerableProperty(CurrentIteratorPrototype, ITERATOR, returnThis);
|
|
}
|
|
}
|
|
// Set @@toStringTag to native iterators
|
|
setToStringTag(CurrentIteratorPrototype, TO_STRING_TAG, true, true);
|
|
if (IS_PURE) Iterators[TO_STRING_TAG] = returnThis;
|
|
}
|
|
}
|
|
|
|
// fix Array#{values, @@iterator}.name in V8 / FF
|
|
if (DEFAULT == VALUES && nativeIterator && nativeIterator.name !== VALUES) {
|
|
INCORRECT_VALUES_NAME = true;
|
|
defaultIterator = function values() { return nativeIterator.call(this); };
|
|
}
|
|
|
|
// define iterator
|
|
if ((!IS_PURE || FORCED) && IterablePrototype[ITERATOR] !== defaultIterator) {
|
|
createNonEnumerableProperty(IterablePrototype, ITERATOR, defaultIterator);
|
|
}
|
|
Iterators[NAME] = defaultIterator;
|
|
|
|
// export additional methods
|
|
if (DEFAULT) {
|
|
methods = {
|
|
values: getIterationMethod(VALUES),
|
|
keys: IS_SET ? defaultIterator : getIterationMethod(KEYS),
|
|
entries: getIterationMethod(ENTRIES)
|
|
};
|
|
if (FORCED) for (KEY in methods) {
|
|
if (BUGGY_SAFARI_ITERATORS || INCORRECT_VALUES_NAME || !(KEY in IterablePrototype)) {
|
|
redefine(IterablePrototype, KEY, methods[KEY]);
|
|
}
|
|
} else $({ target: NAME, proto: true, forced: BUGGY_SAFARI_ITERATORS || INCORRECT_VALUES_NAME }, methods);
|
|
}
|
|
|
|
return methods;
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/descriptors.js":
|
|
/*!************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/descriptors.js ***!
|
|
\************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var fails = __webpack_require__(/*! ../internals/fails */ "./node_modules/core-js-pure/internals/fails.js");
|
|
|
|
// Thank's IE8 for his funny defineProperty
|
|
module.exports = !fails(function () {
|
|
return Object.defineProperty({}, 1, { get: function () { return 7; } })[1] != 7;
|
|
});
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/document-create-element.js":
|
|
/*!************************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/document-create-element.js ***!
|
|
\************************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var global = __webpack_require__(/*! ../internals/global */ "./node_modules/core-js-pure/internals/global.js");
|
|
var isObject = __webpack_require__(/*! ../internals/is-object */ "./node_modules/core-js-pure/internals/is-object.js");
|
|
|
|
var document = global.document;
|
|
// typeof document.createElement is 'object' in old IE
|
|
var EXISTS = isObject(document) && isObject(document.createElement);
|
|
|
|
module.exports = function (it) {
|
|
return EXISTS ? document.createElement(it) : {};
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/dom-iterables.js":
|
|
/*!**************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/dom-iterables.js ***!
|
|
\**************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
// iterable DOM collections
|
|
// flag - `iterable` interface - 'entries', 'keys', 'values', 'forEach' methods
|
|
module.exports = {
|
|
CSSRuleList: 0,
|
|
CSSStyleDeclaration: 0,
|
|
CSSValueList: 0,
|
|
ClientRectList: 0,
|
|
DOMRectList: 0,
|
|
DOMStringList: 0,
|
|
DOMTokenList: 1,
|
|
DataTransferItemList: 0,
|
|
FileList: 0,
|
|
HTMLAllCollection: 0,
|
|
HTMLCollection: 0,
|
|
HTMLFormElement: 0,
|
|
HTMLSelectElement: 0,
|
|
MediaList: 0,
|
|
MimeTypeArray: 0,
|
|
NamedNodeMap: 0,
|
|
NodeList: 1,
|
|
PaintRequestList: 0,
|
|
Plugin: 0,
|
|
PluginArray: 0,
|
|
SVGLengthList: 0,
|
|
SVGNumberList: 0,
|
|
SVGPathSegList: 0,
|
|
SVGPointList: 0,
|
|
SVGStringList: 0,
|
|
SVGTransformList: 0,
|
|
SourceBufferList: 0,
|
|
StyleSheetList: 0,
|
|
TextTrackCueList: 0,
|
|
TextTrackList: 0,
|
|
TouchList: 0
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/engine-is-ios.js":
|
|
/*!**************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/engine-is-ios.js ***!
|
|
\**************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var userAgent = __webpack_require__(/*! ../internals/engine-user-agent */ "./node_modules/core-js-pure/internals/engine-user-agent.js");
|
|
|
|
module.exports = /(iphone|ipod|ipad).*applewebkit/i.test(userAgent);
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/engine-user-agent.js":
|
|
/*!******************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/engine-user-agent.js ***!
|
|
\******************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var getBuiltIn = __webpack_require__(/*! ../internals/get-built-in */ "./node_modules/core-js-pure/internals/get-built-in.js");
|
|
|
|
module.exports = getBuiltIn('navigator', 'userAgent') || '';
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/engine-v8-version.js":
|
|
/*!******************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/engine-v8-version.js ***!
|
|
\******************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var global = __webpack_require__(/*! ../internals/global */ "./node_modules/core-js-pure/internals/global.js");
|
|
var userAgent = __webpack_require__(/*! ../internals/engine-user-agent */ "./node_modules/core-js-pure/internals/engine-user-agent.js");
|
|
|
|
var process = global.process;
|
|
var versions = process && process.versions;
|
|
var v8 = versions && versions.v8;
|
|
var match, version;
|
|
|
|
if (v8) {
|
|
match = v8.split('.');
|
|
version = match[0] + match[1];
|
|
} else if (userAgent) {
|
|
match = userAgent.match(/Edge\/(\d+)/);
|
|
if (!match || match[1] >= 74) {
|
|
match = userAgent.match(/Chrome\/(\d+)/);
|
|
if (match) version = match[1];
|
|
}
|
|
}
|
|
|
|
module.exports = version && +version;
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/enum-bug-keys.js":
|
|
/*!**************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/enum-bug-keys.js ***!
|
|
\**************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
// IE8- don't enum bug keys
|
|
module.exports = [
|
|
'constructor',
|
|
'hasOwnProperty',
|
|
'isPrototypeOf',
|
|
'propertyIsEnumerable',
|
|
'toLocaleString',
|
|
'toString',
|
|
'valueOf'
|
|
];
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/export.js":
|
|
/*!*******************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/export.js ***!
|
|
\*******************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
var global = __webpack_require__(/*! ../internals/global */ "./node_modules/core-js-pure/internals/global.js");
|
|
var getOwnPropertyDescriptor = __webpack_require__(/*! ../internals/object-get-own-property-descriptor */ "./node_modules/core-js-pure/internals/object-get-own-property-descriptor.js").f;
|
|
var isForced = __webpack_require__(/*! ../internals/is-forced */ "./node_modules/core-js-pure/internals/is-forced.js");
|
|
var path = __webpack_require__(/*! ../internals/path */ "./node_modules/core-js-pure/internals/path.js");
|
|
var bind = __webpack_require__(/*! ../internals/function-bind-context */ "./node_modules/core-js-pure/internals/function-bind-context.js");
|
|
var createNonEnumerableProperty = __webpack_require__(/*! ../internals/create-non-enumerable-property */ "./node_modules/core-js-pure/internals/create-non-enumerable-property.js");
|
|
var has = __webpack_require__(/*! ../internals/has */ "./node_modules/core-js-pure/internals/has.js");
|
|
|
|
var wrapConstructor = function (NativeConstructor) {
|
|
var Wrapper = function (a, b, c) {
|
|
if (this instanceof NativeConstructor) {
|
|
switch (arguments.length) {
|
|
case 0: return new NativeConstructor();
|
|
case 1: return new NativeConstructor(a);
|
|
case 2: return new NativeConstructor(a, b);
|
|
} return new NativeConstructor(a, b, c);
|
|
} return NativeConstructor.apply(this, arguments);
|
|
};
|
|
Wrapper.prototype = NativeConstructor.prototype;
|
|
return Wrapper;
|
|
};
|
|
|
|
/*
|
|
options.target - name of the target object
|
|
options.global - target is the global object
|
|
options.stat - export as static methods of target
|
|
options.proto - export as prototype methods of target
|
|
options.real - real prototype method for the `pure` version
|
|
options.forced - export even if the native feature is available
|
|
options.bind - bind methods to the target, required for the `pure` version
|
|
options.wrap - wrap constructors to preventing global pollution, required for the `pure` version
|
|
options.unsafe - use the simple assignment of property instead of delete + defineProperty
|
|
options.sham - add a flag to not completely full polyfills
|
|
options.enumerable - export as enumerable property
|
|
options.noTargetGet - prevent calling a getter on target
|
|
*/
|
|
module.exports = function (options, source) {
|
|
var TARGET = options.target;
|
|
var GLOBAL = options.global;
|
|
var STATIC = options.stat;
|
|
var PROTO = options.proto;
|
|
|
|
var nativeSource = GLOBAL ? global : STATIC ? global[TARGET] : (global[TARGET] || {}).prototype;
|
|
|
|
var target = GLOBAL ? path : path[TARGET] || (path[TARGET] = {});
|
|
var targetPrototype = target.prototype;
|
|
|
|
var FORCED, USE_NATIVE, VIRTUAL_PROTOTYPE;
|
|
var key, sourceProperty, targetProperty, nativeProperty, resultProperty, descriptor;
|
|
|
|
for (key in source) {
|
|
FORCED = isForced(GLOBAL ? key : TARGET + (STATIC ? '.' : '#') + key, options.forced);
|
|
// contains in native
|
|
USE_NATIVE = !FORCED && nativeSource && has(nativeSource, key);
|
|
|
|
targetProperty = target[key];
|
|
|
|
if (USE_NATIVE) if (options.noTargetGet) {
|
|
descriptor = getOwnPropertyDescriptor(nativeSource, key);
|
|
nativeProperty = descriptor && descriptor.value;
|
|
} else nativeProperty = nativeSource[key];
|
|
|
|
// export native or implementation
|
|
sourceProperty = (USE_NATIVE && nativeProperty) ? nativeProperty : source[key];
|
|
|
|
if (USE_NATIVE && typeof targetProperty === typeof sourceProperty) continue;
|
|
|
|
// bind timers to global for call from export context
|
|
if (options.bind && USE_NATIVE) resultProperty = bind(sourceProperty, global);
|
|
// wrap global constructors for prevent changs in this version
|
|
else if (options.wrap && USE_NATIVE) resultProperty = wrapConstructor(sourceProperty);
|
|
// make static versions for prototype methods
|
|
else if (PROTO && typeof sourceProperty == 'function') resultProperty = bind(Function.call, sourceProperty);
|
|
// default case
|
|
else resultProperty = sourceProperty;
|
|
|
|
// add a flag to not completely full polyfills
|
|
if (options.sham || (sourceProperty && sourceProperty.sham) || (targetProperty && targetProperty.sham)) {
|
|
createNonEnumerableProperty(resultProperty, 'sham', true);
|
|
}
|
|
|
|
target[key] = resultProperty;
|
|
|
|
if (PROTO) {
|
|
VIRTUAL_PROTOTYPE = TARGET + 'Prototype';
|
|
if (!has(path, VIRTUAL_PROTOTYPE)) {
|
|
createNonEnumerableProperty(path, VIRTUAL_PROTOTYPE, {});
|
|
}
|
|
// export virtual prototype methods
|
|
path[VIRTUAL_PROTOTYPE][key] = sourceProperty;
|
|
// export real prototype methods
|
|
if (options.real && targetPrototype && !targetPrototype[key]) {
|
|
createNonEnumerableProperty(targetPrototype, key, sourceProperty);
|
|
}
|
|
}
|
|
}
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/fails.js":
|
|
/*!******************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/fails.js ***!
|
|
\******************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
module.exports = function (exec) {
|
|
try {
|
|
return !!exec();
|
|
} catch (error) {
|
|
return true;
|
|
}
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/function-bind-context.js":
|
|
/*!**********************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/function-bind-context.js ***!
|
|
\**********************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var aFunction = __webpack_require__(/*! ../internals/a-function */ "./node_modules/core-js-pure/internals/a-function.js");
|
|
|
|
// optional / simple context binding
|
|
module.exports = function (fn, that, length) {
|
|
aFunction(fn);
|
|
if (that === undefined) return fn;
|
|
switch (length) {
|
|
case 0: return function () {
|
|
return fn.call(that);
|
|
};
|
|
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);
|
|
};
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/get-built-in.js":
|
|
/*!*************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/get-built-in.js ***!
|
|
\*************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var path = __webpack_require__(/*! ../internals/path */ "./node_modules/core-js-pure/internals/path.js");
|
|
var global = __webpack_require__(/*! ../internals/global */ "./node_modules/core-js-pure/internals/global.js");
|
|
|
|
var aFunction = function (variable) {
|
|
return typeof variable == 'function' ? variable : undefined;
|
|
};
|
|
|
|
module.exports = function (namespace, method) {
|
|
return arguments.length < 2 ? aFunction(path[namespace]) || aFunction(global[namespace])
|
|
: path[namespace] && path[namespace][method] || global[namespace] && global[namespace][method];
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/get-iterator-method.js":
|
|
/*!********************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/get-iterator-method.js ***!
|
|
\********************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var classof = __webpack_require__(/*! ../internals/classof */ "./node_modules/core-js-pure/internals/classof.js");
|
|
var Iterators = __webpack_require__(/*! ../internals/iterators */ "./node_modules/core-js-pure/internals/iterators.js");
|
|
var wellKnownSymbol = __webpack_require__(/*! ../internals/well-known-symbol */ "./node_modules/core-js-pure/internals/well-known-symbol.js");
|
|
|
|
var ITERATOR = wellKnownSymbol('iterator');
|
|
|
|
module.exports = function (it) {
|
|
if (it != undefined) return it[ITERATOR]
|
|
|| it['@@iterator']
|
|
|| Iterators[classof(it)];
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/global.js":
|
|
/*!*******************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/global.js ***!
|
|
\*******************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
/* WEBPACK VAR INJECTION */(function(global) {var check = function (it) {
|
|
return it && it.Math == Math && it;
|
|
};
|
|
|
|
// https://github.com/zloirock/core-js/issues/86#issuecomment-115759028
|
|
module.exports =
|
|
// eslint-disable-next-line no-undef
|
|
check(typeof globalThis == 'object' && globalThis) ||
|
|
check(typeof window == 'object' && window) ||
|
|
check(typeof self == 'object' && self) ||
|
|
check(typeof global == 'object' && global) ||
|
|
// eslint-disable-next-line no-new-func
|
|
Function('return this')();
|
|
|
|
/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./../../webpack/buildin/global.js */ "./node_modules/webpack/buildin/global.js")))
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/has.js":
|
|
/*!****************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/has.js ***!
|
|
\****************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
var hasOwnProperty = {}.hasOwnProperty;
|
|
|
|
module.exports = function (it, key) {
|
|
return hasOwnProperty.call(it, key);
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/hidden-keys.js":
|
|
/*!************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/hidden-keys.js ***!
|
|
\************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
module.exports = {};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/host-report-errors.js":
|
|
/*!*******************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/host-report-errors.js ***!
|
|
\*******************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var global = __webpack_require__(/*! ../internals/global */ "./node_modules/core-js-pure/internals/global.js");
|
|
|
|
module.exports = function (a, b) {
|
|
var console = global.console;
|
|
if (console && console.error) {
|
|
arguments.length === 1 ? console.error(a) : console.error(a, b);
|
|
}
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/html.js":
|
|
/*!*****************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/html.js ***!
|
|
\*****************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var getBuiltIn = __webpack_require__(/*! ../internals/get-built-in */ "./node_modules/core-js-pure/internals/get-built-in.js");
|
|
|
|
module.exports = getBuiltIn('document', 'documentElement');
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/ie8-dom-define.js":
|
|
/*!***************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/ie8-dom-define.js ***!
|
|
\***************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var DESCRIPTORS = __webpack_require__(/*! ../internals/descriptors */ "./node_modules/core-js-pure/internals/descriptors.js");
|
|
var fails = __webpack_require__(/*! ../internals/fails */ "./node_modules/core-js-pure/internals/fails.js");
|
|
var createElement = __webpack_require__(/*! ../internals/document-create-element */ "./node_modules/core-js-pure/internals/document-create-element.js");
|
|
|
|
// Thank's IE8 for his funny defineProperty
|
|
module.exports = !DESCRIPTORS && !fails(function () {
|
|
return Object.defineProperty(createElement('div'), 'a', {
|
|
get: function () { return 7; }
|
|
}).a != 7;
|
|
});
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/indexed-object.js":
|
|
/*!***************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/indexed-object.js ***!
|
|
\***************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var fails = __webpack_require__(/*! ../internals/fails */ "./node_modules/core-js-pure/internals/fails.js");
|
|
var classof = __webpack_require__(/*! ../internals/classof-raw */ "./node_modules/core-js-pure/internals/classof-raw.js");
|
|
|
|
var split = ''.split;
|
|
|
|
// fallback for non-array-like ES3 and non-enumerable old V8 strings
|
|
module.exports = fails(function () {
|
|
// throws an error in rhino, see https://github.com/mozilla/rhino/issues/346
|
|
// eslint-disable-next-line no-prototype-builtins
|
|
return !Object('z').propertyIsEnumerable(0);
|
|
}) ? function (it) {
|
|
return classof(it) == 'String' ? split.call(it, '') : Object(it);
|
|
} : Object;
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/inspect-source.js":
|
|
/*!***************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/inspect-source.js ***!
|
|
\***************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var store = __webpack_require__(/*! ../internals/shared-store */ "./node_modules/core-js-pure/internals/shared-store.js");
|
|
|
|
var functionToString = Function.toString;
|
|
|
|
// this helper broken in `3.4.1-3.4.4`, so we can't use `shared` helper
|
|
if (typeof store.inspectSource != 'function') {
|
|
store.inspectSource = function (it) {
|
|
return functionToString.call(it);
|
|
};
|
|
}
|
|
|
|
module.exports = store.inspectSource;
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/internal-state.js":
|
|
/*!***************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/internal-state.js ***!
|
|
\***************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var NATIVE_WEAK_MAP = __webpack_require__(/*! ../internals/native-weak-map */ "./node_modules/core-js-pure/internals/native-weak-map.js");
|
|
var global = __webpack_require__(/*! ../internals/global */ "./node_modules/core-js-pure/internals/global.js");
|
|
var isObject = __webpack_require__(/*! ../internals/is-object */ "./node_modules/core-js-pure/internals/is-object.js");
|
|
var createNonEnumerableProperty = __webpack_require__(/*! ../internals/create-non-enumerable-property */ "./node_modules/core-js-pure/internals/create-non-enumerable-property.js");
|
|
var objectHas = __webpack_require__(/*! ../internals/has */ "./node_modules/core-js-pure/internals/has.js");
|
|
var sharedKey = __webpack_require__(/*! ../internals/shared-key */ "./node_modules/core-js-pure/internals/shared-key.js");
|
|
var hiddenKeys = __webpack_require__(/*! ../internals/hidden-keys */ "./node_modules/core-js-pure/internals/hidden-keys.js");
|
|
|
|
var WeakMap = global.WeakMap;
|
|
var set, get, has;
|
|
|
|
var enforce = function (it) {
|
|
return has(it) ? get(it) : set(it, {});
|
|
};
|
|
|
|
var getterFor = function (TYPE) {
|
|
return function (it) {
|
|
var state;
|
|
if (!isObject(it) || (state = get(it)).type !== TYPE) {
|
|
throw TypeError('Incompatible receiver, ' + TYPE + ' required');
|
|
} return state;
|
|
};
|
|
};
|
|
|
|
if (NATIVE_WEAK_MAP) {
|
|
var store = new WeakMap();
|
|
var wmget = store.get;
|
|
var wmhas = store.has;
|
|
var wmset = store.set;
|
|
set = function (it, metadata) {
|
|
wmset.call(store, it, metadata);
|
|
return metadata;
|
|
};
|
|
get = function (it) {
|
|
return wmget.call(store, it) || {};
|
|
};
|
|
has = function (it) {
|
|
return wmhas.call(store, it);
|
|
};
|
|
} else {
|
|
var STATE = sharedKey('state');
|
|
hiddenKeys[STATE] = true;
|
|
set = function (it, metadata) {
|
|
createNonEnumerableProperty(it, STATE, metadata);
|
|
return metadata;
|
|
};
|
|
get = function (it) {
|
|
return objectHas(it, STATE) ? it[STATE] : {};
|
|
};
|
|
has = function (it) {
|
|
return objectHas(it, STATE);
|
|
};
|
|
}
|
|
|
|
module.exports = {
|
|
set: set,
|
|
get: get,
|
|
has: has,
|
|
enforce: enforce,
|
|
getterFor: getterFor
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/is-array-iterator-method.js":
|
|
/*!*************************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/is-array-iterator-method.js ***!
|
|
\*************************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var wellKnownSymbol = __webpack_require__(/*! ../internals/well-known-symbol */ "./node_modules/core-js-pure/internals/well-known-symbol.js");
|
|
var Iterators = __webpack_require__(/*! ../internals/iterators */ "./node_modules/core-js-pure/internals/iterators.js");
|
|
|
|
var ITERATOR = wellKnownSymbol('iterator');
|
|
var ArrayPrototype = Array.prototype;
|
|
|
|
// check on default Array iterator
|
|
module.exports = function (it) {
|
|
return it !== undefined && (Iterators.Array === it || ArrayPrototype[ITERATOR] === it);
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/is-forced.js":
|
|
/*!**********************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/is-forced.js ***!
|
|
\**********************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var fails = __webpack_require__(/*! ../internals/fails */ "./node_modules/core-js-pure/internals/fails.js");
|
|
|
|
var replacement = /#|\.prototype\./;
|
|
|
|
var isForced = function (feature, detection) {
|
|
var value = data[normalize(feature)];
|
|
return value == POLYFILL ? true
|
|
: value == NATIVE ? false
|
|
: typeof detection == 'function' ? fails(detection)
|
|
: !!detection;
|
|
};
|
|
|
|
var normalize = isForced.normalize = function (string) {
|
|
return String(string).replace(replacement, '.').toLowerCase();
|
|
};
|
|
|
|
var data = isForced.data = {};
|
|
var NATIVE = isForced.NATIVE = 'N';
|
|
var POLYFILL = isForced.POLYFILL = 'P';
|
|
|
|
module.exports = isForced;
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/is-object.js":
|
|
/*!**********************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/is-object.js ***!
|
|
\**********************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
module.exports = function (it) {
|
|
return typeof it === 'object' ? it !== null : typeof it === 'function';
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/is-pure.js":
|
|
/*!********************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/is-pure.js ***!
|
|
\********************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
module.exports = true;
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/iterate.js":
|
|
/*!********************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/iterate.js ***!
|
|
\********************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var anObject = __webpack_require__(/*! ../internals/an-object */ "./node_modules/core-js-pure/internals/an-object.js");
|
|
var isArrayIteratorMethod = __webpack_require__(/*! ../internals/is-array-iterator-method */ "./node_modules/core-js-pure/internals/is-array-iterator-method.js");
|
|
var toLength = __webpack_require__(/*! ../internals/to-length */ "./node_modules/core-js-pure/internals/to-length.js");
|
|
var bind = __webpack_require__(/*! ../internals/function-bind-context */ "./node_modules/core-js-pure/internals/function-bind-context.js");
|
|
var getIteratorMethod = __webpack_require__(/*! ../internals/get-iterator-method */ "./node_modules/core-js-pure/internals/get-iterator-method.js");
|
|
var callWithSafeIterationClosing = __webpack_require__(/*! ../internals/call-with-safe-iteration-closing */ "./node_modules/core-js-pure/internals/call-with-safe-iteration-closing.js");
|
|
|
|
var Result = function (stopped, result) {
|
|
this.stopped = stopped;
|
|
this.result = result;
|
|
};
|
|
|
|
var iterate = module.exports = function (iterable, fn, that, AS_ENTRIES, IS_ITERATOR) {
|
|
var boundFunction = bind(fn, that, AS_ENTRIES ? 2 : 1);
|
|
var iterator, iterFn, index, length, result, next, step;
|
|
|
|
if (IS_ITERATOR) {
|
|
iterator = iterable;
|
|
} else {
|
|
iterFn = getIteratorMethod(iterable);
|
|
if (typeof iterFn != 'function') throw TypeError('Target is not iterable');
|
|
// optimisation for array iterators
|
|
if (isArrayIteratorMethod(iterFn)) {
|
|
for (index = 0, length = toLength(iterable.length); length > index; index++) {
|
|
result = AS_ENTRIES
|
|
? boundFunction(anObject(step = iterable[index])[0], step[1])
|
|
: boundFunction(iterable[index]);
|
|
if (result && result instanceof Result) return result;
|
|
} return new Result(false);
|
|
}
|
|
iterator = iterFn.call(iterable);
|
|
}
|
|
|
|
next = iterator.next;
|
|
while (!(step = next.call(iterator)).done) {
|
|
result = callWithSafeIterationClosing(iterator, boundFunction, step.value, AS_ENTRIES);
|
|
if (typeof result == 'object' && result && result instanceof Result) return result;
|
|
} return new Result(false);
|
|
};
|
|
|
|
iterate.stop = function (result) {
|
|
return new Result(true, result);
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/iterators-core.js":
|
|
/*!***************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/iterators-core.js ***!
|
|
\***************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
var getPrototypeOf = __webpack_require__(/*! ../internals/object-get-prototype-of */ "./node_modules/core-js-pure/internals/object-get-prototype-of.js");
|
|
var createNonEnumerableProperty = __webpack_require__(/*! ../internals/create-non-enumerable-property */ "./node_modules/core-js-pure/internals/create-non-enumerable-property.js");
|
|
var has = __webpack_require__(/*! ../internals/has */ "./node_modules/core-js-pure/internals/has.js");
|
|
var wellKnownSymbol = __webpack_require__(/*! ../internals/well-known-symbol */ "./node_modules/core-js-pure/internals/well-known-symbol.js");
|
|
var IS_PURE = __webpack_require__(/*! ../internals/is-pure */ "./node_modules/core-js-pure/internals/is-pure.js");
|
|
|
|
var ITERATOR = wellKnownSymbol('iterator');
|
|
var BUGGY_SAFARI_ITERATORS = false;
|
|
|
|
var returnThis = function () { return this; };
|
|
|
|
// `%IteratorPrototype%` object
|
|
// https://tc39.github.io/ecma262/#sec-%iteratorprototype%-object
|
|
var IteratorPrototype, PrototypeOfArrayIteratorPrototype, arrayIterator;
|
|
|
|
if ([].keys) {
|
|
arrayIterator = [].keys();
|
|
// Safari 8 has buggy iterators w/o `next`
|
|
if (!('next' in arrayIterator)) BUGGY_SAFARI_ITERATORS = true;
|
|
else {
|
|
PrototypeOfArrayIteratorPrototype = getPrototypeOf(getPrototypeOf(arrayIterator));
|
|
if (PrototypeOfArrayIteratorPrototype !== Object.prototype) IteratorPrototype = PrototypeOfArrayIteratorPrototype;
|
|
}
|
|
}
|
|
|
|
if (IteratorPrototype == undefined) IteratorPrototype = {};
|
|
|
|
// 25.1.2.1.1 %IteratorPrototype%[@@iterator]()
|
|
if (!IS_PURE && !has(IteratorPrototype, ITERATOR)) {
|
|
createNonEnumerableProperty(IteratorPrototype, ITERATOR, returnThis);
|
|
}
|
|
|
|
module.exports = {
|
|
IteratorPrototype: IteratorPrototype,
|
|
BUGGY_SAFARI_ITERATORS: BUGGY_SAFARI_ITERATORS
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/iterators.js":
|
|
/*!**********************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/iterators.js ***!
|
|
\**********************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
module.exports = {};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/microtask.js":
|
|
/*!**********************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/microtask.js ***!
|
|
\**********************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var global = __webpack_require__(/*! ../internals/global */ "./node_modules/core-js-pure/internals/global.js");
|
|
var getOwnPropertyDescriptor = __webpack_require__(/*! ../internals/object-get-own-property-descriptor */ "./node_modules/core-js-pure/internals/object-get-own-property-descriptor.js").f;
|
|
var classof = __webpack_require__(/*! ../internals/classof-raw */ "./node_modules/core-js-pure/internals/classof-raw.js");
|
|
var macrotask = __webpack_require__(/*! ../internals/task */ "./node_modules/core-js-pure/internals/task.js").set;
|
|
var IS_IOS = __webpack_require__(/*! ../internals/engine-is-ios */ "./node_modules/core-js-pure/internals/engine-is-ios.js");
|
|
|
|
var MutationObserver = global.MutationObserver || global.WebKitMutationObserver;
|
|
var process = global.process;
|
|
var Promise = global.Promise;
|
|
var IS_NODE = classof(process) == 'process';
|
|
// Node.js 11 shows ExperimentalWarning on getting `queueMicrotask`
|
|
var queueMicrotaskDescriptor = getOwnPropertyDescriptor(global, 'queueMicrotask');
|
|
var queueMicrotask = queueMicrotaskDescriptor && queueMicrotaskDescriptor.value;
|
|
|
|
var flush, head, last, notify, toggle, node, promise, then;
|
|
|
|
// modern engines have queueMicrotask method
|
|
if (!queueMicrotask) {
|
|
flush = function () {
|
|
var parent, fn;
|
|
if (IS_NODE && (parent = process.domain)) parent.exit();
|
|
while (head) {
|
|
fn = head.fn;
|
|
head = head.next;
|
|
try {
|
|
fn();
|
|
} catch (error) {
|
|
if (head) notify();
|
|
else last = undefined;
|
|
throw error;
|
|
}
|
|
} last = undefined;
|
|
if (parent) parent.enter();
|
|
};
|
|
|
|
// Node.js
|
|
if (IS_NODE) {
|
|
notify = function () {
|
|
process.nextTick(flush);
|
|
};
|
|
// browsers with MutationObserver, except iOS - https://github.com/zloirock/core-js/issues/339
|
|
} else if (MutationObserver && !IS_IOS) {
|
|
toggle = true;
|
|
node = document.createTextNode('');
|
|
new MutationObserver(flush).observe(node, { characterData: true });
|
|
notify = function () {
|
|
node.data = toggle = !toggle;
|
|
};
|
|
// environments with maybe non-completely correct, but existent Promise
|
|
} else if (Promise && Promise.resolve) {
|
|
// Promise.resolve without an argument throws an error in LG WebOS 2
|
|
promise = Promise.resolve(undefined);
|
|
then = promise.then;
|
|
notify = function () {
|
|
then.call(promise, 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);
|
|
};
|
|
}
|
|
}
|
|
|
|
module.exports = queueMicrotask || function (fn) {
|
|
var task = { fn: fn, next: undefined };
|
|
if (last) last.next = task;
|
|
if (!head) {
|
|
head = task;
|
|
notify();
|
|
} last = task;
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/native-promise-constructor.js":
|
|
/*!***************************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/native-promise-constructor.js ***!
|
|
\***************************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var global = __webpack_require__(/*! ../internals/global */ "./node_modules/core-js-pure/internals/global.js");
|
|
|
|
module.exports = global.Promise;
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/native-symbol.js":
|
|
/*!**************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/native-symbol.js ***!
|
|
\**************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var fails = __webpack_require__(/*! ../internals/fails */ "./node_modules/core-js-pure/internals/fails.js");
|
|
|
|
module.exports = !!Object.getOwnPropertySymbols && !fails(function () {
|
|
// Chrome 38 Symbol has incorrect toString conversion
|
|
// eslint-disable-next-line no-undef
|
|
return !String(Symbol());
|
|
});
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/native-weak-map.js":
|
|
/*!****************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/native-weak-map.js ***!
|
|
\****************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var global = __webpack_require__(/*! ../internals/global */ "./node_modules/core-js-pure/internals/global.js");
|
|
var inspectSource = __webpack_require__(/*! ../internals/inspect-source */ "./node_modules/core-js-pure/internals/inspect-source.js");
|
|
|
|
var WeakMap = global.WeakMap;
|
|
|
|
module.exports = typeof WeakMap === 'function' && /native code/.test(inspectSource(WeakMap));
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/new-promise-capability.js":
|
|
/*!***********************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/new-promise-capability.js ***!
|
|
\***********************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
var aFunction = __webpack_require__(/*! ../internals/a-function */ "./node_modules/core-js-pure/internals/a-function.js");
|
|
|
|
var PromiseCapability = 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);
|
|
};
|
|
|
|
// 25.4.1.5 NewPromiseCapability(C)
|
|
module.exports.f = function (C) {
|
|
return new PromiseCapability(C);
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/object-create.js":
|
|
/*!**************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/object-create.js ***!
|
|
\**************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var anObject = __webpack_require__(/*! ../internals/an-object */ "./node_modules/core-js-pure/internals/an-object.js");
|
|
var defineProperties = __webpack_require__(/*! ../internals/object-define-properties */ "./node_modules/core-js-pure/internals/object-define-properties.js");
|
|
var enumBugKeys = __webpack_require__(/*! ../internals/enum-bug-keys */ "./node_modules/core-js-pure/internals/enum-bug-keys.js");
|
|
var hiddenKeys = __webpack_require__(/*! ../internals/hidden-keys */ "./node_modules/core-js-pure/internals/hidden-keys.js");
|
|
var html = __webpack_require__(/*! ../internals/html */ "./node_modules/core-js-pure/internals/html.js");
|
|
var documentCreateElement = __webpack_require__(/*! ../internals/document-create-element */ "./node_modules/core-js-pure/internals/document-create-element.js");
|
|
var sharedKey = __webpack_require__(/*! ../internals/shared-key */ "./node_modules/core-js-pure/internals/shared-key.js");
|
|
|
|
var GT = '>';
|
|
var LT = '<';
|
|
var PROTOTYPE = 'prototype';
|
|
var SCRIPT = 'script';
|
|
var IE_PROTO = sharedKey('IE_PROTO');
|
|
|
|
var EmptyConstructor = function () { /* empty */ };
|
|
|
|
var scriptTag = function (content) {
|
|
return LT + SCRIPT + GT + content + LT + '/' + SCRIPT + GT;
|
|
};
|
|
|
|
// Create object with fake `null` prototype: use ActiveX Object with cleared prototype
|
|
var NullProtoObjectViaActiveX = function (activeXDocument) {
|
|
activeXDocument.write(scriptTag(''));
|
|
activeXDocument.close();
|
|
var temp = activeXDocument.parentWindow.Object;
|
|
activeXDocument = null; // avoid memory leak
|
|
return temp;
|
|
};
|
|
|
|
// Create object with fake `null` prototype: use iframe Object with cleared prototype
|
|
var NullProtoObjectViaIFrame = function () {
|
|
// Thrash, waste and sodomy: IE GC bug
|
|
var iframe = documentCreateElement('iframe');
|
|
var JS = 'java' + SCRIPT + ':';
|
|
var iframeDocument;
|
|
iframe.style.display = 'none';
|
|
html.appendChild(iframe);
|
|
// https://github.com/zloirock/core-js/issues/475
|
|
iframe.src = String(JS);
|
|
iframeDocument = iframe.contentWindow.document;
|
|
iframeDocument.open();
|
|
iframeDocument.write(scriptTag('document.F=Object'));
|
|
iframeDocument.close();
|
|
return iframeDocument.F;
|
|
};
|
|
|
|
// Check for document.domain and active x support
|
|
// No need to use active x approach when document.domain is not set
|
|
// see https://github.com/es-shims/es5-shim/issues/150
|
|
// variation of https://github.com/kitcambridge/es5-shim/commit/4f738ac066346
|
|
// avoid IE GC bug
|
|
var activeXDocument;
|
|
var NullProtoObject = function () {
|
|
try {
|
|
/* global ActiveXObject */
|
|
activeXDocument = document.domain && new ActiveXObject('htmlfile');
|
|
} catch (error) { /* ignore */ }
|
|
NullProtoObject = activeXDocument ? NullProtoObjectViaActiveX(activeXDocument) : NullProtoObjectViaIFrame();
|
|
var length = enumBugKeys.length;
|
|
while (length--) delete NullProtoObject[PROTOTYPE][enumBugKeys[length]];
|
|
return NullProtoObject();
|
|
};
|
|
|
|
hiddenKeys[IE_PROTO] = true;
|
|
|
|
// `Object.create` method
|
|
// https://tc39.github.io/ecma262/#sec-object.create
|
|
module.exports = Object.create || function create(O, Properties) {
|
|
var result;
|
|
if (O !== null) {
|
|
EmptyConstructor[PROTOTYPE] = anObject(O);
|
|
result = new EmptyConstructor();
|
|
EmptyConstructor[PROTOTYPE] = null;
|
|
// add "__proto__" for Object.getPrototypeOf polyfill
|
|
result[IE_PROTO] = O;
|
|
} else result = NullProtoObject();
|
|
return Properties === undefined ? result : defineProperties(result, Properties);
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/object-define-properties.js":
|
|
/*!*************************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/object-define-properties.js ***!
|
|
\*************************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var DESCRIPTORS = __webpack_require__(/*! ../internals/descriptors */ "./node_modules/core-js-pure/internals/descriptors.js");
|
|
var definePropertyModule = __webpack_require__(/*! ../internals/object-define-property */ "./node_modules/core-js-pure/internals/object-define-property.js");
|
|
var anObject = __webpack_require__(/*! ../internals/an-object */ "./node_modules/core-js-pure/internals/an-object.js");
|
|
var objectKeys = __webpack_require__(/*! ../internals/object-keys */ "./node_modules/core-js-pure/internals/object-keys.js");
|
|
|
|
// `Object.defineProperties` method
|
|
// https://tc39.github.io/ecma262/#sec-object.defineproperties
|
|
module.exports = DESCRIPTORS ? Object.defineProperties : function defineProperties(O, Properties) {
|
|
anObject(O);
|
|
var keys = objectKeys(Properties);
|
|
var length = keys.length;
|
|
var index = 0;
|
|
var key;
|
|
while (length > index) definePropertyModule.f(O, key = keys[index++], Properties[key]);
|
|
return O;
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/object-define-property.js":
|
|
/*!***********************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/object-define-property.js ***!
|
|
\***********************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var DESCRIPTORS = __webpack_require__(/*! ../internals/descriptors */ "./node_modules/core-js-pure/internals/descriptors.js");
|
|
var IE8_DOM_DEFINE = __webpack_require__(/*! ../internals/ie8-dom-define */ "./node_modules/core-js-pure/internals/ie8-dom-define.js");
|
|
var anObject = __webpack_require__(/*! ../internals/an-object */ "./node_modules/core-js-pure/internals/an-object.js");
|
|
var toPrimitive = __webpack_require__(/*! ../internals/to-primitive */ "./node_modules/core-js-pure/internals/to-primitive.js");
|
|
|
|
var nativeDefineProperty = Object.defineProperty;
|
|
|
|
// `Object.defineProperty` method
|
|
// https://tc39.github.io/ecma262/#sec-object.defineproperty
|
|
exports.f = DESCRIPTORS ? nativeDefineProperty : function defineProperty(O, P, Attributes) {
|
|
anObject(O);
|
|
P = toPrimitive(P, true);
|
|
anObject(Attributes);
|
|
if (IE8_DOM_DEFINE) try {
|
|
return nativeDefineProperty(O, P, Attributes);
|
|
} catch (error) { /* empty */ }
|
|
if ('get' in Attributes || 'set' in Attributes) throw TypeError('Accessors not supported');
|
|
if ('value' in Attributes) O[P] = Attributes.value;
|
|
return O;
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/object-get-own-property-descriptor.js":
|
|
/*!***********************************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/object-get-own-property-descriptor.js ***!
|
|
\***********************************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var DESCRIPTORS = __webpack_require__(/*! ../internals/descriptors */ "./node_modules/core-js-pure/internals/descriptors.js");
|
|
var propertyIsEnumerableModule = __webpack_require__(/*! ../internals/object-property-is-enumerable */ "./node_modules/core-js-pure/internals/object-property-is-enumerable.js");
|
|
var createPropertyDescriptor = __webpack_require__(/*! ../internals/create-property-descriptor */ "./node_modules/core-js-pure/internals/create-property-descriptor.js");
|
|
var toIndexedObject = __webpack_require__(/*! ../internals/to-indexed-object */ "./node_modules/core-js-pure/internals/to-indexed-object.js");
|
|
var toPrimitive = __webpack_require__(/*! ../internals/to-primitive */ "./node_modules/core-js-pure/internals/to-primitive.js");
|
|
var has = __webpack_require__(/*! ../internals/has */ "./node_modules/core-js-pure/internals/has.js");
|
|
var IE8_DOM_DEFINE = __webpack_require__(/*! ../internals/ie8-dom-define */ "./node_modules/core-js-pure/internals/ie8-dom-define.js");
|
|
|
|
var nativeGetOwnPropertyDescriptor = Object.getOwnPropertyDescriptor;
|
|
|
|
// `Object.getOwnPropertyDescriptor` method
|
|
// https://tc39.github.io/ecma262/#sec-object.getownpropertydescriptor
|
|
exports.f = DESCRIPTORS ? nativeGetOwnPropertyDescriptor : function getOwnPropertyDescriptor(O, P) {
|
|
O = toIndexedObject(O);
|
|
P = toPrimitive(P, true);
|
|
if (IE8_DOM_DEFINE) try {
|
|
return nativeGetOwnPropertyDescriptor(O, P);
|
|
} catch (error) { /* empty */ }
|
|
if (has(O, P)) return createPropertyDescriptor(!propertyIsEnumerableModule.f.call(O, P), O[P]);
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/object-get-prototype-of.js":
|
|
/*!************************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/object-get-prototype-of.js ***!
|
|
\************************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var has = __webpack_require__(/*! ../internals/has */ "./node_modules/core-js-pure/internals/has.js");
|
|
var toObject = __webpack_require__(/*! ../internals/to-object */ "./node_modules/core-js-pure/internals/to-object.js");
|
|
var sharedKey = __webpack_require__(/*! ../internals/shared-key */ "./node_modules/core-js-pure/internals/shared-key.js");
|
|
var CORRECT_PROTOTYPE_GETTER = __webpack_require__(/*! ../internals/correct-prototype-getter */ "./node_modules/core-js-pure/internals/correct-prototype-getter.js");
|
|
|
|
var IE_PROTO = sharedKey('IE_PROTO');
|
|
var ObjectPrototype = Object.prototype;
|
|
|
|
// `Object.getPrototypeOf` method
|
|
// https://tc39.github.io/ecma262/#sec-object.getprototypeof
|
|
module.exports = CORRECT_PROTOTYPE_GETTER ? 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 ? ObjectPrototype : null;
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/object-keys-internal.js":
|
|
/*!*********************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/object-keys-internal.js ***!
|
|
\*********************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var has = __webpack_require__(/*! ../internals/has */ "./node_modules/core-js-pure/internals/has.js");
|
|
var toIndexedObject = __webpack_require__(/*! ../internals/to-indexed-object */ "./node_modules/core-js-pure/internals/to-indexed-object.js");
|
|
var indexOf = __webpack_require__(/*! ../internals/array-includes */ "./node_modules/core-js-pure/internals/array-includes.js").indexOf;
|
|
var hiddenKeys = __webpack_require__(/*! ../internals/hidden-keys */ "./node_modules/core-js-pure/internals/hidden-keys.js");
|
|
|
|
module.exports = function (object, names) {
|
|
var O = toIndexedObject(object);
|
|
var i = 0;
|
|
var result = [];
|
|
var key;
|
|
for (key in O) !has(hiddenKeys, key) && has(O, key) && result.push(key);
|
|
// Don't enum bug & hidden keys
|
|
while (names.length > i) if (has(O, key = names[i++])) {
|
|
~indexOf(result, key) || result.push(key);
|
|
}
|
|
return result;
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/object-keys.js":
|
|
/*!************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/object-keys.js ***!
|
|
\************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var internalObjectKeys = __webpack_require__(/*! ../internals/object-keys-internal */ "./node_modules/core-js-pure/internals/object-keys-internal.js");
|
|
var enumBugKeys = __webpack_require__(/*! ../internals/enum-bug-keys */ "./node_modules/core-js-pure/internals/enum-bug-keys.js");
|
|
|
|
// `Object.keys` method
|
|
// https://tc39.github.io/ecma262/#sec-object.keys
|
|
module.exports = Object.keys || function keys(O) {
|
|
return internalObjectKeys(O, enumBugKeys);
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/object-property-is-enumerable.js":
|
|
/*!******************************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/object-property-is-enumerable.js ***!
|
|
\******************************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
var nativePropertyIsEnumerable = {}.propertyIsEnumerable;
|
|
var getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor;
|
|
|
|
// Nashorn ~ JDK8 bug
|
|
var NASHORN_BUG = getOwnPropertyDescriptor && !nativePropertyIsEnumerable.call({ 1: 2 }, 1);
|
|
|
|
// `Object.prototype.propertyIsEnumerable` method implementation
|
|
// https://tc39.github.io/ecma262/#sec-object.prototype.propertyisenumerable
|
|
exports.f = NASHORN_BUG ? function propertyIsEnumerable(V) {
|
|
var descriptor = getOwnPropertyDescriptor(this, V);
|
|
return !!descriptor && descriptor.enumerable;
|
|
} : nativePropertyIsEnumerable;
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/object-set-prototype-of.js":
|
|
/*!************************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/object-set-prototype-of.js ***!
|
|
\************************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var anObject = __webpack_require__(/*! ../internals/an-object */ "./node_modules/core-js-pure/internals/an-object.js");
|
|
var aPossiblePrototype = __webpack_require__(/*! ../internals/a-possible-prototype */ "./node_modules/core-js-pure/internals/a-possible-prototype.js");
|
|
|
|
// `Object.setPrototypeOf` method
|
|
// https://tc39.github.io/ecma262/#sec-object.setprototypeof
|
|
// Works with __proto__ only. Old v8 can't work with null proto objects.
|
|
/* eslint-disable no-proto */
|
|
module.exports = Object.setPrototypeOf || ('__proto__' in {} ? function () {
|
|
var CORRECT_SETTER = false;
|
|
var test = {};
|
|
var setter;
|
|
try {
|
|
setter = Object.getOwnPropertyDescriptor(Object.prototype, '__proto__').set;
|
|
setter.call(test, []);
|
|
CORRECT_SETTER = test instanceof Array;
|
|
} catch (error) { /* empty */ }
|
|
return function setPrototypeOf(O, proto) {
|
|
anObject(O);
|
|
aPossiblePrototype(proto);
|
|
if (CORRECT_SETTER) setter.call(O, proto);
|
|
else O.__proto__ = proto;
|
|
return O;
|
|
};
|
|
}() : undefined);
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/object-to-string.js":
|
|
/*!*****************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/object-to-string.js ***!
|
|
\*****************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
var TO_STRING_TAG_SUPPORT = __webpack_require__(/*! ../internals/to-string-tag-support */ "./node_modules/core-js-pure/internals/to-string-tag-support.js");
|
|
var classof = __webpack_require__(/*! ../internals/classof */ "./node_modules/core-js-pure/internals/classof.js");
|
|
|
|
// `Object.prototype.toString` method implementation
|
|
// https://tc39.github.io/ecma262/#sec-object.prototype.tostring
|
|
module.exports = TO_STRING_TAG_SUPPORT ? {}.toString : function toString() {
|
|
return '[object ' + classof(this) + ']';
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/path.js":
|
|
/*!*****************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/path.js ***!
|
|
\*****************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
module.exports = {};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/perform.js":
|
|
/*!********************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/perform.js ***!
|
|
\********************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
module.exports = function (exec) {
|
|
try {
|
|
return { error: false, value: exec() };
|
|
} catch (error) {
|
|
return { error: true, value: error };
|
|
}
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/promise-resolve.js":
|
|
/*!****************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/promise-resolve.js ***!
|
|
\****************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var anObject = __webpack_require__(/*! ../internals/an-object */ "./node_modules/core-js-pure/internals/an-object.js");
|
|
var isObject = __webpack_require__(/*! ../internals/is-object */ "./node_modules/core-js-pure/internals/is-object.js");
|
|
var newPromiseCapability = __webpack_require__(/*! ../internals/new-promise-capability */ "./node_modules/core-js-pure/internals/new-promise-capability.js");
|
|
|
|
module.exports = function (C, x) {
|
|
anObject(C);
|
|
if (isObject(x) && x.constructor === C) return x;
|
|
var promiseCapability = newPromiseCapability.f(C);
|
|
var resolve = promiseCapability.resolve;
|
|
resolve(x);
|
|
return promiseCapability.promise;
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/redefine-all.js":
|
|
/*!*************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/redefine-all.js ***!
|
|
\*************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var redefine = __webpack_require__(/*! ../internals/redefine */ "./node_modules/core-js-pure/internals/redefine.js");
|
|
|
|
module.exports = function (target, src, options) {
|
|
for (var key in src) {
|
|
if (options && options.unsafe && target[key]) target[key] = src[key];
|
|
else redefine(target, key, src[key], options);
|
|
} return target;
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/redefine.js":
|
|
/*!*********************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/redefine.js ***!
|
|
\*********************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var createNonEnumerableProperty = __webpack_require__(/*! ../internals/create-non-enumerable-property */ "./node_modules/core-js-pure/internals/create-non-enumerable-property.js");
|
|
|
|
module.exports = function (target, key, value, options) {
|
|
if (options && options.enumerable) target[key] = value;
|
|
else createNonEnumerableProperty(target, key, value);
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/require-object-coercible.js":
|
|
/*!*************************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/require-object-coercible.js ***!
|
|
\*************************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
// `RequireObjectCoercible` abstract operation
|
|
// https://tc39.github.io/ecma262/#sec-requireobjectcoercible
|
|
module.exports = function (it) {
|
|
if (it == undefined) throw TypeError("Can't call method on " + it);
|
|
return it;
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/set-global.js":
|
|
/*!***********************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/set-global.js ***!
|
|
\***********************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var global = __webpack_require__(/*! ../internals/global */ "./node_modules/core-js-pure/internals/global.js");
|
|
var createNonEnumerableProperty = __webpack_require__(/*! ../internals/create-non-enumerable-property */ "./node_modules/core-js-pure/internals/create-non-enumerable-property.js");
|
|
|
|
module.exports = function (key, value) {
|
|
try {
|
|
createNonEnumerableProperty(global, key, value);
|
|
} catch (error) {
|
|
global[key] = value;
|
|
} return value;
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/set-species.js":
|
|
/*!************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/set-species.js ***!
|
|
\************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
var getBuiltIn = __webpack_require__(/*! ../internals/get-built-in */ "./node_modules/core-js-pure/internals/get-built-in.js");
|
|
var definePropertyModule = __webpack_require__(/*! ../internals/object-define-property */ "./node_modules/core-js-pure/internals/object-define-property.js");
|
|
var wellKnownSymbol = __webpack_require__(/*! ../internals/well-known-symbol */ "./node_modules/core-js-pure/internals/well-known-symbol.js");
|
|
var DESCRIPTORS = __webpack_require__(/*! ../internals/descriptors */ "./node_modules/core-js-pure/internals/descriptors.js");
|
|
|
|
var SPECIES = wellKnownSymbol('species');
|
|
|
|
module.exports = function (CONSTRUCTOR_NAME) {
|
|
var Constructor = getBuiltIn(CONSTRUCTOR_NAME);
|
|
var defineProperty = definePropertyModule.f;
|
|
|
|
if (DESCRIPTORS && Constructor && !Constructor[SPECIES]) {
|
|
defineProperty(Constructor, SPECIES, {
|
|
configurable: true,
|
|
get: function () { return this; }
|
|
});
|
|
}
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/set-to-string-tag.js":
|
|
/*!******************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/set-to-string-tag.js ***!
|
|
\******************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var TO_STRING_TAG_SUPPORT = __webpack_require__(/*! ../internals/to-string-tag-support */ "./node_modules/core-js-pure/internals/to-string-tag-support.js");
|
|
var defineProperty = __webpack_require__(/*! ../internals/object-define-property */ "./node_modules/core-js-pure/internals/object-define-property.js").f;
|
|
var createNonEnumerableProperty = __webpack_require__(/*! ../internals/create-non-enumerable-property */ "./node_modules/core-js-pure/internals/create-non-enumerable-property.js");
|
|
var has = __webpack_require__(/*! ../internals/has */ "./node_modules/core-js-pure/internals/has.js");
|
|
var toString = __webpack_require__(/*! ../internals/object-to-string */ "./node_modules/core-js-pure/internals/object-to-string.js");
|
|
var wellKnownSymbol = __webpack_require__(/*! ../internals/well-known-symbol */ "./node_modules/core-js-pure/internals/well-known-symbol.js");
|
|
|
|
var TO_STRING_TAG = wellKnownSymbol('toStringTag');
|
|
|
|
module.exports = function (it, TAG, STATIC, SET_METHOD) {
|
|
if (it) {
|
|
var target = STATIC ? it : it.prototype;
|
|
if (!has(target, TO_STRING_TAG)) {
|
|
defineProperty(target, TO_STRING_TAG, { configurable: true, value: TAG });
|
|
}
|
|
if (SET_METHOD && !TO_STRING_TAG_SUPPORT) {
|
|
createNonEnumerableProperty(target, 'toString', toString);
|
|
}
|
|
}
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/shared-key.js":
|
|
/*!***********************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/shared-key.js ***!
|
|
\***********************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var shared = __webpack_require__(/*! ../internals/shared */ "./node_modules/core-js-pure/internals/shared.js");
|
|
var uid = __webpack_require__(/*! ../internals/uid */ "./node_modules/core-js-pure/internals/uid.js");
|
|
|
|
var keys = shared('keys');
|
|
|
|
module.exports = function (key) {
|
|
return keys[key] || (keys[key] = uid(key));
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/shared-store.js":
|
|
/*!*************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/shared-store.js ***!
|
|
\*************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var global = __webpack_require__(/*! ../internals/global */ "./node_modules/core-js-pure/internals/global.js");
|
|
var setGlobal = __webpack_require__(/*! ../internals/set-global */ "./node_modules/core-js-pure/internals/set-global.js");
|
|
|
|
var SHARED = '__core-js_shared__';
|
|
var store = global[SHARED] || setGlobal(SHARED, {});
|
|
|
|
module.exports = store;
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/shared.js":
|
|
/*!*******************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/shared.js ***!
|
|
\*******************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var IS_PURE = __webpack_require__(/*! ../internals/is-pure */ "./node_modules/core-js-pure/internals/is-pure.js");
|
|
var store = __webpack_require__(/*! ../internals/shared-store */ "./node_modules/core-js-pure/internals/shared-store.js");
|
|
|
|
(module.exports = function (key, value) {
|
|
return store[key] || (store[key] = value !== undefined ? value : {});
|
|
})('versions', []).push({
|
|
version: '3.6.4',
|
|
mode: IS_PURE ? 'pure' : 'global',
|
|
copyright: '© 2020 Denis Pushkarev (zloirock.ru)'
|
|
});
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/species-constructor.js":
|
|
/*!********************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/species-constructor.js ***!
|
|
\********************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var anObject = __webpack_require__(/*! ../internals/an-object */ "./node_modules/core-js-pure/internals/an-object.js");
|
|
var aFunction = __webpack_require__(/*! ../internals/a-function */ "./node_modules/core-js-pure/internals/a-function.js");
|
|
var wellKnownSymbol = __webpack_require__(/*! ../internals/well-known-symbol */ "./node_modules/core-js-pure/internals/well-known-symbol.js");
|
|
|
|
var SPECIES = wellKnownSymbol('species');
|
|
|
|
// `SpeciesConstructor` abstract operation
|
|
// https://tc39.github.io/ecma262/#sec-speciesconstructor
|
|
module.exports = function (O, defaultConstructor) {
|
|
var C = anObject(O).constructor;
|
|
var S;
|
|
return C === undefined || (S = anObject(C)[SPECIES]) == undefined ? defaultConstructor : aFunction(S);
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/string-multibyte.js":
|
|
/*!*****************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/string-multibyte.js ***!
|
|
\*****************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var toInteger = __webpack_require__(/*! ../internals/to-integer */ "./node_modules/core-js-pure/internals/to-integer.js");
|
|
var requireObjectCoercible = __webpack_require__(/*! ../internals/require-object-coercible */ "./node_modules/core-js-pure/internals/require-object-coercible.js");
|
|
|
|
// `String.prototype.{ codePointAt, at }` methods implementation
|
|
var createMethod = function (CONVERT_TO_STRING) {
|
|
return function ($this, pos) {
|
|
var S = String(requireObjectCoercible($this));
|
|
var position = toInteger(pos);
|
|
var size = S.length;
|
|
var first, second;
|
|
if (position < 0 || position >= size) return CONVERT_TO_STRING ? '' : undefined;
|
|
first = S.charCodeAt(position);
|
|
return first < 0xD800 || first > 0xDBFF || position + 1 === size
|
|
|| (second = S.charCodeAt(position + 1)) < 0xDC00 || second > 0xDFFF
|
|
? CONVERT_TO_STRING ? S.charAt(position) : first
|
|
: CONVERT_TO_STRING ? S.slice(position, position + 2) : (first - 0xD800 << 10) + (second - 0xDC00) + 0x10000;
|
|
};
|
|
};
|
|
|
|
module.exports = {
|
|
// `String.prototype.codePointAt` method
|
|
// https://tc39.github.io/ecma262/#sec-string.prototype.codepointat
|
|
codeAt: createMethod(false),
|
|
// `String.prototype.at` method
|
|
// https://github.com/mathiasbynens/String.prototype.at
|
|
charAt: createMethod(true)
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/task.js":
|
|
/*!*****************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/task.js ***!
|
|
\*****************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var global = __webpack_require__(/*! ../internals/global */ "./node_modules/core-js-pure/internals/global.js");
|
|
var fails = __webpack_require__(/*! ../internals/fails */ "./node_modules/core-js-pure/internals/fails.js");
|
|
var classof = __webpack_require__(/*! ../internals/classof-raw */ "./node_modules/core-js-pure/internals/classof-raw.js");
|
|
var bind = __webpack_require__(/*! ../internals/function-bind-context */ "./node_modules/core-js-pure/internals/function-bind-context.js");
|
|
var html = __webpack_require__(/*! ../internals/html */ "./node_modules/core-js-pure/internals/html.js");
|
|
var createElement = __webpack_require__(/*! ../internals/document-create-element */ "./node_modules/core-js-pure/internals/document-create-element.js");
|
|
var IS_IOS = __webpack_require__(/*! ../internals/engine-is-ios */ "./node_modules/core-js-pure/internals/engine-is-ios.js");
|
|
|
|
var location = global.location;
|
|
var set = global.setImmediate;
|
|
var clear = global.clearImmediate;
|
|
var process = global.process;
|
|
var MessageChannel = global.MessageChannel;
|
|
var Dispatch = global.Dispatch;
|
|
var counter = 0;
|
|
var queue = {};
|
|
var ONREADYSTATECHANGE = 'onreadystatechange';
|
|
var defer, channel, port;
|
|
|
|
var run = function (id) {
|
|
// eslint-disable-next-line no-prototype-builtins
|
|
if (queue.hasOwnProperty(id)) {
|
|
var fn = queue[id];
|
|
delete queue[id];
|
|
fn();
|
|
}
|
|
};
|
|
|
|
var runner = function (id) {
|
|
return function () {
|
|
run(id);
|
|
};
|
|
};
|
|
|
|
var listener = function (event) {
|
|
run(event.data);
|
|
};
|
|
|
|
var post = function (id) {
|
|
// old engines have not location.origin
|
|
global.postMessage(id + '', location.protocol + '//' + location.host);
|
|
};
|
|
|
|
// Node.js 0.9+ & IE10+ has setImmediate, otherwise:
|
|
if (!set || !clear) {
|
|
set = function setImmediate(fn) {
|
|
var args = [];
|
|
var i = 1;
|
|
while (arguments.length > i) args.push(arguments[i++]);
|
|
queue[++counter] = function () {
|
|
// eslint-disable-next-line no-new-func
|
|
(typeof fn == 'function' ? fn : Function(fn)).apply(undefined, args);
|
|
};
|
|
defer(counter);
|
|
return counter;
|
|
};
|
|
clear = function clearImmediate(id) {
|
|
delete queue[id];
|
|
};
|
|
// Node.js 0.8-
|
|
if (classof(process) == 'process') {
|
|
defer = function (id) {
|
|
process.nextTick(runner(id));
|
|
};
|
|
// Sphere (JS game engine) Dispatch API
|
|
} else if (Dispatch && Dispatch.now) {
|
|
defer = function (id) {
|
|
Dispatch.now(runner(id));
|
|
};
|
|
// Browsers with MessageChannel, includes WebWorkers
|
|
// except iOS - https://github.com/zloirock/core-js/issues/624
|
|
} else if (MessageChannel && !IS_IOS) {
|
|
channel = new MessageChannel();
|
|
port = channel.port2;
|
|
channel.port1.onmessage = listener;
|
|
defer = bind(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 && !fails(post)) {
|
|
defer = post;
|
|
global.addEventListener('message', listener, false);
|
|
// IE8-
|
|
} else if (ONREADYSTATECHANGE in createElement('script')) {
|
|
defer = function (id) {
|
|
html.appendChild(createElement('script'))[ONREADYSTATECHANGE] = function () {
|
|
html.removeChild(this);
|
|
run(id);
|
|
};
|
|
};
|
|
// Rest old browsers
|
|
} else {
|
|
defer = function (id) {
|
|
setTimeout(runner(id), 0);
|
|
};
|
|
}
|
|
}
|
|
|
|
module.exports = {
|
|
set: set,
|
|
clear: clear
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/to-absolute-index.js":
|
|
/*!******************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/to-absolute-index.js ***!
|
|
\******************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var toInteger = __webpack_require__(/*! ../internals/to-integer */ "./node_modules/core-js-pure/internals/to-integer.js");
|
|
|
|
var max = Math.max;
|
|
var min = Math.min;
|
|
|
|
// Helper for a popular repeating case of the spec:
|
|
// Let integer be ? ToInteger(index).
|
|
// If integer < 0, let result be max((length + integer), 0); else let result be min(integer, length).
|
|
module.exports = function (index, length) {
|
|
var integer = toInteger(index);
|
|
return integer < 0 ? max(integer + length, 0) : min(integer, length);
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/to-indexed-object.js":
|
|
/*!******************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/to-indexed-object.js ***!
|
|
\******************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
// toObject with fallback for non-array-like ES3 strings
|
|
var IndexedObject = __webpack_require__(/*! ../internals/indexed-object */ "./node_modules/core-js-pure/internals/indexed-object.js");
|
|
var requireObjectCoercible = __webpack_require__(/*! ../internals/require-object-coercible */ "./node_modules/core-js-pure/internals/require-object-coercible.js");
|
|
|
|
module.exports = function (it) {
|
|
return IndexedObject(requireObjectCoercible(it));
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/to-integer.js":
|
|
/*!***********************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/to-integer.js ***!
|
|
\***********************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
var ceil = Math.ceil;
|
|
var floor = Math.floor;
|
|
|
|
// `ToInteger` abstract operation
|
|
// https://tc39.github.io/ecma262/#sec-tointeger
|
|
module.exports = function (argument) {
|
|
return isNaN(argument = +argument) ? 0 : (argument > 0 ? floor : ceil)(argument);
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/to-length.js":
|
|
/*!**********************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/to-length.js ***!
|
|
\**********************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var toInteger = __webpack_require__(/*! ../internals/to-integer */ "./node_modules/core-js-pure/internals/to-integer.js");
|
|
|
|
var min = Math.min;
|
|
|
|
// `ToLength` abstract operation
|
|
// https://tc39.github.io/ecma262/#sec-tolength
|
|
module.exports = function (argument) {
|
|
return argument > 0 ? min(toInteger(argument), 0x1FFFFFFFFFFFFF) : 0; // 2 ** 53 - 1 == 9007199254740991
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/to-object.js":
|
|
/*!**********************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/to-object.js ***!
|
|
\**********************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var requireObjectCoercible = __webpack_require__(/*! ../internals/require-object-coercible */ "./node_modules/core-js-pure/internals/require-object-coercible.js");
|
|
|
|
// `ToObject` abstract operation
|
|
// https://tc39.github.io/ecma262/#sec-toobject
|
|
module.exports = function (argument) {
|
|
return Object(requireObjectCoercible(argument));
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/to-primitive.js":
|
|
/*!*************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/to-primitive.js ***!
|
|
\*************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var isObject = __webpack_require__(/*! ../internals/is-object */ "./node_modules/core-js-pure/internals/is-object.js");
|
|
|
|
// `ToPrimitive` abstract operation
|
|
// https://tc39.github.io/ecma262/#sec-toprimitive
|
|
// 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 (input, PREFERRED_STRING) {
|
|
if (!isObject(input)) return input;
|
|
var fn, val;
|
|
if (PREFERRED_STRING && typeof (fn = input.toString) == 'function' && !isObject(val = fn.call(input))) return val;
|
|
if (typeof (fn = input.valueOf) == 'function' && !isObject(val = fn.call(input))) return val;
|
|
if (!PREFERRED_STRING && typeof (fn = input.toString) == 'function' && !isObject(val = fn.call(input))) return val;
|
|
throw TypeError("Can't convert object to primitive value");
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/to-string-tag-support.js":
|
|
/*!**********************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/to-string-tag-support.js ***!
|
|
\**********************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var wellKnownSymbol = __webpack_require__(/*! ../internals/well-known-symbol */ "./node_modules/core-js-pure/internals/well-known-symbol.js");
|
|
|
|
var TO_STRING_TAG = wellKnownSymbol('toStringTag');
|
|
var test = {};
|
|
|
|
test[TO_STRING_TAG] = 'z';
|
|
|
|
module.exports = String(test) === '[object z]';
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/uid.js":
|
|
/*!****************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/uid.js ***!
|
|
\****************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
var id = 0;
|
|
var postfix = Math.random();
|
|
|
|
module.exports = function (key) {
|
|
return 'Symbol(' + String(key === undefined ? '' : key) + ')_' + (++id + postfix).toString(36);
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/use-symbol-as-uid.js":
|
|
/*!******************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/use-symbol-as-uid.js ***!
|
|
\******************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var NATIVE_SYMBOL = __webpack_require__(/*! ../internals/native-symbol */ "./node_modules/core-js-pure/internals/native-symbol.js");
|
|
|
|
module.exports = NATIVE_SYMBOL
|
|
// eslint-disable-next-line no-undef
|
|
&& !Symbol.sham
|
|
// eslint-disable-next-line no-undef
|
|
&& typeof Symbol.iterator == 'symbol';
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/internals/well-known-symbol.js":
|
|
/*!******************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/internals/well-known-symbol.js ***!
|
|
\******************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
var global = __webpack_require__(/*! ../internals/global */ "./node_modules/core-js-pure/internals/global.js");
|
|
var shared = __webpack_require__(/*! ../internals/shared */ "./node_modules/core-js-pure/internals/shared.js");
|
|
var has = __webpack_require__(/*! ../internals/has */ "./node_modules/core-js-pure/internals/has.js");
|
|
var uid = __webpack_require__(/*! ../internals/uid */ "./node_modules/core-js-pure/internals/uid.js");
|
|
var NATIVE_SYMBOL = __webpack_require__(/*! ../internals/native-symbol */ "./node_modules/core-js-pure/internals/native-symbol.js");
|
|
var USE_SYMBOL_AS_UID = __webpack_require__(/*! ../internals/use-symbol-as-uid */ "./node_modules/core-js-pure/internals/use-symbol-as-uid.js");
|
|
|
|
var WellKnownSymbolsStore = shared('wks');
|
|
var Symbol = global.Symbol;
|
|
var createWellKnownSymbol = USE_SYMBOL_AS_UID ? Symbol : Symbol && Symbol.withoutSetter || uid;
|
|
|
|
module.exports = function (name) {
|
|
if (!has(WellKnownSymbolsStore, name)) {
|
|
if (NATIVE_SYMBOL && has(Symbol, name)) WellKnownSymbolsStore[name] = Symbol[name];
|
|
else WellKnownSymbolsStore[name] = createWellKnownSymbol('Symbol.' + name);
|
|
} return WellKnownSymbolsStore[name];
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/modules/es.array.iterator.js":
|
|
/*!****************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/modules/es.array.iterator.js ***!
|
|
\****************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
var toIndexedObject = __webpack_require__(/*! ../internals/to-indexed-object */ "./node_modules/core-js-pure/internals/to-indexed-object.js");
|
|
var addToUnscopables = __webpack_require__(/*! ../internals/add-to-unscopables */ "./node_modules/core-js-pure/internals/add-to-unscopables.js");
|
|
var Iterators = __webpack_require__(/*! ../internals/iterators */ "./node_modules/core-js-pure/internals/iterators.js");
|
|
var InternalStateModule = __webpack_require__(/*! ../internals/internal-state */ "./node_modules/core-js-pure/internals/internal-state.js");
|
|
var defineIterator = __webpack_require__(/*! ../internals/define-iterator */ "./node_modules/core-js-pure/internals/define-iterator.js");
|
|
|
|
var ARRAY_ITERATOR = 'Array Iterator';
|
|
var setInternalState = InternalStateModule.set;
|
|
var getInternalState = InternalStateModule.getterFor(ARRAY_ITERATOR);
|
|
|
|
// `Array.prototype.entries` method
|
|
// https://tc39.github.io/ecma262/#sec-array.prototype.entries
|
|
// `Array.prototype.keys` method
|
|
// https://tc39.github.io/ecma262/#sec-array.prototype.keys
|
|
// `Array.prototype.values` method
|
|
// https://tc39.github.io/ecma262/#sec-array.prototype.values
|
|
// `Array.prototype[@@iterator]` method
|
|
// https://tc39.github.io/ecma262/#sec-array.prototype-@@iterator
|
|
// `CreateArrayIterator` internal method
|
|
// https://tc39.github.io/ecma262/#sec-createarrayiterator
|
|
module.exports = defineIterator(Array, 'Array', function (iterated, kind) {
|
|
setInternalState(this, {
|
|
type: ARRAY_ITERATOR,
|
|
target: toIndexedObject(iterated), // target
|
|
index: 0, // next index
|
|
kind: kind // kind
|
|
});
|
|
// `%ArrayIteratorPrototype%.next` method
|
|
// https://tc39.github.io/ecma262/#sec-%arrayiteratorprototype%.next
|
|
}, function () {
|
|
var state = getInternalState(this);
|
|
var target = state.target;
|
|
var kind = state.kind;
|
|
var index = state.index++;
|
|
if (!target || index >= target.length) {
|
|
state.target = undefined;
|
|
return { value: undefined, done: true };
|
|
}
|
|
if (kind == 'keys') return { value: index, done: false };
|
|
if (kind == 'values') return { value: target[index], done: false };
|
|
return { value: [index, target[index]], done: false };
|
|
}, 'values');
|
|
|
|
// argumentsList[@@iterator] is %ArrayProto_values%
|
|
// https://tc39.github.io/ecma262/#sec-createunmappedargumentsobject
|
|
// https://tc39.github.io/ecma262/#sec-createmappedargumentsobject
|
|
Iterators.Arguments = Iterators.Array;
|
|
|
|
// https://tc39.github.io/ecma262/#sec-array.prototype-@@unscopables
|
|
addToUnscopables('keys');
|
|
addToUnscopables('values');
|
|
addToUnscopables('entries');
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/modules/es.object.to-string.js":
|
|
/*!******************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/modules/es.object.to-string.js ***!
|
|
\******************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
// empty
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/modules/es.promise.all-settled.js":
|
|
/*!*********************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/modules/es.promise.all-settled.js ***!
|
|
\*********************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
var $ = __webpack_require__(/*! ../internals/export */ "./node_modules/core-js-pure/internals/export.js");
|
|
var aFunction = __webpack_require__(/*! ../internals/a-function */ "./node_modules/core-js-pure/internals/a-function.js");
|
|
var newPromiseCapabilityModule = __webpack_require__(/*! ../internals/new-promise-capability */ "./node_modules/core-js-pure/internals/new-promise-capability.js");
|
|
var perform = __webpack_require__(/*! ../internals/perform */ "./node_modules/core-js-pure/internals/perform.js");
|
|
var iterate = __webpack_require__(/*! ../internals/iterate */ "./node_modules/core-js-pure/internals/iterate.js");
|
|
|
|
// `Promise.allSettled` method
|
|
// https://github.com/tc39/proposal-promise-allSettled
|
|
$({ target: 'Promise', stat: true }, {
|
|
allSettled: function allSettled(iterable) {
|
|
var C = this;
|
|
var capability = newPromiseCapabilityModule.f(C);
|
|
var resolve = capability.resolve;
|
|
var reject = capability.reject;
|
|
var result = perform(function () {
|
|
var promiseResolve = aFunction(C.resolve);
|
|
var values = [];
|
|
var counter = 0;
|
|
var remaining = 1;
|
|
iterate(iterable, function (promise) {
|
|
var index = counter++;
|
|
var alreadyCalled = false;
|
|
values.push(undefined);
|
|
remaining++;
|
|
promiseResolve.call(C, promise).then(function (value) {
|
|
if (alreadyCalled) return;
|
|
alreadyCalled = true;
|
|
values[index] = { status: 'fulfilled', value: value };
|
|
--remaining || resolve(values);
|
|
}, function (e) {
|
|
if (alreadyCalled) return;
|
|
alreadyCalled = true;
|
|
values[index] = { status: 'rejected', reason: e };
|
|
--remaining || resolve(values);
|
|
});
|
|
});
|
|
--remaining || resolve(values);
|
|
});
|
|
if (result.error) reject(result.value);
|
|
return capability.promise;
|
|
}
|
|
});
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/modules/es.promise.finally.js":
|
|
/*!*****************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/modules/es.promise.finally.js ***!
|
|
\*****************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
var $ = __webpack_require__(/*! ../internals/export */ "./node_modules/core-js-pure/internals/export.js");
|
|
var IS_PURE = __webpack_require__(/*! ../internals/is-pure */ "./node_modules/core-js-pure/internals/is-pure.js");
|
|
var NativePromise = __webpack_require__(/*! ../internals/native-promise-constructor */ "./node_modules/core-js-pure/internals/native-promise-constructor.js");
|
|
var fails = __webpack_require__(/*! ../internals/fails */ "./node_modules/core-js-pure/internals/fails.js");
|
|
var getBuiltIn = __webpack_require__(/*! ../internals/get-built-in */ "./node_modules/core-js-pure/internals/get-built-in.js");
|
|
var speciesConstructor = __webpack_require__(/*! ../internals/species-constructor */ "./node_modules/core-js-pure/internals/species-constructor.js");
|
|
var promiseResolve = __webpack_require__(/*! ../internals/promise-resolve */ "./node_modules/core-js-pure/internals/promise-resolve.js");
|
|
var redefine = __webpack_require__(/*! ../internals/redefine */ "./node_modules/core-js-pure/internals/redefine.js");
|
|
|
|
// Safari bug https://bugs.webkit.org/show_bug.cgi?id=200829
|
|
var NON_GENERIC = !!NativePromise && fails(function () {
|
|
NativePromise.prototype['finally'].call({ then: function () { /* empty */ } }, function () { /* empty */ });
|
|
});
|
|
|
|
// `Promise.prototype.finally` method
|
|
// https://tc39.github.io/ecma262/#sec-promise.prototype.finally
|
|
$({ target: 'Promise', proto: true, real: true, forced: NON_GENERIC }, {
|
|
'finally': function (onFinally) {
|
|
var C = speciesConstructor(this, getBuiltIn('Promise'));
|
|
var isFunction = typeof onFinally == 'function';
|
|
return this.then(
|
|
isFunction ? function (x) {
|
|
return promiseResolve(C, onFinally()).then(function () { return x; });
|
|
} : onFinally,
|
|
isFunction ? function (e) {
|
|
return promiseResolve(C, onFinally()).then(function () { throw e; });
|
|
} : onFinally
|
|
);
|
|
}
|
|
});
|
|
|
|
// patch native Promise.prototype for native async functions
|
|
if (!IS_PURE && typeof NativePromise == 'function' && !NativePromise.prototype['finally']) {
|
|
redefine(NativePromise.prototype, 'finally', getBuiltIn('Promise').prototype['finally']);
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/modules/es.promise.js":
|
|
/*!*********************************************************!*\
|
|
!*** ./node_modules/core-js-pure/modules/es.promise.js ***!
|
|
\*********************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
var $ = __webpack_require__(/*! ../internals/export */ "./node_modules/core-js-pure/internals/export.js");
|
|
var IS_PURE = __webpack_require__(/*! ../internals/is-pure */ "./node_modules/core-js-pure/internals/is-pure.js");
|
|
var global = __webpack_require__(/*! ../internals/global */ "./node_modules/core-js-pure/internals/global.js");
|
|
var getBuiltIn = __webpack_require__(/*! ../internals/get-built-in */ "./node_modules/core-js-pure/internals/get-built-in.js");
|
|
var NativePromise = __webpack_require__(/*! ../internals/native-promise-constructor */ "./node_modules/core-js-pure/internals/native-promise-constructor.js");
|
|
var redefine = __webpack_require__(/*! ../internals/redefine */ "./node_modules/core-js-pure/internals/redefine.js");
|
|
var redefineAll = __webpack_require__(/*! ../internals/redefine-all */ "./node_modules/core-js-pure/internals/redefine-all.js");
|
|
var setToStringTag = __webpack_require__(/*! ../internals/set-to-string-tag */ "./node_modules/core-js-pure/internals/set-to-string-tag.js");
|
|
var setSpecies = __webpack_require__(/*! ../internals/set-species */ "./node_modules/core-js-pure/internals/set-species.js");
|
|
var isObject = __webpack_require__(/*! ../internals/is-object */ "./node_modules/core-js-pure/internals/is-object.js");
|
|
var aFunction = __webpack_require__(/*! ../internals/a-function */ "./node_modules/core-js-pure/internals/a-function.js");
|
|
var anInstance = __webpack_require__(/*! ../internals/an-instance */ "./node_modules/core-js-pure/internals/an-instance.js");
|
|
var classof = __webpack_require__(/*! ../internals/classof-raw */ "./node_modules/core-js-pure/internals/classof-raw.js");
|
|
var inspectSource = __webpack_require__(/*! ../internals/inspect-source */ "./node_modules/core-js-pure/internals/inspect-source.js");
|
|
var iterate = __webpack_require__(/*! ../internals/iterate */ "./node_modules/core-js-pure/internals/iterate.js");
|
|
var checkCorrectnessOfIteration = __webpack_require__(/*! ../internals/check-correctness-of-iteration */ "./node_modules/core-js-pure/internals/check-correctness-of-iteration.js");
|
|
var speciesConstructor = __webpack_require__(/*! ../internals/species-constructor */ "./node_modules/core-js-pure/internals/species-constructor.js");
|
|
var task = __webpack_require__(/*! ../internals/task */ "./node_modules/core-js-pure/internals/task.js").set;
|
|
var microtask = __webpack_require__(/*! ../internals/microtask */ "./node_modules/core-js-pure/internals/microtask.js");
|
|
var promiseResolve = __webpack_require__(/*! ../internals/promise-resolve */ "./node_modules/core-js-pure/internals/promise-resolve.js");
|
|
var hostReportErrors = __webpack_require__(/*! ../internals/host-report-errors */ "./node_modules/core-js-pure/internals/host-report-errors.js");
|
|
var newPromiseCapabilityModule = __webpack_require__(/*! ../internals/new-promise-capability */ "./node_modules/core-js-pure/internals/new-promise-capability.js");
|
|
var perform = __webpack_require__(/*! ../internals/perform */ "./node_modules/core-js-pure/internals/perform.js");
|
|
var InternalStateModule = __webpack_require__(/*! ../internals/internal-state */ "./node_modules/core-js-pure/internals/internal-state.js");
|
|
var isForced = __webpack_require__(/*! ../internals/is-forced */ "./node_modules/core-js-pure/internals/is-forced.js");
|
|
var wellKnownSymbol = __webpack_require__(/*! ../internals/well-known-symbol */ "./node_modules/core-js-pure/internals/well-known-symbol.js");
|
|
var V8_VERSION = __webpack_require__(/*! ../internals/engine-v8-version */ "./node_modules/core-js-pure/internals/engine-v8-version.js");
|
|
|
|
var SPECIES = wellKnownSymbol('species');
|
|
var PROMISE = 'Promise';
|
|
var getInternalState = InternalStateModule.get;
|
|
var setInternalState = InternalStateModule.set;
|
|
var getInternalPromiseState = InternalStateModule.getterFor(PROMISE);
|
|
var PromiseConstructor = NativePromise;
|
|
var TypeError = global.TypeError;
|
|
var document = global.document;
|
|
var process = global.process;
|
|
var $fetch = getBuiltIn('fetch');
|
|
var newPromiseCapability = newPromiseCapabilityModule.f;
|
|
var newGenericPromiseCapability = newPromiseCapability;
|
|
var IS_NODE = classof(process) == 'process';
|
|
var DISPATCH_EVENT = !!(document && document.createEvent && global.dispatchEvent);
|
|
var UNHANDLED_REJECTION = 'unhandledrejection';
|
|
var REJECTION_HANDLED = 'rejectionhandled';
|
|
var PENDING = 0;
|
|
var FULFILLED = 1;
|
|
var REJECTED = 2;
|
|
var HANDLED = 1;
|
|
var UNHANDLED = 2;
|
|
var Internal, OwnPromiseCapability, PromiseWrapper, nativeThen;
|
|
|
|
var FORCED = isForced(PROMISE, function () {
|
|
var GLOBAL_CORE_JS_PROMISE = inspectSource(PromiseConstructor) !== String(PromiseConstructor);
|
|
if (!GLOBAL_CORE_JS_PROMISE) {
|
|
// V8 6.6 (Node 10 and Chrome 66) have a bug with resolving custom thenables
|
|
// https://bugs.chromium.org/p/chromium/issues/detail?id=830565
|
|
// We can't detect it synchronously, so just check versions
|
|
if (V8_VERSION === 66) return true;
|
|
// Unhandled rejections tracking support, NodeJS Promise without it fails @@species test
|
|
if (!IS_NODE && typeof PromiseRejectionEvent != 'function') return true;
|
|
}
|
|
// We need Promise#finally in the pure version for preventing prototype pollution
|
|
if (IS_PURE && !PromiseConstructor.prototype['finally']) return true;
|
|
// We can't use @@species feature detection in V8 since it causes
|
|
// deoptimization and performance degradation
|
|
// https://github.com/zloirock/core-js/issues/679
|
|
if (V8_VERSION >= 51 && /native code/.test(PromiseConstructor)) return false;
|
|
// Detect correctness of subclassing with @@species support
|
|
var promise = PromiseConstructor.resolve(1);
|
|
var FakePromise = function (exec) {
|
|
exec(function () { /* empty */ }, function () { /* empty */ });
|
|
};
|
|
var constructor = promise.constructor = {};
|
|
constructor[SPECIES] = FakePromise;
|
|
return !(promise.then(function () { /* empty */ }) instanceof FakePromise);
|
|
});
|
|
|
|
var INCORRECT_ITERATION = FORCED || !checkCorrectnessOfIteration(function (iterable) {
|
|
PromiseConstructor.all(iterable)['catch'](function () { /* empty */ });
|
|
});
|
|
|
|
// helpers
|
|
var isThenable = function (it) {
|
|
var then;
|
|
return isObject(it) && typeof (then = it.then) == 'function' ? then : false;
|
|
};
|
|
|
|
var notify = function (promise, state, isReject) {
|
|
if (state.notified) return;
|
|
state.notified = true;
|
|
var chain = state.reactions;
|
|
microtask(function () {
|
|
var value = state.value;
|
|
var ok = state.state == FULFILLED;
|
|
var index = 0;
|
|
// variable length - can't use forEach
|
|
while (chain.length > index) {
|
|
var reaction = chain[index++];
|
|
var handler = ok ? reaction.ok : reaction.fail;
|
|
var resolve = reaction.resolve;
|
|
var reject = reaction.reject;
|
|
var domain = reaction.domain;
|
|
var result, then, exited;
|
|
try {
|
|
if (handler) {
|
|
if (!ok) {
|
|
if (state.rejection === UNHANDLED) onHandleUnhandled(promise, state);
|
|
state.rejection = HANDLED;
|
|
}
|
|
if (handler === true) result = value;
|
|
else {
|
|
if (domain) domain.enter();
|
|
result = handler(value); // can throw
|
|
if (domain) {
|
|
domain.exit();
|
|
exited = true;
|
|
}
|
|
}
|
|
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 (error) {
|
|
if (domain && !exited) domain.exit();
|
|
reject(error);
|
|
}
|
|
}
|
|
state.reactions = [];
|
|
state.notified = false;
|
|
if (isReject && !state.rejection) onUnhandled(promise, state);
|
|
});
|
|
};
|
|
|
|
var dispatchEvent = function (name, promise, reason) {
|
|
var event, handler;
|
|
if (DISPATCH_EVENT) {
|
|
event = document.createEvent('Event');
|
|
event.promise = promise;
|
|
event.reason = reason;
|
|
event.initEvent(name, false, true);
|
|
global.dispatchEvent(event);
|
|
} else event = { promise: promise, reason: reason };
|
|
if (handler = global['on' + name]) handler(event);
|
|
else if (name === UNHANDLED_REJECTION) hostReportErrors('Unhandled promise rejection', reason);
|
|
};
|
|
|
|
var onUnhandled = function (promise, state) {
|
|
task.call(global, function () {
|
|
var value = state.value;
|
|
var IS_UNHANDLED = isUnhandled(state);
|
|
var result;
|
|
if (IS_UNHANDLED) {
|
|
result = perform(function () {
|
|
if (IS_NODE) {
|
|
process.emit('unhandledRejection', value, promise);
|
|
} else dispatchEvent(UNHANDLED_REJECTION, promise, value);
|
|
});
|
|
// Browsers should not trigger `rejectionHandled` event if it was handled here, NodeJS - should
|
|
state.rejection = IS_NODE || isUnhandled(state) ? UNHANDLED : HANDLED;
|
|
if (result.error) throw result.value;
|
|
}
|
|
});
|
|
};
|
|
|
|
var isUnhandled = function (state) {
|
|
return state.rejection !== HANDLED && !state.parent;
|
|
};
|
|
|
|
var onHandleUnhandled = function (promise, state) {
|
|
task.call(global, function () {
|
|
if (IS_NODE) {
|
|
process.emit('rejectionHandled', promise);
|
|
} else dispatchEvent(REJECTION_HANDLED, promise, state.value);
|
|
});
|
|
};
|
|
|
|
var bind = function (fn, promise, state, unwrap) {
|
|
return function (value) {
|
|
fn(promise, state, value, unwrap);
|
|
};
|
|
};
|
|
|
|
var internalReject = function (promise, state, value, unwrap) {
|
|
if (state.done) return;
|
|
state.done = true;
|
|
if (unwrap) state = unwrap;
|
|
state.value = value;
|
|
state.state = REJECTED;
|
|
notify(promise, state, true);
|
|
};
|
|
|
|
var internalResolve = function (promise, state, value, unwrap) {
|
|
if (state.done) return;
|
|
state.done = true;
|
|
if (unwrap) state = unwrap;
|
|
try {
|
|
if (promise === value) throw TypeError("Promise can't be resolved itself");
|
|
var then = isThenable(value);
|
|
if (then) {
|
|
microtask(function () {
|
|
var wrapper = { done: false };
|
|
try {
|
|
then.call(value,
|
|
bind(internalResolve, promise, wrapper, state),
|
|
bind(internalReject, promise, wrapper, state)
|
|
);
|
|
} catch (error) {
|
|
internalReject(promise, wrapper, error, state);
|
|
}
|
|
});
|
|
} else {
|
|
state.value = value;
|
|
state.state = FULFILLED;
|
|
notify(promise, state, false);
|
|
}
|
|
} catch (error) {
|
|
internalReject(promise, { done: false }, error, state);
|
|
}
|
|
};
|
|
|
|
// constructor polyfill
|
|
if (FORCED) {
|
|
// 25.4.3.1 Promise(executor)
|
|
PromiseConstructor = function Promise(executor) {
|
|
anInstance(this, PromiseConstructor, PROMISE);
|
|
aFunction(executor);
|
|
Internal.call(this);
|
|
var state = getInternalState(this);
|
|
try {
|
|
executor(bind(internalResolve, this, state), bind(internalReject, this, state));
|
|
} catch (error) {
|
|
internalReject(this, state, error);
|
|
}
|
|
};
|
|
// eslint-disable-next-line no-unused-vars
|
|
Internal = function Promise(executor) {
|
|
setInternalState(this, {
|
|
type: PROMISE,
|
|
done: false,
|
|
notified: false,
|
|
parent: false,
|
|
reactions: [],
|
|
rejection: false,
|
|
state: PENDING,
|
|
value: undefined
|
|
});
|
|
};
|
|
Internal.prototype = redefineAll(PromiseConstructor.prototype, {
|
|
// `Promise.prototype.then` method
|
|
// https://tc39.github.io/ecma262/#sec-promise.prototype.then
|
|
then: function then(onFulfilled, onRejected) {
|
|
var state = getInternalPromiseState(this);
|
|
var reaction = newPromiseCapability(speciesConstructor(this, PromiseConstructor));
|
|
reaction.ok = typeof onFulfilled == 'function' ? onFulfilled : true;
|
|
reaction.fail = typeof onRejected == 'function' && onRejected;
|
|
reaction.domain = IS_NODE ? process.domain : undefined;
|
|
state.parent = true;
|
|
state.reactions.push(reaction);
|
|
if (state.state != PENDING) notify(this, state, false);
|
|
return reaction.promise;
|
|
},
|
|
// `Promise.prototype.catch` method
|
|
// https://tc39.github.io/ecma262/#sec-promise.prototype.catch
|
|
'catch': function (onRejected) {
|
|
return this.then(undefined, onRejected);
|
|
}
|
|
});
|
|
OwnPromiseCapability = function () {
|
|
var promise = new Internal();
|
|
var state = getInternalState(promise);
|
|
this.promise = promise;
|
|
this.resolve = bind(internalResolve, promise, state);
|
|
this.reject = bind(internalReject, promise, state);
|
|
};
|
|
newPromiseCapabilityModule.f = newPromiseCapability = function (C) {
|
|
return C === PromiseConstructor || C === PromiseWrapper
|
|
? new OwnPromiseCapability(C)
|
|
: newGenericPromiseCapability(C);
|
|
};
|
|
|
|
if (!IS_PURE && typeof NativePromise == 'function') {
|
|
nativeThen = NativePromise.prototype.then;
|
|
|
|
// wrap native Promise#then for native async functions
|
|
redefine(NativePromise.prototype, 'then', function then(onFulfilled, onRejected) {
|
|
var that = this;
|
|
return new PromiseConstructor(function (resolve, reject) {
|
|
nativeThen.call(that, resolve, reject);
|
|
}).then(onFulfilled, onRejected);
|
|
// https://github.com/zloirock/core-js/issues/640
|
|
}, { unsafe: true });
|
|
|
|
// wrap fetch result
|
|
if (typeof $fetch == 'function') $({ global: true, enumerable: true, forced: true }, {
|
|
// eslint-disable-next-line no-unused-vars
|
|
fetch: function fetch(input /* , init */) {
|
|
return promiseResolve(PromiseConstructor, $fetch.apply(global, arguments));
|
|
}
|
|
});
|
|
}
|
|
}
|
|
|
|
$({ global: true, wrap: true, forced: FORCED }, {
|
|
Promise: PromiseConstructor
|
|
});
|
|
|
|
setToStringTag(PromiseConstructor, PROMISE, false, true);
|
|
setSpecies(PROMISE);
|
|
|
|
PromiseWrapper = getBuiltIn(PROMISE);
|
|
|
|
// statics
|
|
$({ target: PROMISE, stat: true, forced: FORCED }, {
|
|
// `Promise.reject` method
|
|
// https://tc39.github.io/ecma262/#sec-promise.reject
|
|
reject: function reject(r) {
|
|
var capability = newPromiseCapability(this);
|
|
capability.reject.call(undefined, r);
|
|
return capability.promise;
|
|
}
|
|
});
|
|
|
|
$({ target: PROMISE, stat: true, forced: IS_PURE || FORCED }, {
|
|
// `Promise.resolve` method
|
|
// https://tc39.github.io/ecma262/#sec-promise.resolve
|
|
resolve: function resolve(x) {
|
|
return promiseResolve(IS_PURE && this === PromiseWrapper ? PromiseConstructor : this, x);
|
|
}
|
|
});
|
|
|
|
$({ target: PROMISE, stat: true, forced: INCORRECT_ITERATION }, {
|
|
// `Promise.all` method
|
|
// https://tc39.github.io/ecma262/#sec-promise.all
|
|
all: function all(iterable) {
|
|
var C = this;
|
|
var capability = newPromiseCapability(C);
|
|
var resolve = capability.resolve;
|
|
var reject = capability.reject;
|
|
var result = perform(function () {
|
|
var $promiseResolve = aFunction(C.resolve);
|
|
var values = [];
|
|
var counter = 0;
|
|
var remaining = 1;
|
|
iterate(iterable, function (promise) {
|
|
var index = counter++;
|
|
var alreadyCalled = false;
|
|
values.push(undefined);
|
|
remaining++;
|
|
$promiseResolve.call(C, promise).then(function (value) {
|
|
if (alreadyCalled) return;
|
|
alreadyCalled = true;
|
|
values[index] = value;
|
|
--remaining || resolve(values);
|
|
}, reject);
|
|
});
|
|
--remaining || resolve(values);
|
|
});
|
|
if (result.error) reject(result.value);
|
|
return capability.promise;
|
|
},
|
|
// `Promise.race` method
|
|
// https://tc39.github.io/ecma262/#sec-promise.race
|
|
race: function race(iterable) {
|
|
var C = this;
|
|
var capability = newPromiseCapability(C);
|
|
var reject = capability.reject;
|
|
var result = perform(function () {
|
|
var $promiseResolve = aFunction(C.resolve);
|
|
iterate(iterable, function (promise) {
|
|
$promiseResolve.call(C, promise).then(capability.resolve, reject);
|
|
});
|
|
});
|
|
if (result.error) reject(result.value);
|
|
return capability.promise;
|
|
}
|
|
});
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/modules/es.string.iterator.js":
|
|
/*!*****************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/modules/es.string.iterator.js ***!
|
|
\*****************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
var charAt = __webpack_require__(/*! ../internals/string-multibyte */ "./node_modules/core-js-pure/internals/string-multibyte.js").charAt;
|
|
var InternalStateModule = __webpack_require__(/*! ../internals/internal-state */ "./node_modules/core-js-pure/internals/internal-state.js");
|
|
var defineIterator = __webpack_require__(/*! ../internals/define-iterator */ "./node_modules/core-js-pure/internals/define-iterator.js");
|
|
|
|
var STRING_ITERATOR = 'String Iterator';
|
|
var setInternalState = InternalStateModule.set;
|
|
var getInternalState = InternalStateModule.getterFor(STRING_ITERATOR);
|
|
|
|
// `String.prototype[@@iterator]` method
|
|
// https://tc39.github.io/ecma262/#sec-string.prototype-@@iterator
|
|
defineIterator(String, 'String', function (iterated) {
|
|
setInternalState(this, {
|
|
type: STRING_ITERATOR,
|
|
string: String(iterated),
|
|
index: 0
|
|
});
|
|
// `%StringIteratorPrototype%.next` method
|
|
// https://tc39.github.io/ecma262/#sec-%stringiteratorprototype%.next
|
|
}, function next() {
|
|
var state = getInternalState(this);
|
|
var string = state.string;
|
|
var index = state.index;
|
|
var point;
|
|
if (index >= string.length) return { value: undefined, done: true };
|
|
point = charAt(string, index);
|
|
state.index += point.length;
|
|
return { value: point, done: false };
|
|
});
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/modules/esnext.aggregate-error.js":
|
|
/*!*********************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/modules/esnext.aggregate-error.js ***!
|
|
\*********************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
var $ = __webpack_require__(/*! ../internals/export */ "./node_modules/core-js-pure/internals/export.js");
|
|
var DESCRIPTORS = __webpack_require__(/*! ../internals/descriptors */ "./node_modules/core-js-pure/internals/descriptors.js");
|
|
var getPrototypeOf = __webpack_require__(/*! ../internals/object-get-prototype-of */ "./node_modules/core-js-pure/internals/object-get-prototype-of.js");
|
|
var setPrototypeOf = __webpack_require__(/*! ../internals/object-set-prototype-of */ "./node_modules/core-js-pure/internals/object-set-prototype-of.js");
|
|
var create = __webpack_require__(/*! ../internals/object-create */ "./node_modules/core-js-pure/internals/object-create.js");
|
|
var defineProperty = __webpack_require__(/*! ../internals/object-define-property */ "./node_modules/core-js-pure/internals/object-define-property.js");
|
|
var createPropertyDescriptor = __webpack_require__(/*! ../internals/create-property-descriptor */ "./node_modules/core-js-pure/internals/create-property-descriptor.js");
|
|
var iterate = __webpack_require__(/*! ../internals/iterate */ "./node_modules/core-js-pure/internals/iterate.js");
|
|
var createNonEnumerableProperty = __webpack_require__(/*! ../internals/create-non-enumerable-property */ "./node_modules/core-js-pure/internals/create-non-enumerable-property.js");
|
|
var InternalStateModule = __webpack_require__(/*! ../internals/internal-state */ "./node_modules/core-js-pure/internals/internal-state.js");
|
|
|
|
var setInternalState = InternalStateModule.set;
|
|
var getInternalAggregateErrorState = InternalStateModule.getterFor('AggregateError');
|
|
|
|
var $AggregateError = function AggregateError(errors, message) {
|
|
var that = this;
|
|
if (!(that instanceof $AggregateError)) return new $AggregateError(errors, message);
|
|
if (setPrototypeOf) {
|
|
that = setPrototypeOf(new Error(message), getPrototypeOf(that));
|
|
}
|
|
var errorsArray = [];
|
|
iterate(errors, errorsArray.push, errorsArray);
|
|
if (DESCRIPTORS) setInternalState(that, { errors: errorsArray, type: 'AggregateError' });
|
|
else that.errors = errorsArray;
|
|
if (message !== undefined) createNonEnumerableProperty(that, 'message', String(message));
|
|
return that;
|
|
};
|
|
|
|
$AggregateError.prototype = create(Error.prototype, {
|
|
constructor: createPropertyDescriptor(5, $AggregateError),
|
|
message: createPropertyDescriptor(5, ''),
|
|
name: createPropertyDescriptor(5, 'AggregateError')
|
|
});
|
|
|
|
if (DESCRIPTORS) defineProperty.f($AggregateError.prototype, 'errors', {
|
|
get: function () {
|
|
return getInternalAggregateErrorState(this).errors;
|
|
},
|
|
configurable: true
|
|
});
|
|
|
|
$({ global: true }, {
|
|
AggregateError: $AggregateError
|
|
});
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/modules/esnext.promise.all-settled.js":
|
|
/*!*************************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/modules/esnext.promise.all-settled.js ***!
|
|
\*************************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
// TODO: Remove from `core-js@4`
|
|
__webpack_require__(/*! ./es.promise.all-settled.js */ "./node_modules/core-js-pure/modules/es.promise.all-settled.js");
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/modules/esnext.promise.any.js":
|
|
/*!*****************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/modules/esnext.promise.any.js ***!
|
|
\*****************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
var $ = __webpack_require__(/*! ../internals/export */ "./node_modules/core-js-pure/internals/export.js");
|
|
var aFunction = __webpack_require__(/*! ../internals/a-function */ "./node_modules/core-js-pure/internals/a-function.js");
|
|
var getBuiltIn = __webpack_require__(/*! ../internals/get-built-in */ "./node_modules/core-js-pure/internals/get-built-in.js");
|
|
var newPromiseCapabilityModule = __webpack_require__(/*! ../internals/new-promise-capability */ "./node_modules/core-js-pure/internals/new-promise-capability.js");
|
|
var perform = __webpack_require__(/*! ../internals/perform */ "./node_modules/core-js-pure/internals/perform.js");
|
|
var iterate = __webpack_require__(/*! ../internals/iterate */ "./node_modules/core-js-pure/internals/iterate.js");
|
|
|
|
var PROMISE_ANY_ERROR = 'No one promise resolved';
|
|
|
|
// `Promise.any` method
|
|
// https://github.com/tc39/proposal-promise-any
|
|
$({ target: 'Promise', stat: true }, {
|
|
any: function any(iterable) {
|
|
var C = this;
|
|
var capability = newPromiseCapabilityModule.f(C);
|
|
var resolve = capability.resolve;
|
|
var reject = capability.reject;
|
|
var result = perform(function () {
|
|
var promiseResolve = aFunction(C.resolve);
|
|
var errors = [];
|
|
var counter = 0;
|
|
var remaining = 1;
|
|
var alreadyResolved = false;
|
|
iterate(iterable, function (promise) {
|
|
var index = counter++;
|
|
var alreadyRejected = false;
|
|
errors.push(undefined);
|
|
remaining++;
|
|
promiseResolve.call(C, promise).then(function (value) {
|
|
if (alreadyRejected || alreadyResolved) return;
|
|
alreadyResolved = true;
|
|
resolve(value);
|
|
}, function (e) {
|
|
if (alreadyRejected || alreadyResolved) return;
|
|
alreadyRejected = true;
|
|
errors[index] = e;
|
|
--remaining || reject(new (getBuiltIn('AggregateError'))(errors, PROMISE_ANY_ERROR));
|
|
});
|
|
});
|
|
--remaining || reject(new (getBuiltIn('AggregateError'))(errors, PROMISE_ANY_ERROR));
|
|
});
|
|
if (result.error) reject(result.value);
|
|
return capability.promise;
|
|
}
|
|
});
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/modules/esnext.promise.try.js":
|
|
/*!*****************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/modules/esnext.promise.try.js ***!
|
|
\*****************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
var $ = __webpack_require__(/*! ../internals/export */ "./node_modules/core-js-pure/internals/export.js");
|
|
var newPromiseCapabilityModule = __webpack_require__(/*! ../internals/new-promise-capability */ "./node_modules/core-js-pure/internals/new-promise-capability.js");
|
|
var perform = __webpack_require__(/*! ../internals/perform */ "./node_modules/core-js-pure/internals/perform.js");
|
|
|
|
// `Promise.try` method
|
|
// https://github.com/tc39/proposal-promise-try
|
|
$({ target: 'Promise', stat: true }, {
|
|
'try': function (callbackfn) {
|
|
var promiseCapability = newPromiseCapabilityModule.f(this);
|
|
var result = perform(callbackfn);
|
|
(result.error ? promiseCapability.reject : promiseCapability.resolve)(result.value);
|
|
return promiseCapability.promise;
|
|
}
|
|
});
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/core-js-pure/modules/web.dom-collections.iterator.js":
|
|
/*!***************************************************************************!*\
|
|
!*** ./node_modules/core-js-pure/modules/web.dom-collections.iterator.js ***!
|
|
\***************************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
__webpack_require__(/*! ./es.array.iterator */ "./node_modules/core-js-pure/modules/es.array.iterator.js");
|
|
var DOMIterables = __webpack_require__(/*! ../internals/dom-iterables */ "./node_modules/core-js-pure/internals/dom-iterables.js");
|
|
var global = __webpack_require__(/*! ../internals/global */ "./node_modules/core-js-pure/internals/global.js");
|
|
var classof = __webpack_require__(/*! ../internals/classof */ "./node_modules/core-js-pure/internals/classof.js");
|
|
var createNonEnumerableProperty = __webpack_require__(/*! ../internals/create-non-enumerable-property */ "./node_modules/core-js-pure/internals/create-non-enumerable-property.js");
|
|
var Iterators = __webpack_require__(/*! ../internals/iterators */ "./node_modules/core-js-pure/internals/iterators.js");
|
|
var wellKnownSymbol = __webpack_require__(/*! ../internals/well-known-symbol */ "./node_modules/core-js-pure/internals/well-known-symbol.js");
|
|
|
|
var TO_STRING_TAG = wellKnownSymbol('toStringTag');
|
|
|
|
for (var COLLECTION_NAME in DOMIterables) {
|
|
var Collection = global[COLLECTION_NAME];
|
|
var CollectionPrototype = Collection && Collection.prototype;
|
|
if (CollectionPrototype && classof(CollectionPrototype) !== TO_STRING_TAG) {
|
|
createNonEnumerableProperty(CollectionPrototype, TO_STRING_TAG, COLLECTION_NAME);
|
|
}
|
|
Iterators[COLLECTION_NAME] = Iterators.Array;
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./node_modules/webpack/buildin/global.js":
|
|
/*!***********************************!*\
|
|
!*** (webpack)/buildin/global.js ***!
|
|
\***********************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
var g;
|
|
|
|
// This works in non-strict mode
|
|
g = (function() {
|
|
return this;
|
|
})();
|
|
|
|
try {
|
|
// This works if eval is allowed (see CSP)
|
|
g = g || new Function("return this")();
|
|
} catch (e) {
|
|
// This works if the window reference is available
|
|
if (typeof window === "object") g = window;
|
|
}
|
|
|
|
// g can still be undefined, but nothing to do about it...
|
|
// We return undefined, instead of nothing here, so it's
|
|
// easier to handle this case. if(!global) { ...}
|
|
|
|
module.exports = g;
|
|
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/css/index.styl":
|
|
/*!****************************!*\
|
|
!*** ./src/css/index.styl ***!
|
|
\****************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
// extracted by mini-css-extract-plugin
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/index.js":
|
|
/*!**********************!*\
|
|
!*** ./src/index.js ***!
|
|
\**********************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
__webpack_require__(/*! @/polyfill */ "./src/js/polyfill.js");
|
|
|
|
var _imageEditor = __webpack_require__(/*! @/imageEditor */ "./src/js/imageEditor.js");
|
|
|
|
var _imageEditor2 = _interopRequireDefault(_imageEditor);
|
|
|
|
__webpack_require__(/*! @css/index.styl */ "./src/css/index.styl");
|
|
|
|
__webpack_require__(/*! @/command/addIcon */ "./src/js/command/addIcon.js");
|
|
|
|
__webpack_require__(/*! @/command/addImageObject */ "./src/js/command/addImageObject.js");
|
|
|
|
__webpack_require__(/*! @/command/addObject */ "./src/js/command/addObject.js");
|
|
|
|
__webpack_require__(/*! @/command/addShape */ "./src/js/command/addShape.js");
|
|
|
|
__webpack_require__(/*! @/command/addText */ "./src/js/command/addText.js");
|
|
|
|
__webpack_require__(/*! @/command/applyFilter */ "./src/js/command/applyFilter.js");
|
|
|
|
__webpack_require__(/*! @/command/changeIconColor */ "./src/js/command/changeIconColor.js");
|
|
|
|
__webpack_require__(/*! @/command/changeShape */ "./src/js/command/changeShape.js");
|
|
|
|
__webpack_require__(/*! @/command/changeText */ "./src/js/command/changeText.js");
|
|
|
|
__webpack_require__(/*! @/command/changeTextStyle */ "./src/js/command/changeTextStyle.js");
|
|
|
|
__webpack_require__(/*! @/command/clearObjects */ "./src/js/command/clearObjects.js");
|
|
|
|
__webpack_require__(/*! @/command/flip */ "./src/js/command/flip.js");
|
|
|
|
__webpack_require__(/*! @/command/loadImage */ "./src/js/command/loadImage.js");
|
|
|
|
__webpack_require__(/*! @/command/removeFilter */ "./src/js/command/removeFilter.js");
|
|
|
|
__webpack_require__(/*! @/command/removeObject */ "./src/js/command/removeObject.js");
|
|
|
|
__webpack_require__(/*! @/command/resizeCanvasDimension */ "./src/js/command/resizeCanvasDimension.js");
|
|
|
|
__webpack_require__(/*! @/command/rotate */ "./src/js/command/rotate.js");
|
|
|
|
__webpack_require__(/*! @/command/setObjectProperties */ "./src/js/command/setObjectProperties.js");
|
|
|
|
__webpack_require__(/*! @/command/setObjectPosition */ "./src/js/command/setObjectPosition.js");
|
|
|
|
__webpack_require__(/*! @/command/changeSelection */ "./src/js/command/changeSelection.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
// commands
|
|
module.exports = _imageEditor2.default;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/action.js":
|
|
/*!**************************!*\
|
|
!*** ./src/js/action.js ***!
|
|
\**************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _tuiCodeSnippet = __webpack_require__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _imagetracer = __webpack_require__(/*! @/helper/imagetracer */ "./src/js/helper/imagetracer.js");
|
|
|
|
var _imagetracer2 = _interopRequireDefault(_imagetracer);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
exports.default = {
|
|
/**
|
|
* 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(),
|
|
history: this._historyAction()
|
|
};
|
|
},
|
|
|
|
|
|
/**
|
|
* Main Action
|
|
* @returns {Object} actions for ui main
|
|
* @private
|
|
*/
|
|
_mainAction: function _mainAction() {
|
|
var _this = this;
|
|
|
|
var exitCropOnAction = function exitCropOnAction() {
|
|
if (_this.ui.submenu === 'crop') {
|
|
_this.stopDrawingMode();
|
|
_this.ui.changeMenu('crop');
|
|
}
|
|
};
|
|
var setAngleRangeBarOnAction = function setAngleRangeBarOnAction(angle) {
|
|
if (_this.ui.submenu === 'rotate') {
|
|
_this.ui.rotate.setRangeBarAngle('setAngle', angle);
|
|
}
|
|
};
|
|
var setFilterStateRangeBarOnAction = function setFilterStateRangeBarOnAction(filterOptions) {
|
|
if (_this.ui.submenu === 'filter') {
|
|
_this.ui.filter.setFilterState(filterOptions);
|
|
}
|
|
};
|
|
var onEndUndoRedo = function onEndUndoRedo(result) {
|
|
setAngleRangeBarOnAction(result);
|
|
setFilterStateRangeBarOnAction(result);
|
|
|
|
return result;
|
|
};
|
|
var toggleZoomMode = function toggleZoomMode() {
|
|
var zoomMode = _this._graphics.getZoomMode();
|
|
|
|
_this.stopDrawingMode();
|
|
if (zoomMode !== _consts.zoomModes.ZOOM) {
|
|
_this.startDrawingMode(_consts.drawingModes.ZOOM);
|
|
_this._graphics.startZoomInMode();
|
|
} else {
|
|
_this._graphics.endZoomInMode();
|
|
}
|
|
};
|
|
var toggleHandMode = function toggleHandMode() {
|
|
var zoomMode = _this._graphics.getZoomMode();
|
|
|
|
_this.stopDrawingMode();
|
|
if (zoomMode !== _consts.zoomModes.HAND) {
|
|
_this.startDrawingMode(_consts.drawingModes.ZOOM);
|
|
_this._graphics.startHandMode();
|
|
} else {
|
|
_this._graphics.endHandMode();
|
|
}
|
|
};
|
|
|
|
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();
|
|
_this._invoker.fire(_consts.eventNames.EXECUTE_COMMAND, _consts.historyNames.LOAD_IMAGE);
|
|
});
|
|
},
|
|
undo: function undo() {
|
|
if (!_this.isEmptyUndoStack()) {
|
|
exitCropOnAction();
|
|
_this.deactivateAll();
|
|
_this.undo().then(onEndUndoRedo);
|
|
}
|
|
},
|
|
redo: function redo() {
|
|
if (!_this.isEmptyRedoStack()) {
|
|
exitCropOnAction();
|
|
_this.deactivateAll();
|
|
_this.redo().then(onEndUndoRedo);
|
|
}
|
|
},
|
|
reset: function reset() {
|
|
exitCropOnAction();
|
|
_this.loadImageFromURL(_this.ui.initializeImgUrl, 'resetImage').then(function (sizeValue) {
|
|
exitCropOnAction();
|
|
_this.ui.resizeEditor({ imageSize: sizeValue });
|
|
_this.clearUndoStack();
|
|
_this._initHistory();
|
|
});
|
|
},
|
|
delete: function _delete() {
|
|
_this.ui.changeHelpButtonEnabled('delete', false);
|
|
exitCropOnAction();
|
|
_this.removeActiveObject();
|
|
_this.activeObjectId = null;
|
|
},
|
|
deleteAll: function deleteAll() {
|
|
exitCropOnAction();
|
|
_this.clearObjects();
|
|
_this.ui.changeHelpButtonEnabled('delete', false);
|
|
_this.ui.changeHelpButtonEnabled('deleteAll', false);
|
|
},
|
|
load: function load(file) {
|
|
if (!(0, _util.isSupportFileApi)()) {
|
|
alert('This browser does not support file-api');
|
|
}
|
|
|
|
_this.ui.initializeImgUrl = URL.createObjectURL(file);
|
|
_this.loadImageFromFile(file).then(function (sizeValue) {
|
|
exitCropOnAction();
|
|
_this.clearUndoStack();
|
|
_this.ui.activeMenuEvent();
|
|
_this.ui.resizeEditor({ imageSize: sizeValue });
|
|
_this._clearHistory();
|
|
_this._invoker.fire(_consts.eventNames.EXECUTE_COMMAND, _consts.historyNames.LOAD_IMAGE);
|
|
})['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 ((0, _util.isSupportFileApi)() && window.saveAs) {
|
|
blob = (0, _util.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 = '<img src=\'' + dataURL + '\'>';
|
|
}
|
|
},
|
|
history: function history(event) {
|
|
_this.ui.toggleHistoryMenu(event);
|
|
},
|
|
zoomIn: function zoomIn() {
|
|
_this.ui.toggleZoomButtonStatus('zoomIn');
|
|
_this.deactivateAll();
|
|
toggleZoomMode();
|
|
},
|
|
zoomOut: function zoomOut() {
|
|
_this._graphics.zoomOut();
|
|
},
|
|
hand: function hand() {
|
|
_this.ui.offZoomInButtonStatus();
|
|
_this.ui.toggleZoomButtonStatus('hand');
|
|
_this.deactivateAll();
|
|
toggleHandMode();
|
|
}
|
|
}, this._commonAction());
|
|
},
|
|
|
|
|
|
/**
|
|
* Icon Action
|
|
* @returns {Object} actions for ui icon
|
|
* @private
|
|
*/
|
|
_iconAction: function _iconAction() {
|
|
var _this2 = this;
|
|
|
|
return (0, _tuiCodeSnippet.extend)({
|
|
changeColor: function changeColor(color) {
|
|
if (_this2.activeObjectId) {
|
|
_this2.changeIconColor(_this2.activeObjectId, color);
|
|
}
|
|
},
|
|
addIcon: function addIcon(iconType, iconColor) {
|
|
_this2.startDrawingMode('ICON');
|
|
_this2.setDrawingIcon(iconType, iconColor);
|
|
},
|
|
cancelAddIcon: function cancelAddIcon() {
|
|
_this2.ui.icon.clearIconType();
|
|
_this2.changeSelectableAll(true);
|
|
_this2.changeCursor('default');
|
|
_this2.stopDrawingMode();
|
|
},
|
|
registerDefaultIcons: function registerDefaultIcons(type, path) {
|
|
var iconObj = {};
|
|
iconObj[type] = path;
|
|
_this2.registerIcons(iconObj);
|
|
},
|
|
registerCustomIcon: function registerCustomIcon(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());
|
|
},
|
|
|
|
|
|
/**
|
|
* Draw Action
|
|
* @returns {Object} actions for ui draw
|
|
* @private
|
|
*/
|
|
_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());
|
|
},
|
|
|
|
|
|
/**
|
|
* Mask Action
|
|
* @returns {Object} actions for ui mask
|
|
* @private
|
|
*/
|
|
_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);
|
|
});
|
|
_this4._invoker.fire(_consts.eventNames.EXECUTE_COMMAND, _consts.historyNames.LOAD_MASK_IMAGE);
|
|
});
|
|
},
|
|
applyFilter: function applyFilter() {
|
|
_this4.applyFilter('mask', {
|
|
maskObjId: _this4.activeObjectId
|
|
});
|
|
}
|
|
}, this._commonAction());
|
|
},
|
|
|
|
|
|
/**
|
|
* Text Action
|
|
* @returns {Object} actions for ui text
|
|
* @private
|
|
*/
|
|
_textAction: function _textAction() {
|
|
var _this5 = this;
|
|
|
|
return (0, _tuiCodeSnippet.extend)({
|
|
changeTextStyle: function changeTextStyle(styleObj, isSilent) {
|
|
if (_this5.activeObjectId) {
|
|
_this5.changeTextStyle(_this5.activeObjectId, styleObj, isSilent);
|
|
}
|
|
}
|
|
}, this._commonAction());
|
|
},
|
|
|
|
|
|
/**
|
|
* Rotate Action
|
|
* @returns {Object} actions for ui rotate
|
|
* @private
|
|
*/
|
|
_rotateAction: function _rotateAction() {
|
|
var _this6 = this;
|
|
|
|
return (0, _tuiCodeSnippet.extend)({
|
|
rotate: function rotate(angle, isSilent) {
|
|
_this6.rotate(angle, isSilent);
|
|
_this6.ui.resizeEditor();
|
|
_this6.ui.rotate.setRangeBarAngle('rotate', angle);
|
|
},
|
|
setAngle: function setAngle(angle, isSilent) {
|
|
_this6.setAngle(angle, isSilent);
|
|
_this6.ui.resizeEditor();
|
|
_this6.ui.rotate.setRangeBarAngle('setAngle', angle);
|
|
}
|
|
}, this._commonAction());
|
|
},
|
|
|
|
|
|
/**
|
|
* Shape Action
|
|
* @returns {Object} actions for ui shape
|
|
* @private
|
|
*/
|
|
_shapeAction: function _shapeAction() {
|
|
var _this7 = this;
|
|
|
|
return (0, _tuiCodeSnippet.extend)({
|
|
changeShape: function changeShape(changeShapeObject, isSilent) {
|
|
if (_this7.activeObjectId) {
|
|
_this7.changeShape(_this7.activeObjectId, changeShapeObject, isSilent);
|
|
}
|
|
},
|
|
setDrawingShape: function setDrawingShape(shapeType) {
|
|
_this7.setDrawingShape(shapeType);
|
|
}
|
|
}, this._commonAction());
|
|
},
|
|
|
|
|
|
/**
|
|
* Crop Action
|
|
* @returns {Object} actions for ui crop
|
|
* @private
|
|
*/
|
|
_cropAction: function _cropAction() {
|
|
var _this8 = this;
|
|
|
|
return (0, _tuiCodeSnippet.extend)({
|
|
crop: function crop() {
|
|
var cropRect = _this8.getCropzoneRect();
|
|
if (cropRect && !(0, _util.isEmptyCropzone)(cropRect)) {
|
|
_this8.crop(cropRect).then(function () {
|
|
_this8.stopDrawingMode();
|
|
_this8.ui.resizeEditor();
|
|
_this8.ui.changeMenu('crop');
|
|
_this8._invoker.fire(_consts.eventNames.EXECUTE_COMMAND, _consts.historyNames.CROP);
|
|
})['catch'](function (message) {
|
|
return Promise.reject(message);
|
|
});
|
|
}
|
|
},
|
|
cancel: function cancel() {
|
|
_this8.stopDrawingMode();
|
|
_this8.ui.changeMenu('crop');
|
|
},
|
|
/* eslint-disable */
|
|
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());
|
|
},
|
|
|
|
|
|
/**
|
|
* Flip Action
|
|
* @returns {Object} actions for ui flip
|
|
* @private
|
|
*/
|
|
_flipAction: function _flipAction() {
|
|
var _this9 = this;
|
|
|
|
return (0, _tuiCodeSnippet.extend)({
|
|
flip: function flip(flipType) {
|
|
return _this9[flipType]();
|
|
}
|
|
}, this._commonAction());
|
|
},
|
|
|
|
|
|
/**
|
|
* 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, isSilent) {
|
|
if (applying) {
|
|
_this10.applyFilter(type, options, isSilent);
|
|
} else if (_this10.hasFilter(type)) {
|
|
_this10.removeFilter(type);
|
|
}
|
|
}
|
|
}, this._commonAction());
|
|
},
|
|
|
|
|
|
/**
|
|
* Image Editor Event Observer
|
|
*/
|
|
setReAction: function setReAction() {
|
|
var _this11 = this;
|
|
|
|
this.on({
|
|
undoStackChanged: function undoStackChanged(length) {
|
|
if (length) {
|
|
_this11.ui.changeHelpButtonEnabled('undo', true);
|
|
_this11.ui.changeHelpButtonEnabled('reset', true);
|
|
} else {
|
|
_this11.ui.changeHelpButtonEnabled('undo', false);
|
|
_this11.ui.changeHelpButtonEnabled('reset', false);
|
|
}
|
|
_this11.ui.resizeEditor();
|
|
},
|
|
redoStackChanged: function redoStackChanged(length) {
|
|
if (length) {
|
|
_this11.ui.changeHelpButtonEnabled('redo', true);
|
|
} else {
|
|
_this11.ui.changeHelpButtonEnabled('redo', false);
|
|
}
|
|
_this11.ui.resizeEditor();
|
|
},
|
|
/* eslint-disable complexity */
|
|
objectActivated: function objectActivated(obj) {
|
|
_this11.activeObjectId = obj.id;
|
|
|
|
_this11.ui.changeHelpButtonEnabled('delete', true);
|
|
_this11.ui.changeHelpButtonEnabled('deleteAll', 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);
|
|
}
|
|
|
|
_this11.ui.text.setTextStyleStateOnAction(obj);
|
|
} 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) {
|
|
var _ui$text = _this11.ui.text,
|
|
fill = _ui$text.textColor,
|
|
fontSize = _ui$text.fontSize,
|
|
fontStyle = _ui$text.fontStyle,
|
|
fontWeight = _ui$text.fontWeight,
|
|
underline = _ui$text.underline;
|
|
|
|
var fontFamily = 'Noto Sans';
|
|
|
|
_this11.addText('Double Click', {
|
|
position: pos.originPosition,
|
|
styles: { fill: fill, fontSize: fontSize, fontFamily: fontFamily, fontStyle: fontStyle, fontWeight: fontWeight, underline: underline }
|
|
}).then(function () {
|
|
_this11.changeCursor('default');
|
|
});
|
|
},
|
|
addObjectAfter: function addObjectAfter(obj) {
|
|
if (obj.type === 'icon') {
|
|
_this11.ui.icon.changeStandbyMode();
|
|
} else 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 = (0, _util.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();
|
|
}
|
|
}
|
|
});
|
|
},
|
|
|
|
|
|
/**
|
|
* History Action
|
|
* @returns {Object} history actions for ui
|
|
* @private
|
|
*/
|
|
_historyAction: function _historyAction() {
|
|
var _this12 = this;
|
|
|
|
return {
|
|
undo: function undo(count) {
|
|
return _this12.undo(count);
|
|
},
|
|
redo: function redo(count) {
|
|
return _this12.redo(count);
|
|
}
|
|
};
|
|
},
|
|
|
|
|
|
/**
|
|
* Common Action
|
|
* @returns {Object} common actions for ui
|
|
* @private
|
|
*/
|
|
_commonAction: function _commonAction() {
|
|
var _this13 = this;
|
|
|
|
var TEXT = _consts.drawingModes.TEXT,
|
|
CROPPER = _consts.drawingModes.CROPPER,
|
|
SHAPE = _consts.drawingModes.SHAPE,
|
|
ZOOM = _consts.drawingModes.ZOOM;
|
|
|
|
|
|
return {
|
|
modeChange: function modeChange(menu) {
|
|
switch (menu) {
|
|
case _consts.drawingMenuNames.TEXT:
|
|
_this13._changeActivateMode(TEXT);
|
|
break;
|
|
case _consts.drawingMenuNames.CROP:
|
|
_this13.startDrawingMode(CROPPER);
|
|
break;
|
|
case _consts.drawingMenuNames.SHAPE:
|
|
_this13._changeActivateMode(SHAPE);
|
|
_this13.setDrawingShape(_this13.ui.shape.type, _this13.ui.shape.options);
|
|
break;
|
|
case _consts.drawingMenuNames.ZOOM:
|
|
_this13.startDrawingMode(ZOOM);
|
|
break;
|
|
default:
|
|
break;
|
|
}
|
|
},
|
|
deactivateAll: this.deactivateAll.bind(this),
|
|
changeSelectableAll: this.changeSelectableAll.bind(this),
|
|
discardSelection: this.discardSelection.bind(this),
|
|
stopDrawingMode: this.stopDrawingMode.bind(this)
|
|
};
|
|
},
|
|
|
|
|
|
/**
|
|
* Mixin
|
|
* @param {ImageEditor} ImageEditor instance
|
|
*/
|
|
mixin: function mixin(ImageEditor) {
|
|
(0, _tuiCodeSnippet.extend)(ImageEditor.prototype, this);
|
|
}
|
|
};
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/command/addIcon.js":
|
|
/*!***********************************!*\
|
|
!*** ./src/js/command/addIcon.js ***!
|
|
\***********************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
var ICON = _consts.componentNames.ICON; /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Add an icon
|
|
*/
|
|
|
|
var command = {
|
|
name: _consts.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 _util.Promise.resolve();
|
|
}
|
|
};
|
|
|
|
_command2.default.register(command);
|
|
|
|
exports.default = command;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/command/addImageObject.js":
|
|
/*!******************************************!*\
|
|
!*** ./src/js/command/addImageObject.js ***!
|
|
\******************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
var command = {
|
|
name: _consts.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 _util.Promise.resolve();
|
|
}
|
|
}; /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Add an image object
|
|
*/
|
|
|
|
|
|
_command2.default.register(command);
|
|
|
|
exports.default = command;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/command/addObject.js":
|
|
/*!*************************************!*\
|
|
!*** ./src/js/command/addObject.js ***!
|
|
\*************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
var command = {
|
|
name: _consts.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 _util.Promise(function (resolve, reject) {
|
|
if (!graphics.contains(object)) {
|
|
graphics.add(object);
|
|
resolve(object);
|
|
} else {
|
|
reject(_consts.rejectMessages.addedObject);
|
|
}
|
|
});
|
|
},
|
|
|
|
|
|
/**
|
|
* @param {Graphics} graphics - Graphics instance
|
|
* @param {Object} object - Fabric object
|
|
* @returns {Promise}
|
|
*/
|
|
undo: function undo(graphics, object) {
|
|
return new _util.Promise(function (resolve, reject) {
|
|
if (graphics.contains(object)) {
|
|
graphics.remove(object);
|
|
resolve(object);
|
|
} else {
|
|
reject(_consts.rejectMessages.noObject);
|
|
}
|
|
});
|
|
}
|
|
}; /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Add an object
|
|
*/
|
|
|
|
|
|
_command2.default.register(command);
|
|
|
|
exports.default = command;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/command/addShape.js":
|
|
/*!************************************!*\
|
|
!*** ./src/js/command/addShape.js ***!
|
|
\************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
var SHAPE = _consts.componentNames.SHAPE; /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Add a shape
|
|
*/
|
|
|
|
var command = {
|
|
name: _consts.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) {
|
|
var id = objectProps.id;
|
|
|
|
|
|
_this.undoData.object = graphics.getObject(id);
|
|
|
|
return objectProps;
|
|
});
|
|
},
|
|
|
|
|
|
/**
|
|
* @param {Graphics} graphics - Graphics instance
|
|
* @returns {Promise}
|
|
*/
|
|
undo: function undo(graphics) {
|
|
graphics.remove(this.undoData.object);
|
|
|
|
return _util.Promise.resolve();
|
|
}
|
|
};
|
|
|
|
_command2.default.register(command);
|
|
|
|
exports.default = command;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/command/addText.js":
|
|
/*!***********************************!*\
|
|
!*** ./src/js/command/addText.js ***!
|
|
\***********************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
var _selectionModifyHelper = __webpack_require__(/*! @/helper/selectionModifyHelper */ "./src/js/helper/selectionModifyHelper.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
/**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Add a text object
|
|
*/
|
|
var TEXT = _consts.componentNames.TEXT;
|
|
|
|
|
|
var command = {
|
|
name: _consts.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.textDecoration] Type of line (underline / line-through / 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);
|
|
|
|
if (this.undoData.object) {
|
|
var undoObject = this.undoData.object;
|
|
|
|
return new _util.Promise(function (resolve, reject) {
|
|
if (!graphics.contains(undoObject)) {
|
|
graphics.add(undoObject);
|
|
resolve(undoObject);
|
|
} else {
|
|
reject(_consts.rejectMessages.redo);
|
|
}
|
|
});
|
|
}
|
|
|
|
return textComp.add(text, options).then(function (objectProps) {
|
|
var id = objectProps.id;
|
|
|
|
var textObject = graphics.getObject(id);
|
|
|
|
_this.undoData.object = textObject;
|
|
|
|
(0, _selectionModifyHelper.setCachedUndoDataForDimension)((0, _selectionModifyHelper.makeSelectionUndoData)(textObject, function () {
|
|
return (0, _selectionModifyHelper.makeSelectionUndoDatum)(id, textObject, false);
|
|
}));
|
|
|
|
return objectProps;
|
|
});
|
|
},
|
|
|
|
|
|
/**
|
|
* @param {Graphics} graphics - Graphics instance
|
|
* @returns {Promise}
|
|
*/
|
|
undo: function undo(graphics) {
|
|
graphics.remove(this.undoData.object);
|
|
|
|
return _util.Promise.resolve();
|
|
}
|
|
};
|
|
|
|
_command2.default.register(command);
|
|
|
|
exports.default = command;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/command/applyFilter.js":
|
|
/*!***************************************!*\
|
|
!*** ./src/js/command/applyFilter.js ***!
|
|
\***************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _tuiCodeSnippet = __webpack_require__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
var FILTER = _consts.componentNames.FILTER;
|
|
|
|
/**
|
|
* Cached data for undo
|
|
* @type {Object}
|
|
*/
|
|
/**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Apply a filter into an image
|
|
*/
|
|
|
|
var cachedUndoDataForSilent = null;
|
|
|
|
/**
|
|
* Make undoData
|
|
* @param {string} type - Filter type
|
|
* @param {Object} prevfilterOption - prev Filter options
|
|
* @param {Object} options - Filter options
|
|
* @returns {object} - undo data
|
|
*/
|
|
function makeUndoData(type, prevfilterOption, options) {
|
|
var undoData = {};
|
|
|
|
if (type === 'mask') {
|
|
undoData.object = options.mask;
|
|
}
|
|
|
|
undoData.options = prevfilterOption;
|
|
|
|
return undoData;
|
|
}
|
|
|
|
var command = {
|
|
name: _consts.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
|
|
* @param {boolean} isSilent - is silent execution or not
|
|
* @returns {Promise}
|
|
*/
|
|
execute: function execute(graphics, type, options, isSilent) {
|
|
var filterComp = graphics.getComponent(FILTER);
|
|
|
|
if (type === 'mask') {
|
|
var maskObj = graphics.getObject(options.maskObjId);
|
|
|
|
if (!(maskObj && maskObj.isType('image'))) {
|
|
return Promise.reject(_consts.rejectMessages.invalidParameters);
|
|
}
|
|
|
|
_tuiCodeSnippet2.default.extend(options, { mask: maskObj });
|
|
graphics.remove(options.mask);
|
|
}
|
|
if (!this.isRedo) {
|
|
var prevfilterOption = filterComp.getOptions(type);
|
|
var undoData = makeUndoData(type, prevfilterOption, options);
|
|
|
|
cachedUndoDataForSilent = this.setUndoData(undoData, cachedUndoDataForSilent, isSilent);
|
|
}
|
|
|
|
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);
|
|
|
|
exports.default = command;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/command/changeIconColor.js":
|
|
/*!*******************************************!*\
|
|
!*** ./src/js/command/changeIconColor.js ***!
|
|
\*******************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
var ICON = _consts.componentNames.ICON; /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Change icon color
|
|
*/
|
|
|
|
var command = {
|
|
name: _consts.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 _util.Promise(function (resolve, reject) {
|
|
var iconComp = graphics.getComponent(ICON);
|
|
var targetObj = graphics.getObject(id);
|
|
|
|
if (!targetObj) {
|
|
reject(_consts.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 = this.undoData,
|
|
icon = _undoData.object,
|
|
color = _undoData.color;
|
|
|
|
|
|
iconComp.setColor(color, icon);
|
|
|
|
return _util.Promise.resolve();
|
|
}
|
|
};
|
|
|
|
_command2.default.register(command);
|
|
|
|
exports.default = command;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/command/changeSelection.js":
|
|
/*!*******************************************!*\
|
|
!*** ./src/js/command/changeSelection.js ***!
|
|
\*******************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
var _selectionModifyHelper = __webpack_require__(/*! @/helper/selectionModifyHelper */ "./src/js/helper/selectionModifyHelper.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
/**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview change selection
|
|
*/
|
|
var command = {
|
|
name: _consts.commandNames.CHANGE_SELECTION,
|
|
|
|
execute: function execute(graphics, props) {
|
|
if (this.isRedo) {
|
|
props.forEach(function (prop) {
|
|
graphics.setObjectProperties(prop.id, prop);
|
|
});
|
|
} else {
|
|
this.undoData = (0, _selectionModifyHelper.getCachedUndoDataForDimension)();
|
|
}
|
|
|
|
return _util.Promise.resolve();
|
|
},
|
|
undo: function undo(graphics) {
|
|
this.undoData.forEach(function (datum) {
|
|
graphics.setObjectProperties(datum.id, datum);
|
|
});
|
|
|
|
return _util.Promise.resolve();
|
|
}
|
|
};
|
|
|
|
_command2.default.register(command);
|
|
|
|
exports.default = command;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/command/changeShape.js":
|
|
/*!***************************************!*\
|
|
!*** ./src/js/command/changeShape.js ***!
|
|
\***************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _tuiCodeSnippet = __webpack_require__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
/**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview change a shape
|
|
*/
|
|
var SHAPE = _consts.componentNames.SHAPE;
|
|
|
|
/**
|
|
* Cached data for undo
|
|
* @type {Object}
|
|
*/
|
|
|
|
var cachedUndoDataForSilent = null;
|
|
|
|
/**
|
|
* Make undoData
|
|
* @param {object} options - shape options
|
|
* @param {Component} targetObj - shape component
|
|
* @returns {object} - undo data
|
|
*/
|
|
function makeUndoData(options, targetObj) {
|
|
var undoData = {
|
|
object: targetObj,
|
|
options: {}
|
|
};
|
|
|
|
_tuiCodeSnippet2.default.forEachOwnProperties(options, function (value, key) {
|
|
undoData.options[key] = targetObj[key];
|
|
});
|
|
|
|
return undoData;
|
|
}
|
|
|
|
var command = {
|
|
name: _consts.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
|
|
* @param {boolean} isSilent - is silent execution or not
|
|
* @returns {Promise}
|
|
*/
|
|
execute: function execute(graphics, id, options, isSilent) {
|
|
var shapeComp = graphics.getComponent(SHAPE);
|
|
var targetObj = graphics.getObject(id);
|
|
|
|
if (!targetObj) {
|
|
return _util.Promise.reject(_consts.rejectMessages.noObject);
|
|
}
|
|
|
|
if (!this.isRedo) {
|
|
var undoData = makeUndoData(options, targetObj);
|
|
|
|
cachedUndoDataForSilent = this.setUndoData(undoData, cachedUndoDataForSilent, isSilent);
|
|
}
|
|
|
|
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);
|
|
|
|
exports.default = command;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/command/changeText.js":
|
|
/*!**************************************!*\
|
|
!*** ./src/js/command/changeText.js ***!
|
|
\**************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
var TEXT = _consts.componentNames.TEXT; /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Change a text
|
|
*/
|
|
|
|
var command = {
|
|
name: _consts.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 _util.Promise.reject(_consts.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);
|
|
|
|
exports.default = command;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/command/changeTextStyle.js":
|
|
/*!*******************************************!*\
|
|
!*** ./src/js/command/changeTextStyle.js ***!
|
|
\*******************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _tuiCodeSnippet = __webpack_require__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
/**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Change text styles
|
|
*/
|
|
var TEXT = _consts.componentNames.TEXT;
|
|
|
|
/**
|
|
* Cached data for undo
|
|
* @type {Object}
|
|
*/
|
|
|
|
var cachedUndoDataForSilent = null;
|
|
|
|
/**
|
|
* Make undoData
|
|
* @param {object} styles - text styles
|
|
* @param {Component} targetObj - text component
|
|
* @returns {object} - undo data
|
|
*/
|
|
function makeUndoData(styles, targetObj) {
|
|
var undoData = {
|
|
object: targetObj,
|
|
styles: {}
|
|
};
|
|
_tuiCodeSnippet2.default.forEachOwnProperties(styles, function (value, key) {
|
|
var undoValue = targetObj[key];
|
|
undoData.styles[key] = undoValue;
|
|
});
|
|
|
|
return undoData;
|
|
}
|
|
|
|
var command = {
|
|
name: _consts.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.textDecoration] Type of line (underline / line-through / overline)
|
|
* @param {boolean} isSilent - is silent execution or not
|
|
* @returns {Promise}
|
|
*/
|
|
execute: function execute(graphics, id, styles, isSilent) {
|
|
var textComp = graphics.getComponent(TEXT);
|
|
var targetObj = graphics.getObject(id);
|
|
|
|
if (!targetObj) {
|
|
return _util.Promise.reject(_consts.rejectMessages.noObject);
|
|
}
|
|
if (!this.isRedo) {
|
|
var undoData = makeUndoData(styles, targetObj);
|
|
|
|
cachedUndoDataForSilent = this.setUndoData(undoData, cachedUndoDataForSilent, isSilent);
|
|
}
|
|
|
|
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);
|
|
|
|
exports.default = command;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/command/clearObjects.js":
|
|
/*!****************************************!*\
|
|
!*** ./src/js/command/clearObjects.js ***!
|
|
\****************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
var command = {
|
|
name: _consts.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 _util.Promise(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 _util.Promise.resolve();
|
|
}
|
|
}; /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Clear all objects
|
|
*/
|
|
|
|
|
|
_command2.default.register(command);
|
|
|
|
exports.default = command;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/command/flip.js":
|
|
/*!********************************!*\
|
|
!*** ./src/js/command/flip.js ***!
|
|
\********************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
/**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Flip an image
|
|
*/
|
|
var FLIP = _consts.componentNames.FLIP;
|
|
|
|
|
|
var command = {
|
|
name: _consts.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);
|
|
|
|
exports.default = command;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/command/loadImage.js":
|
|
/*!*************************************!*\
|
|
!*** ./src/js/command/loadImage.js ***!
|
|
\*************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
/**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Load a background (main) image
|
|
*/
|
|
var IMAGE_LOADER = _consts.componentNames.IMAGE_LOADER;
|
|
|
|
|
|
var command = {
|
|
name: _consts.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;
|
|
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: objects
|
|
};
|
|
|
|
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);
|
|
|
|
exports.default = command;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/command/removeFilter.js":
|
|
/*!****************************************!*\
|
|
!*** ./src/js/command/removeFilter.js ***!
|
|
\****************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
/**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Remove a filter from an image
|
|
*/
|
|
var FILTER = _consts.componentNames.FILTER;
|
|
|
|
|
|
var command = {
|
|
name: _consts.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);
|
|
|
|
exports.default = command;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/command/removeObject.js":
|
|
/*!****************************************!*\
|
|
!*** ./src/js/command/removeObject.js ***!
|
|
\****************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
var command = {
|
|
name: _consts.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 _util.Promise(function (resolve, reject) {
|
|
_this.undoData.objects = graphics.removeObjectById(id);
|
|
if (_this.undoData.objects.length) {
|
|
resolve();
|
|
} else {
|
|
reject(_consts.rejectMessages.noObject);
|
|
}
|
|
});
|
|
},
|
|
|
|
|
|
/**
|
|
* @param {Graphics} graphics - Graphics instance
|
|
* @returns {Promise}
|
|
*/
|
|
undo: function undo(graphics) {
|
|
graphics.add(this.undoData.objects);
|
|
|
|
return _util.Promise.resolve();
|
|
}
|
|
}; /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Remove an object
|
|
*/
|
|
|
|
|
|
_command2.default.register(command);
|
|
|
|
exports.default = command;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/command/resizeCanvasDimension.js":
|
|
/*!*************************************************!*\
|
|
!*** ./src/js/command/resizeCanvasDimension.js ***!
|
|
\*************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
var command = {
|
|
name: _consts.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 _util.Promise(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 _util.Promise.resolve();
|
|
}
|
|
}; /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Resize a canvas
|
|
*/
|
|
|
|
|
|
_command2.default.register(command);
|
|
|
|
exports.default = command;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/command/rotate.js":
|
|
/*!**********************************!*\
|
|
!*** ./src/js/command/rotate.js ***!
|
|
\**********************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
/**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Rotate an image
|
|
*/
|
|
var ROTATION = _consts.componentNames.ROTATION;
|
|
|
|
/**
|
|
* Cached data for undo
|
|
* @type {Object}
|
|
*/
|
|
|
|
var cachedUndoDataForSilent = null;
|
|
|
|
/**
|
|
* Make undo data
|
|
* @param {Component} rotationComp - rotation component
|
|
* @returns {object} - undodata
|
|
*/
|
|
function makeUndoData(rotationComp) {
|
|
return {
|
|
angle: rotationComp.getCurrentAngle()
|
|
};
|
|
}
|
|
|
|
var command = {
|
|
name: _consts.commandNames.ROTATE_IMAGE,
|
|
|
|
/**
|
|
* Rotate an image
|
|
* @param {Graphics} graphics - Graphics instance
|
|
* @param {string} type - 'rotate' or 'setAngle'
|
|
* @param {number} angle - angle value (degree)
|
|
* @param {boolean} isSilent - is silent execution or not
|
|
* @returns {Promise}
|
|
*/
|
|
execute: function execute(graphics, type, angle, isSilent) {
|
|
var rotationComp = graphics.getComponent(ROTATION);
|
|
|
|
if (!this.isRedo) {
|
|
var undoData = makeUndoData(rotationComp);
|
|
|
|
cachedUndoDataForSilent = this.setUndoData(undoData, cachedUndoDataForSilent, isSilent);
|
|
}
|
|
|
|
return rotationComp[type](angle);
|
|
},
|
|
|
|
|
|
/**
|
|
* @param {Graphics} graphics - Graphics instance
|
|
* @returns {Promise}
|
|
*/
|
|
undo: function undo(graphics) {
|
|
var rotationComp = graphics.getComponent(ROTATION);
|
|
var _args = this.args,
|
|
type = _args[1],
|
|
angle = _args[2];
|
|
|
|
|
|
if (type === 'setAngle') {
|
|
return rotationComp[type](this.undoData.angle);
|
|
}
|
|
|
|
return rotationComp.rotate(-angle);
|
|
}
|
|
};
|
|
|
|
_command2.default.register(command);
|
|
|
|
exports.default = command;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/command/setObjectPosition.js":
|
|
/*!*********************************************!*\
|
|
!*** ./src/js/command/setObjectPosition.js ***!
|
|
\*********************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
var command = {
|
|
name: _consts.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 _util.Promise.reject(_consts.rejectMessages.noObject);
|
|
}
|
|
|
|
this.undoData.objectId = id;
|
|
this.undoData.props = graphics.getObjectProperties(id, ['left', 'top']);
|
|
|
|
graphics.setObjectPosition(id, posInfo);
|
|
graphics.renderAll();
|
|
|
|
return _util.Promise.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 _util.Promise.resolve();
|
|
}
|
|
}; /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Set object properties
|
|
*/
|
|
|
|
|
|
_command2.default.register(command);
|
|
|
|
exports.default = command;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/command/setObjectProperties.js":
|
|
/*!***********************************************!*\
|
|
!*** ./src/js/command/setObjectProperties.js ***!
|
|
\***********************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _tuiCodeSnippet = __webpack_require__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
/**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Set object properties
|
|
*/
|
|
var command = {
|
|
name: _consts.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.textDecoration] Type of line (underline / line-through / overline)
|
|
* @returns {Promise}
|
|
*/
|
|
execute: function execute(graphics, id, props) {
|
|
var _this = this;
|
|
|
|
var targetObj = graphics.getObject(id);
|
|
|
|
if (!targetObj) {
|
|
return _util.Promise.reject(_consts.rejectMessages.noObject);
|
|
}
|
|
|
|
this.undoData.props = {};
|
|
_tuiCodeSnippet2.default.forEachOwnProperties(props, function (value, key) {
|
|
_this.undoData.props[key] = targetObj[key];
|
|
});
|
|
|
|
graphics.setObjectProperties(id, props);
|
|
|
|
return _util.Promise.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 _util.Promise.resolve();
|
|
}
|
|
};
|
|
|
|
_command2.default.register(command);
|
|
|
|
exports.default = command;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/component/cropper.js":
|
|
/*!*************************************!*\
|
|
!*** ./src/js/component/cropper.js ***!
|
|
\*************************************/
|
|
/*! no static exports found */
|
|
/***/ (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__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _fabric = __webpack_require__(/*! fabric */ "fabric");
|
|
|
|
var _fabric2 = _interopRequireDefault(_fabric);
|
|
|
|
var _component = __webpack_require__(/*! @/interface/component */ "./src/js/interface/component.js");
|
|
|
|
var _component2 = _interopRequireDefault(_component);
|
|
|
|
var _cropzone = __webpack_require__(/*! @/extension/cropzone */ "./src/js/extension/cropzone.js");
|
|
|
|
var _cropzone2 = _interopRequireDefault(_cropzone);
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
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. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Image crop module (start cropping, end cropping)
|
|
*/
|
|
|
|
|
|
var MOUSE_MOVE_THRESHOLD = 10;
|
|
var DEFAULT_OPTION = {
|
|
presetRatio: null,
|
|
top: -10,
|
|
left: -10,
|
|
height: 1,
|
|
width: 1
|
|
};
|
|
|
|
/**
|
|
* 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.<string, function>}
|
|
* @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(canvas, _tuiCodeSnippet2.default.extend({
|
|
left: 0,
|
|
top: 0,
|
|
width: 0.5,
|
|
height: 0.5,
|
|
strokeWidth: 0, // {@link https://github.com/kangax/fabric.js/issues/2860}
|
|
cornerSize: 10,
|
|
cornerColor: 'black',
|
|
fill: 'transparent'
|
|
}, _consts.CROPZONE_DEFAULT_OPTIONS, this.graphics.cropSelectionStyle));
|
|
|
|
canvas.discardActiveObject();
|
|
canvas.add(this._cropzone);
|
|
canvas.on('mouse:down', this._listeners.mousedown);
|
|
canvas.selection = false;
|
|
canvas.defaultCursor = 'crosshair';
|
|
|
|
_fabric2.default.util.addListener(document, 'keydown', this._listeners.keydown);
|
|
_fabric2.default.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;
|
|
}
|
|
canvas.remove(cropzone);
|
|
canvas.selection = true;
|
|
canvas.defaultCursor = 'default';
|
|
canvas.off('mouse:down', this._listeners.mousedown);
|
|
canvas.forEachObject(function (obj) {
|
|
obj.evented = true;
|
|
});
|
|
|
|
this._cropzone = null;
|
|
|
|
_fabric2.default.util.removeListener(document, 'keydown', this._listeners.keydown);
|
|
_fabric2.default.util.removeListener(document, 'keyup', this._listeners.keyup);
|
|
}
|
|
|
|
/**
|
|
* Change cropzone visible
|
|
* @param {boolean} visible - cropzone visible state
|
|
*/
|
|
|
|
}, {
|
|
key: 'changeVisibility',
|
|
value: function changeVisibility(visible) {
|
|
if (this._cropzone) {
|
|
this._cropzone.set({ visible: visible });
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 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) {
|
|
canvas.remove(cropzone);
|
|
cropzone.set(this._calcRectDimensionFromPoint(x, y));
|
|
|
|
canvas.add(cropzone);
|
|
canvas.setActiveObject(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) {
|
|
canvas.remove(this._cropzone);
|
|
}
|
|
|
|
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.left,
|
|
top: cropzone.top,
|
|
width: cropzone.width,
|
|
height: cropzone.height
|
|
};
|
|
}
|
|
|
|
/**
|
|
* Set a cropzone square
|
|
* @param {number} [presetRatio] - preset ratio
|
|
*/
|
|
|
|
}, {
|
|
key: 'setCropzoneRect',
|
|
value: function setCropzoneRect(presetRatio) {
|
|
var canvas = this.getCanvas();
|
|
var cropzone = this._cropzone;
|
|
|
|
canvas.discardActiveObject();
|
|
canvas.selection = false;
|
|
canvas.remove(cropzone);
|
|
|
|
cropzone.set(presetRatio ? this._getPresetPropertiesForCropSize(presetRatio) : DEFAULT_OPTION);
|
|
|
|
canvas.add(cropzone);
|
|
canvas.selection = true;
|
|
|
|
if (presetRatio) {
|
|
canvas.setActiveObject(cropzone);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* get a cropzone square info
|
|
* @param {number} presetRatio - preset ratio
|
|
* @returns {{presetRatio: number, left: number, top: number, width: number, height: number}}
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_getPresetPropertiesForCropSize',
|
|
value: function _getPresetPropertiesForCropSize(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 (0, _util.fixFloatingPoint)(sizeValue * scaleHeight);
|
|
});
|
|
|
|
width = _snippet$map2[0];
|
|
height = _snippet$map2[1];
|
|
|
|
|
|
return {
|
|
presetRatio: presetRatio,
|
|
top: (originalHeight - height) / 2,
|
|
left: (originalWidth - width) / 2,
|
|
width: width,
|
|
height: height
|
|
};
|
|
}
|
|
|
|
/**
|
|
* 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);
|
|
|
|
exports.default = Cropper;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/component/filter.js":
|
|
/*!************************************!*\
|
|
!*** ./src/js/component/filter.js ***!
|
|
\************************************/
|
|
/*! no static exports found */
|
|
/***/ (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__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _fabric = __webpack_require__(/*! fabric */ "fabric");
|
|
|
|
var _fabric2 = _interopRequireDefault(_fabric);
|
|
|
|
var _component = __webpack_require__(/*! @/interface/component */ "./src/js/interface/component.js");
|
|
|
|
var _component2 = _interopRequireDefault(_component);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
var _mask = __webpack_require__(/*! @/extension/mask */ "./src/js/extension/mask.js");
|
|
|
|
var _mask2 = _interopRequireDefault(_mask);
|
|
|
|
var _sharpen = __webpack_require__(/*! @/extension/sharpen */ "./src/js/extension/sharpen.js");
|
|
|
|
var _sharpen2 = _interopRequireDefault(_sharpen);
|
|
|
|
var _emboss = __webpack_require__(/*! @/extension/emboss */ "./src/js/extension/emboss.js");
|
|
|
|
var _emboss2 = _interopRequireDefault(_emboss);
|
|
|
|
var _colorFilter = __webpack_require__(/*! @/extension/colorFilter */ "./src/js/extension/colorFilter.js");
|
|
|
|
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. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Add filter module
|
|
*/
|
|
|
|
|
|
var filters = _fabric2.default.Image.filters;
|
|
|
|
|
|
filters.Mask = _mask2.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, _consts.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 _util.Promise(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(_consts.rejectMessages.invalidParameters);
|
|
}
|
|
|
|
_this2._changeFilterValues(imgFilter, options);
|
|
|
|
_this2._apply(sourceImg, function () {
|
|
canvas.renderAll();
|
|
resolve({
|
|
type: type,
|
|
action: 'add',
|
|
options: options
|
|
});
|
|
});
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Remove filter to source image
|
|
* @param {string} type - Filter type
|
|
* @returns {Promise}
|
|
*/
|
|
|
|
}, {
|
|
key: 'remove',
|
|
value: function remove(type) {
|
|
var _this3 = this;
|
|
|
|
return new _util.Promise(function (resolve, reject) {
|
|
var sourceImg = _this3._getSourceImage();
|
|
var canvas = _this3.getCanvas();
|
|
var options = _this3.getOptions(type);
|
|
|
|
if (!sourceImg.filters.length) {
|
|
reject(_consts.rejectMessages.unsupportedOperation);
|
|
}
|
|
|
|
_this3._removeFilter(sourceImg, type);
|
|
|
|
_this3._apply(sourceImg, function () {
|
|
canvas.renderAll();
|
|
resolve({
|
|
type: type,
|
|
action: 'remove',
|
|
options: options
|
|
});
|
|
});
|
|
});
|
|
}
|
|
|
|
/**
|
|
* 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.filters.push();
|
|
var result = sourceImg.applyFilters();
|
|
if (result) {
|
|
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 = _fabric2.default.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);
|
|
|
|
exports.default = Filter;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/component/flip.js":
|
|
/*!**********************************!*\
|
|
!*** ./src/js/component/flip.js ***!
|
|
\**********************************/
|
|
/*! no static exports found */
|
|
/***/ (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__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _component = __webpack_require__(/*! @/interface/component */ "./src/js/interface/component.js");
|
|
|
|
var _component2 = _interopRequireDefault(_component);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Image flip module
|
|
*/
|
|
|
|
|
|
/**
|
|
* 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, _consts.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 {Promise}
|
|
*/
|
|
|
|
}, {
|
|
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 _util.Promise.reject(_consts.rejectMessages.flip);
|
|
}
|
|
|
|
_tuiCodeSnippet2.default.extend(setting, newSetting);
|
|
this.setImageProperties(setting, true);
|
|
this._invertAngle(isChangingFlipX, isChangingFlipY);
|
|
this._flipObjects(isChangingFlipX, isChangingFlipY);
|
|
|
|
return _util.Promise.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.rotate(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 {Promise}
|
|
*/
|
|
|
|
}, {
|
|
key: 'reset',
|
|
value: function reset() {
|
|
return this.set({
|
|
flipX: false,
|
|
flipY: false
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Flip x
|
|
* @returns {Promise}
|
|
*/
|
|
|
|
}, {
|
|
key: 'flipX',
|
|
value: function flipX() {
|
|
var current = this.getCurrentSetting();
|
|
|
|
return this.set({
|
|
flipX: !current.flipX,
|
|
flipY: current.flipY
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Flip y
|
|
* @returns {Promise}
|
|
*/
|
|
|
|
}, {
|
|
key: 'flipY',
|
|
value: function flipY() {
|
|
var current = this.getCurrentSetting();
|
|
|
|
return this.set({
|
|
flipX: current.flipX,
|
|
flipY: !current.flipY
|
|
});
|
|
}
|
|
}]);
|
|
|
|
return Flip;
|
|
}(_component2.default);
|
|
|
|
exports.default = Flip;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/component/freeDrawing.js":
|
|
/*!*****************************************!*\
|
|
!*** ./src/js/component/freeDrawing.js ***!
|
|
\*****************************************/
|
|
/*! no static exports found */
|
|
/***/ (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 _fabric = __webpack_require__(/*! fabric */ "fabric");
|
|
|
|
var _fabric2 = _interopRequireDefault(_fabric);
|
|
|
|
var _component = __webpack_require__(/*! @/interface/component */ "./src/js/interface/component.js");
|
|
|
|
var _component2 = _interopRequireDefault(_component);
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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. FE Development Team <dl_javascript@nhn.com>
|
|
* @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, _consts.componentNames.FREE_DRAWING, graphics));
|
|
|
|
_this.width = 12;
|
|
|
|
/**
|
|
* fabric.Color instance for brush color
|
|
* @type {fabric.Color}
|
|
*/
|
|
_this.oColor = new _fabric2.default.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 _fabric2.default.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);
|
|
|
|
exports.default = FreeDrawing;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/component/icon.js":
|
|
/*!**********************************!*\
|
|
!*** ./src/js/component/icon.js ***!
|
|
\**********************************/
|
|
/*! no static exports found */
|
|
/***/ (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__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _fabric = __webpack_require__(/*! fabric */ "fabric");
|
|
|
|
var _fabric2 = _interopRequireDefault(_fabric);
|
|
|
|
var _component = __webpack_require__(/*! @/interface/component */ "./src/js/interface/component.js");
|
|
|
|
var _component2 = _interopRequireDefault(_component);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Add icon module
|
|
*/
|
|
|
|
|
|
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',
|
|
clock: 'M100 338 c-132 -67 -132 -249 0 -316 56 -28 104 -28 160 0 132 67 132 249 0 316 -24 12 -60 22 -80 22 -20 0 -56 -10 -80 -22z m70 -28 c0 -11 5 -20 10 -20 6 0 10 9 10 20 0 24 11 25 56 4 38 -18 69 -56 79 -97 6 -23 4 -27 -14 -27 -12 0 -21 -4 -21 -10 0 -5 9 -10 21 -10 18 0 20 -4 14 -27 -10 -41 -41 -79 -79 -97 -45 -21 -56 -20 -56 4 0 11 -4 20 -10 20 -5 0 -10 -9 -10 -20 0 -24 -11 -25 -56 -4 -38 18 -69 56 -79 97 -6 23 -4 27 14 27 12 0 21 5 21 10 0 6 -9 10 -21 10 -18 0 -20 4 -14 27 10 40 40 78 77 96 44 22 58 21 58 -3z'
|
|
+ 'M196 225 c-15 -19 -36 -35 -47 -35 -10 0 -19 -4 -19 -10 0 -5 13 -10 29 -10 22 0 37 10 60 39 35 43 37 51 17 51 -7 0 -26 -16 -40 -35z',
|
|
idea: 'M120 435 c0 -19 5 -35 10 -35 6 0 10 16 10 35 0 19 -4 35 -10 35 -5 0 -10 -16 -10 -35z'
|
|
+'M7 434 c-5 -5 6 -27 29 -63 2 -1 8 0 13 4 8 4 6 16 -6 36 -18 29 -25 34 -36 23z'
|
|
+'M217 411 c-12 -20 -14 -32 -6 -36 5 -4 11 -5 13 -4 23 36 34 58 29 63 -11 11 -18 6 -36 -23z'
|
|
+'M84 356 c-69 -30 -98 -122 -56 -177 10 -13 24 -39 31 -56 13 -32 15 -33 71 -33 56 0 58 1 71 33 7 17 21 43 31 56 43 56 12 148 -58 177 -41 17 -50 17 -90 0z m90 -27 c31 -15 60 -72 50 -102 -12 -41 -56 -107 -70 -107 -10 0 -14 14 -14 55 0 42 3 55 15 55 8 0 15 5 15 10 0 6 -18 10 -40 10 -22 0 -40 -4 -40 -10 0 -5 7 -10 15 -10 12 0 15 -13 15 -55 0 -69 -18 -73 -53 -12 -37 63 -40 82 -22 120 24 52 76 70 129 46z'
|
|
+'M70 55 c0 -12 13 -15 60 -15 47 0 60 3 60 15 0 12 -13 15 -60 15 -47 0 -60 -3 -60 -15z'
|
|
+'M70 15 c0 -12 13 -15 60 -15 47 0 60 3 60 15 0 12 -13 15 -60 15 -47 0 -60 -3 -60 -15z'
|
|
,phone: 'M1645 3725 c-57 -20 -144 -118 -194 -218 -58 -117 -74 -197 -68 -332 8 -177 64 -307 190 -438 34 -35 332 -332 662 -659 571 -565 604 -596 675 -630 109 -53 188 -71 305 -72 117 0 198 19 302 70 82 41 190 133 209 181 18 43 18 115 -1 160 -16 39 -341 374 -406 419 -53 36 -108 47 -167 32 -40 -10 -64 -28 -159 -121 l-112 -109 -53 32 c-165 102 -400 311 -582 520 -85 97 -186 232 -213 284 l-15 29 106 106 c109 110 136 153 136 218 -1 71 -31 111 -241 319 -165 163 -212 204 -244 213 -52 14 -81 13 -130 -4z'
|
|
,1:'M.1,5.72c1,2,2,3.9,3,5.87S4.7,15.74,6,17.44a.62.62,0,0,0,.38.22.8.8,0,0,0,1,.49,130.09,130.09,0,0,1,19.93-4.93A94.87,94.87,0,0,1,38.25,12c3.44-.13,11.54-.57,7.08,7.89-.71,1.34-2.89,2.36-4.08,3.11-8.51,5.35-20.44,6.23-27.5,13.84-5.51,5.94-3.27,14.51,3.11,18.84,8.12,5.5,20.41,3.54,29.45.75.16,4,.41,8,.69,12,0,.62.74,1.2,1.34.77,7.18-5.11,14.28-10.35,21.42-15.53a1,1,0,0,0-.22-1.7c-1.61-.66-3.19-1.36-4.76-2.07a.4.4,0,0,0-.49-.21,148.59,148.59,0,0,1-15.61-8.3.94.94,0,0,0-1.4.8c-.12,2.39-.15,4.76-.12,7.15-6.36.47-13.15,1-19.24-1.28-3.2-1.19-10-4.46-4.45-10.12,1.07-1.08,3.07-1.39,4.46-1.74,3.25-.82,6.62-1,9.89-1.7,8.65-1.87,17.75-8.7,18.87-18.11C57.86,6.6,47.46,2.46,39.58,1,26.89-1.4,14,1,1.52,3.62a.77.77,0,0,0-.66.78A.92.92,0,0,0,.1,5.72M48.69,27A108.68,108.68,0,0,0,51.45,7.85a9.72,9.72,0,0,1,3,4.7c1.3,4.6-1.1,9.31-4.11,12.78A20.83,20.83,0,0,1,48.69,27M63.82,55.69a29.79,29.79,0,0,0,.83-3.86c.93.41,1.85.84,2.79,1.23l-3.62,2.63M59.24,59A27.43,27.43,0,0,0,61,50.15c.9.43,1.8.87,2.72,1.28a48.65,48.65,0,0,1-.85,4.92L59.24,59m-5.09,3.72a102.26,102.26,0,0,0,2.13-15c1.23.64,2.46,1.27,3.71,1.88a39.32,39.32,0,0,1-1.53,9.67.28.28,0,0,0,0,.24c-1.45,1.06-2.88,2.12-4.33,3.17m-4.51,3.31a132,132,0,0,0,2.25-20.47.64.64,0,0,0,0-.2c1.1.62,2.22,1.24,3.34,1.83a.25.25,0,0,0,0,.12q-.93,8-1.85,16l-3.67,2.69M44.13,55.32A8.89,8.89,0,0,0,45.41,51l1.84-.19A.93.93,0,0,0,49,50.43c-.05-2.22,0-4.43.06-6.65.74.44,1.49.86,2.24,1.29a.58.58,0,0,0-.52.51c-.92,7-1.43,14.13-2.11,21.16l-.06.05C48.31,63.2,48,59.62,47.55,56l.36-.12a.7.7,0,0,0-.37-1.34l-3.41.74m-5.36,1a24.86,24.86,0,0,0,1.93-5c1.26-.07,2.49-.17,3.65-.28A18.46,18.46,0,0,1,44,53c-.22.86-.6,1.65-.87,2.49-1.45.3-2.91.59-4.38.84m-5.1.66a19.46,19.46,0,0,0,1.44-5.62c1.48.07,3,.07,4.42,0-.54,1.71-1.09,3.4-1.71,5.1-1.38.21-2.77.39-4.15.51m-4.91.13c.73-2,1.49-4.1,2.08-6.19,1,.18,2.1.3,3.17.38a56.72,56.72,0,0,1-1.18,5.74c-1.36.09-2.71.11-4.07.07m-6-1a67.16,67.16,0,0,0,2.48-6.93,20.8,20.8,0,0,0,4.45,1.5c-.73,2.07-1.3,4.24-1.9,6.36L26.42,57a18.59,18.59,0,0,1-3.68-.81m-3.58-1.57A20.24,20.24,0,0,0,22,47.09a13.53,13.53,0,0,0,2.17,1.58,71.16,71.16,0,0,0-2,7.31,21.07,21.07,0,0,1-3-1.37m-2.56-18a111.73,111.73,0,0,0-3.9,10.83,9.07,9.07,0,0,1,.59-6.64,12.34,12.34,0,0,1,3.31-4.19m3.74-2.52c-1.72,5.66-3.69,11.2-5.79,16.73a11,11,0,0,1-1.42-2.27,108.71,108.71,0,0,0,4.71-12.85v-.06a24.33,24.33,0,0,1,2.5-1.55m0,11.19c.21.28.43.54.66.8l0,0c-.45,1.54-.72,3.1-1.24,4.61-.4,1.16-.9,2.27-1.37,3.4A16.63,16.63,0,0,1,15.3,51.7c1.38-3,2.62-6,3.73-9.09a7.73,7.73,0,0,0,1.33,2.7M26,31.61a16.38,16.38,0,0,0-1.64,4.17A13.26,13.26,0,0,0,20.58,38q.77-2.37,1.45-4.77c1.31-.61,2.65-1.16,4-1.66M30.4,30c-.52,1.41-.93,2.9-1.33,4.32a35.49,35.49,0,0,0-4,1.21c.28-.64.55-1.28.86-1.91.41-.82.9-1.6,1.28-2.43l2.73-1L30.4,30m4.33-1.67c-.27.68-.48,1.41-.72,2.09-.35,1-.73,2.05-1,3.09-.86.15-1.88.34-3,.59a41.18,41.18,0,0,0,1.69-4.58c1-.39,2-.78,3.06-1.19m9.91-5.35c-.55,2.54-1.07,5.11-1.42,7.68A27,27,0,0,1,39,32.17v0a34.57,34.57,0,0,0,1.86-5.79A.48.48,0,0,0,40,26.1a32.77,32.77,0,0,0-1,3.41A10.74,10.74,0,0,1,38,32.45c-1.35.35-2.73.63-4.15.86.31-.74.61-1.49.9-2.24A19,19,0,0,0,36,27.77a40.89,40.89,0,0,0,7.5-4c.38-.26.78-.54,1.18-.84M46,11.36a26.09,26.09,0,0,0,.53-6.49,18.79,18.79,0,0,1,4.11,2.28c-1.05,6.8-1.82,13.68-2.7,20.51a21.91,21.91,0,0,1-3.81,2.53c.72-2.71,1.26-5.49,1.79-8.24,1.93-1.62,3.6-3.68,3.28-6.22A5.78,5.78,0,0,0,46,11.36M40.31,10a20.66,20.66,0,0,0,1.31-6.76,36.59,36.59,0,0,1,3.93,1.25c0,2.19-.08,4.36-.18,6.55a11.23,11.23,0,0,0-3.49-.93c-.52-.06-1-.09-1.57-.11m-4.9.17c.16-1.49.29-3,.49-4.45.16-1.17.43-2.35.5-3.53,1.46.21,2.92.47,4.35.82-.19.93-.22,1.89-.34,2.83-.17,1.35-.43,2.69-.65,4,0,0,0,.07,0,.11a38,38,0,0,0-4.37.19M23.9,12A27.11,27.11,0,0,0,25.15,1.85c1.66-.09,3.32-.14,5-.1-.36,2.83-.52,5.76-.61,8.61,0,.42.67.52.74.1.46-2.85.87-5.8,1.05-8.69,1.39.06,2.76.17,4.13.33a27.37,27.37,0,0,0-.68,8.16c-2.67.29-5.35.77-7.88,1.17-1,.16-2,.36-3,.54m-5.51,1.16v0A92.49,92.49,0,0,1,19.55,2.33C21,2.16,22.51,2,24,1.91A36.63,36.63,0,0,1,23.16,12a.33.33,0,0,0,0,.14c-1.6.3-3.19.65-4.77,1m-4.56,1.16A101.16,101.16,0,0,0,14.52,3c1.27-.2,2.54-.39,3.82-.55a45.83,45.83,0,0,0-.78,10.64.47.47,0,0,0,.06.21c-1.27.3-2.53.63-3.79,1m-.85.24q-2.58.72-5.13,1.55a.15.15,0,0,0,0-.07A38.73,38.73,0,0,0,8.22,4.14c1.71-.33,3.44-.65,5.18-.94A104.56,104.56,0,0,0,13,14.53M2,5.41H2c1.63-.35,3.29-.69,5-1A72.48,72.48,0,0,1,7.1,15.9a.34.34,0,0,0,.22.35l-.39.13,0,0A25.17,25.17,0,0,0,5,11.49C4,9.44,3.08,7.37,2,5.41'
|
|
,2:'M31.76,0A37.8,37.8,0,0,1,44.85,2.25a22.58,22.58,0,0,1,4.09,2c1.89,1.17,3.91,2.13,5.77,3.36a26.82,26.82,0,0,1,6,5.78,14.64,14.64,0,0,1,2.81,5.75,15.26,15.26,0,0,1,.27,6.06,6.69,6.69,0,0,1-.72,2,25.75,25.75,0,0,1-5.33,7.58,29.4,29.4,0,0,1-8.26,5.6,51.07,51.07,0,0,1-5.1,2A24.06,24.06,0,0,1,38,43.46c-1.95.06-3.89.28-5.84.32A38.5,38.5,0,0,1,27,43.41c-2.59-.3-5.08-1-7.61-1.55a21.5,21.5,0,0,1-5.61-2.29c-1.4-.75-2.82-1.49-4.16-2.35a23.55,23.55,0,0,1-6.32-5.78A15.67,15.67,0,0,1,0,22.23a16.72,16.72,0,0,1,1.41-6.52,36.74,36.74,0,0,1,2.82-5.38A13.63,13.63,0,0,1,7.34,6.88C8.4,6,9.5,5.24,10.59,4.43a7,7,0,0,1,1.83-.87,48.05,48.05,0,0,1,7.49-2.5C22,.67,24.18.5,26.32.25c2-.24,4-.21,5.44-.25m-8.9,20,.26,0a4.24,4.24,0,0,1,.25.91,56.92,56.92,0,0,0,.75,6.64,1.57,1.57,0,0,0,1.07,1.3,1.35,1.35,0,0,0,1.41-.43,1.7,1.7,0,0,0,.29-1.69,61.85,61.85,0,0,1-1.15-9.59,8.08,8.08,0,0,0-.44-2.34A1.67,1.67,0,0,0,23,13.71c-.6.22-.79.78-1,1.27-.74,1.67-1.43,3.37-2.15,5.06-.38.89-.79,1.77-1.26,2.85a8.11,8.11,0,0,1-1.07-1.64c-.85-2-1.82-3.89-2.84-5.79a2.23,2.23,0,0,0-.75-.91A1.78,1.78,0,0,0,12,14.39a1.51,1.51,0,0,0-.64,1.55c0,1.08.11,2.15.17,3.23a23.21,23.21,0,0,1,0,3.82,22.53,22.53,0,0,0-.07,3.58A1.4,1.4,0,0,0,13,28a1.56,1.56,0,0,0,1.13-1.52c-.13-1.4.19-2.78.13-4.18,0-.25-.13-.57.25-.72.31.16.36.49.51.76a24.59,24.59,0,0,0,2.56,4.16A1.36,1.36,0,0,0,20,26.39a14.12,14.12,0,0,0,1.26-2.7c.51-1.24,1-2.47,1.58-3.7m28.87,3.07-.23,0c-.31-.42-.62-.83-.92-1.25a76.17,76.17,0,0,1-4.09-6.45,1.15,1.15,0,0,0-.57-.56c-1.18-.52-2.17.24-2,1.58.31,2.79,0,5.58.05,8.36,0,1.15.08,2.31.19,3.46a1.5,1.5,0,0,0,1.33,1.16,1.26,1.26,0,0,0,1.21-1.1,3.17,3.17,0,0,0,.12-1.18c-.24-1.66,0-3.34-.13-5,0-.21-.11-.49.17-.61a.47.47,0,0,1,.38.28c.89,1.32,1.77,2.64,2.68,3.95q.89,1.28,1.86,2.49a1.32,1.32,0,0,0,1.5.49,1.35,1.35,0,0,0,1-1.25,9.48,9.48,0,0,0,0-1.07A14.66,14.66,0,0,1,54.35,24a55.22,55.22,0,0,0,.24-7.16,3,3,0,0,0-.14-1.07,1.4,1.4,0,0,0-1.29-1,1.55,1.55,0,0,0-1.32,1.47c0,.95,0,1.91,0,2.86,0,1.34-.07,2.68-.1,4m-16,6a3.07,3.07,0,0,0,1.57-.22,8.31,8.31,0,0,0,4.45-5.87c.29-1.2-.41-2.15-.94-3.12A13.38,13.38,0,0,0,38.16,17a4.2,4.2,0,0,0-5-1,6.49,6.49,0,0,0-3.56,8.67c.61,2,2.26,2.92,3.92,3.81a3.27,3.27,0,0,0,2.2.62',
|
|
arrow1:'M70.64,14.7a70.16,70.16,0,0,1-6.49-3.25L49.51.22C48.4-.63,47.1,1.18,48,2.13A67.34,67.34,0,0,0,62.92,13.54l.75.58q-24.45.68-48.89-.5Q8,13.17,1.17,12.84c-1.57-.08-1.55,2.32,0,2.42,3.62.26,7.25.46,10.87.65,15,1,30,2.61,45,4.49L40.12,28.79a1.15,1.15,0,0,0-.28,1.8l-1.28.73a1.08,1.08,0,0,0,1.09,1.86c2.71-1.49,5.4-3,8.1-4.51a109.06,109.06,0,0,0,15.77-7.43l2.45.32c1.17.16,1.53-1.65.65-2.17,1.35-.84,2.69-1.7,4-2.6.66-.46.9-1.7,0-2.09M48.93,16.79q8.9,0,17.78-.32c-.65.41-1.3.82-2,1.21a1.16,1.16,0,0,0-1.51-.38L61,18.44q-6-.9-12-1.65',
|
|
arrow2:'M37.52,50.89c-.41,0-.36-.36-.57-.43-.75-.25-.7-.82-.59-1.42,0-.21.26-.4.16-.62A10.9,10.9,0,0,1,36,45.07c-.06-.34-.31-.49-.42-.77-.33-.84-.71-1.66-1-2.51a1.57,1.57,0,0,0-.32-.56,3.65,3.65,0,0,1-1.11-2.73,4.93,4.93,0,0,0-.43-1.2c.86-1,1.23-1,2.08-.09s1.31,1.71,2,2.52a2.42,2.42,0,0,1,.5,1.07,3.47,3.47,0,0,0,.55-1.67,10.75,10.75,0,0,1,.48-2.68c.66-1.84.49-3.82,1.18-5.63.23-.59-.07-1.19,0-1.78.12-.91.3-1.81.38-2.72a41.66,41.66,0,0,0,.18-5.7,4.57,4.57,0,0,1,.09-2,2.09,2.09,0,0,0,0-1.59c-.18-.47.18-.89,0-1.33A2.23,2.23,0,0,1,40,14.48a1.2,1.2,0,0,0,0-.53,3.64,3.64,0,0,1,.07-2.35c0-.12.14-.27.1-.35a5.75,5.75,0,0,1-.16-2.67c0-.91-.23-1.79-.26-2.69,0-.71-.28-1.36-.31-2.07a1.46,1.46,0,0,0-1.11-1.35c-.37-.11-.74-.24-1.2-.39a8.33,8.33,0,0,1-2.25,1.39c-.61.36-1.38.56-1.6,1.39-1.07.33-1.35,1.42-2,2.13a38.21,38.21,0,0,0-2.41,3.27s0,.1,0,.13c-1,.78-.8,1.86-.82,2.92,0,1.54.08,3.09.09,4.63a6.47,6.47,0,0,1-.06,2.7,2.41,2.41,0,0,1-.12,2.27c-.13.29.08.51.16.73s.23.79.09.94c-.46.54-.14,1.07-.11,1.58a4.27,4.27,0,0,1-.2,1.88,10.06,10.06,0,0,1-1,2.67c-.16.2-.1.56-.15.84a2.3,2.3,0,0,1-1.37,1.82c-.07,0-.18.09-.2.15-.23.83-1,.66-1.58.8a5.42,5.42,0,0,1-.72-1.07c-.15-.37.2-.88-.29-1.19.2-.45-.71-.76-.17-1.26-.28-.45,0-.9,0-1.35a8.4,8.4,0,0,0-.49-2.54c-.13-.48-.36-.89-.06-1.38s-.38-.77-.06-1.23a1.29,1.29,0,0,0,0-1.26,1.75,1.75,0,0,1,0-1.17,11,11,0,0,0,.57-2.9l.45-1.57c.22-.43.43-.85.64-1.28l-.38-.24c.3-.42.6-.84.88-1.27a4,4,0,0,0,.45-1.36c.08-.44.76-.55.73-1.16a2.92,2.92,0,0,1,.54-1.42,2,2,0,0,1-.53-1.5c.1-.63-.56-1.07-.4-1.7-.51-.26-.12-.81-.35-1.11s-.61-.62-.37-1.12c-.67,0-.62-1.09-1.38-1a1,1,0,0,1-1.05-.56c-.2.47-.42.87-.77,1-1.12.3-1.75,1.29-2.73,1.78a.53.53,0,0,0-.28.27,6.11,6.11,0,0,1-1.66,2.11c-.26.29-.18.5-.12.79s-.54.16-.36.55a3.7,3.7,0,0,0-.75,2.49c0,.21-.1.37.08.56.55.58.36,1.42.69,2.1,0,.09-.21.34-.36.57.41.44.85.85.63,1.66-.11.4.52,1,.35,1.47s.13.88.24,1.32a3.09,3.09,0,0,1,0,1.32A1.88,1.88,0,0,0,16.72,23c.16.3-.21.19-.3.38.12.31.49.53.55.93,0,.17.1.32,0,.5s-.3.25-.29.53c0,.9-.06,1.8.06,2.68.05.34-.29.66,0,1-.48,1-.35,2.19-.75,3.24a2,2,0,0,1-.2.48c-.64.83-.82,1.91-1.53,2.74a1.82,1.82,0,0,0-1.63.82c-1.27-.26-1.63-.71-1.51-1.9a.77.77,0,0,0,0-.37,4.61,4.61,0,0,1-.24-1.86,11.39,11.39,0,0,0-.13-2c-.08-.63.27-1.26,0-1.86.41-.52-.42-.68-.31-1.22a21.05,21.05,0,0,1,.15-2.49.33.33,0,0,0-.07-.34,1.51,1.51,0,0,1,0-1.46,1.49,1.49,0,0,0,.13-1c-.17-.88-.61-1.74,0-2.62-.44-.69,0-1.35.07-2a9.84,9.84,0,0,1,1-3.09A5.16,5.16,0,0,0,12,10.69a11.18,11.18,0,0,0-.83-2,4.67,4.67,0,0,1-.46-2.1c-.38-.27-.76-.12-1.1-.23a1.69,1.69,0,0,0-1.45.32c-.73.46-1.18,1.27-2,1.6.1.66-.49,1-.8,1.35a12.51,12.51,0,0,0-1.12,2.55c-.39.88-.7,1.79-1,2.68-.55,1.48-.43,3.06-.95,4.52-.17.45.42.92,0,1.37.51.8-.14,1.67.18,2.53a4.58,4.58,0,0,1,0,1.88c-.08.95.26,1.9-.06,2.82-.07.2,0,.33.07.49.11.32.38.73.28,1s.5.68,0,1c-.24.16,0,.63,0,1a3.93,3.93,0,0,0,.21,1.83c-.12.29-.43.32-.62.51l.68.25c-.08.87-.16,1.75-.25,2.63-1,.21-1.54,0-1.5-1,0-1.15-.68-2.1-.61-3.22-.42-.41.11-.85,0-1.24a11.44,11.44,0,0,1-.3-2.33,7.1,7.1,0,0,1-.13-2.51c.12-.47-.16-.83-.1-1.26A4.87,4.87,0,0,0,.09,24c-.12-1,.07-2.1,0-3.14,0-.87.42-1.73.15-2.54-.36-1.1.35-2.11.1-3.16a.18.18,0,0,1,0-.13c.93-.65.82-1.78,1.17-2.68.52-1.3,1.21-2.5,1.77-3.77.1-.21.15-.41.23-.61.16-.4.9-.17.89-.63s0-.79.31-.91c.65-.26.8-1,1.4-1.34s1.38-.37,1.95-.84c.17-.14.42.06.61.17.55-.77.54-.65,1.21-.61,1.25.07,1.72,1,2.35,1.83a15.58,15.58,0,0,1,1.5,3.15c.35-.77,1.12-1.12,1.25-2A1.45,1.45,0,0,1,15.61,6a23.68,23.68,0,0,0,2.91-2.93c.19-.18.48-.23.69-.38.7-.52,1.71-.29,2.33-1a1.25,1.25,0,0,1,.45,0c.84.23,1.84.13,2.43.94.36.48.9.75,1.2,1.37A13,13,0,0,1,27,7.67c.05.32.05.61.44.8.42-.73,1.17-1.2,1.51-2a2.82,2.82,0,0,1,1.2-1.37.86.86,0,0,0,.41-.48,3.51,3.51,0,0,1,2-1.95.53.53,0,0,0,.37-.47C32.89,2.1,33,2,33,2c1,.1,1.26-.86,1.94-1.18s1.14-.18,1.65-.6S37.68.11,38.24,0a2,2,0,0,1,1.44.53,6.27,6.27,0,0,1,2.52,5,8.4,8.4,0,0,0,.38,3,4.63,4.63,0,0,1,0,2.09c-.11,1.61.24,3.21,0,4.81-.25,2,.15,3.94-.11,5.91a14.81,14.81,0,0,0,.15,2.4,4.74,4.74,0,0,1-.21,1.63,4.57,4.57,0,0,0-.18,2,6.52,6.52,0,0,1-.37,3c-.13.37.13.62,0,1a32.87,32.87,0,0,0-.53,3.3c-.23,1.82-.74,3.59-1.08,5.39-.09.49,0,1-.07,1.43s-.31,1-.41,1.51a3.21,3.21,0,0,0,.08.87c.93-.59,1.75-1.14,2.61-1.63s2-.15,3-.54l.68.63c.13.54-.17,1.08-.39,1.11-.58.07-.8.51-1.18.79a1.34,1.34,0,0,1-.43.3c-1.43.38-2.09,1.81-3.35,2.42-.06.64-1.07.83-.78,1.65,0,.1-.13.35-.27.43-.86.52-1.47,1.36-2.21,1.9M12.86,16.27c.11.28.31.49.13.75-.76,1.1-.3,2.38-.46,3.57-.08.53.13,1.16,0,1.7s.18,1.21,0,1.78,0,.93,0,1.39.36.8.06,1.25,0,.76.17,1.15a3.3,3.3,0,0,1,0,1.25c-.11,1.05.4,2.05.17,3.07.35.15.59.15.72-.18a13.41,13.41,0,0,0,1-3.33c0-.21-.19-.48-.18-.75,0-.65.35-1.24.1-2a8.14,8.14,0,0,1,0-2c0-.68-.15-1.37-.14-2a3.7,3.7,0,0,0-.42-2.1.64.64,0,0,1,0-.39,8.34,8.34,0,0,0-.35-2.68c0-.19-.21-.4-.72-.44m12,14.89c-.32-.63.46-.75.44-1.2-.05-1,.65-1.88.41-2.91,0-.18.15-.4.22-.61a3.6,3.6,0,0,0,.11-.71c.08-.51,0-1,0-1.5a14.09,14.09,0,0,0,0-3.18A6.69,6.69,0,0,1,26,19.32a16.31,16.31,0,0,0-.19-3.55c-.2.47-.69.8-.75,1.26a5.34,5.34,0,0,1-.31,1.59c-.2.46-.77.84-.52,1.39s-.43,1-.27,1.59-.43,1,0,1.49l-.31,1.49c-.45.57.15,1.08.1,1.63A7.24,7.24,0,0,0,24,27.88c.06.56.21,1.11.27,1.66a2.21,2.21,0,0,0,.55,1.62',
|
|
arrow9:'M6.77,15.18c-1.12-.42-1.6,1.37-.49,1.78l.55.21a.91.91,0,0,0,.9-.24,1.68,1.68,0,0,0,.74-1.42l1.15,1.72a.92.92,0,0,0,1.59-.94A87,87,0,0,0,5.07,7.1L3.45,4.66c1.4-.1,2.8-.21,4.2-.34,10.6,5.45,21.52,14.37,27.57,25.32a47.07,47.07,0,0,1,3.17,17.71c0,.57.84.55.88,0a41.48,41.48,0,0,0-.18-7.81A32.72,32.72,0,0,1,40,47.66a.91.91,0,0,0,1.78.24C46.92,31,35.56,18.32,22.37,9.4a46.81,46.81,0,0,0-8.85-5.75L14,3.59l11.48-.16a.93.93,0,0,0,0-1.85l-.46,0C25.44,1,25.14-.08,24.3,0L6.74,1.85H6.62l-.13,0L.91,2.46A.93.93,0,0,0,.26,4c.56.65,1.09,1.32,1.64,2C3,8.76,5.23,14.6,6.77,15.18M35.43,26.4a46.85,46.85,0,0,0-4.78-8.22c6.43,6.14,11,13.56,10.54,22.5A40.94,40.94,0,0,0,35.43,26.4M19.88,9.85c1.16.75,2.3,1.52,3.43,2.33a44.91,44.91,0,0,1,4.07,4.21,71.39,71.39,0,0,0-7.5-6.54',
|
|
arrow10:'M1.28,17.06a.59.59,0,0,1,0,.08C.51,17.26,0,18.44.9,18.83l.22.1h0l.3.12c-.19.72.68,1.53,1.36,1l.43-.31q7.51,3.06,15.29,5.42c2.14,1,4.3,1.93,6.5,2.8,1,.39,1.64-1.23.72-1.7l-1.16-.59a.75.75,0,0,0-.26-.8c-.59-.49-1.2-.95-1.8-1.43,1.41.54,2.83,1.06,4.28,1.54,1,.33,1.67-1.26.72-1.7-1.3-.59-2.61-1.17-3.92-1.74A1,1,0,0,0,23.18,20L17.57,18.4a228.91,228.91,0,0,1,22.79-3.65,140,140,0,0,1,26.37,2.57c3.91.8,10,1.92,12.92,4.83l.25.27c0,.37,0,.73,0,1.1-.62,1.21-3.27,2.42-4.42,3.07-4.78,2.7-10.14,4.47-15.28,6.33-10.5,3.79-21.17,7-32,9.83a.93.93,0,0,0,.25,1.81c3.16-.18,6.31-.48,9.43-.9a.94.94,0,0,0,.56.1q5.67-.9,11.26-2.1-7.4,2.55-14.95,4.61A.91.91,0,0,0,35.3,48c1.07-.24,2.14-.51,3.2-.78a.64.64,0,0,0,.68.77,74,74,0,0,0,34.43-10.8c4.79-3,12.35-8.72,9.52-13.91a7.06,7.06,0,0,0,.06-1.95c.69-2.29-.1-4.82-3.47-7.54-3.8-3.05-8.81-4.13-13.54-4.68a140.65,140.65,0,0,0-22.39-.53A169.54,169.54,0,0,0,11.3,13.33,94.83,94.83,0,0,0,18.94,5.7a.93.93,0,0,0-1.31-1.31l-8,6.46c.58-.72,1.18-1.43,1.78-2.14a64.83,64.83,0,0,0,4.36-4.83,1,1,0,0,0-.55-1.59c.09-.1.19-.2.28-.31a1,1,0,0,0,.17-.93c0-.69-.6-1.39-1.32-.87A61,61,0,0,0,1,13.41a.71.71,0,0,0,.05,1c-.3.44-.61.87-.9,1.32a.94.94,0,0,0,1.15,1.33m38.65-5.31c3.15-.12,6.3-.11,9.45.05-3.06,0-6.13.2-9.18.46a.83.83,0,0,0-.27-.51M17.51,16.1c-1.36.35-2.71.72-4.07,1.11l-.27-.08-.74-.41,5.08-.62m52.32-4.51a23.09,23.09,0,0,1,6.9,2.48,23.86,23.86,0,0,0-6.19-1.23l-1.17-.09a110.26,110.26,0,0,0-17.23-2.64,84.94,84.94,0,0,1,17.69,1.48M42.14,46.27A134.85,134.85,0,0,0,58,40.68c4.69-1.81,9.3-3.8,13.78-6a33.71,33.71,0,0,0,5.16-3.13l.51-.25a.77.77,0,0,0,.41-.45,19.38,19.38,0,0,0,3.62-3.75c-1,4.93-9.39,9.13-12.53,10.84a72.72,72.72,0,0,1-26.8,8.33M80.63,25.1a13.53,13.53,0,0,1-4,4.58l-.11,0A139.12,139.12,0,0,1,44.82,40.66c-1.64.32-3.3.61-5,.86A274.43,274.43,0,0,0,71.23,30.69a33.07,33.07,0,0,0,9.4-5.59M55.72,13.86c1.71,0,3.4,0,5.09.06,3.18.21,6.37.51,9.55.93a.69.69,0,0,0,.5-.12l1.26.15c2.69.38,5.73,1.08,7.59,3.23l.09,2c-6.9-4.29-15.59-5.68-24.08-6.25',
|
|
arrow11:'M1.23,15.9A.87.87,0,0,0,2.57,16L7.64,10.7c-.31.66-.61,1.32-.89,2-.4.43-.79.86-1.2,1.28a.88.88,0,0,0,.19,1.41c-.09.27-.19.53-.28.81-.33,1,1.16,1.58,1.7.71.28-.45.57-.9.86-1.34a.92.92,0,0,0,1.53.37q2.61-3.13,5-6.44c-.3,11.56.43,24,5.21,34.27,3.62,7.76,10.17,12.15,17.82,13.75a31.2,31.2,0,0,0,17.59,2.72c10.21-1.52,18.52-9.1,22-18.58a.78.78,0,0,0,.54-.4,10.69,10.69,0,0,0,1.1-6.57C80,22.82,73.68,11.45,63.89,4.93c-.89-.59-1.8.72-1.1,1.44a47.15,47.15,0,0,1,8.95,13A68.57,68.57,0,0,0,63.22,9.2a.87.87,0,0,0-1.44.3c-.84-.7-1.71-1.39-2.61-2-.48-.34-.91.44-.45.77a34.33,34.33,0,0,1,5.91,5.58C68.41,19,71.26,24.9,71.9,31.05a.71.71,0,0,1,0,.14c0,.14,0,.28,0,.42A26.18,26.18,0,0,1,71.52,38,23.57,23.57,0,0,1,65.1,49.8c-5.35,4.71-13.1,6.62-20.36,6.63-9.62-2.11-17.5-10.89-21.69-19.34A44.51,44.51,0,0,1,19,10.52a61.21,61.21,0,0,0,5.35,7.69.93.93,0,0,0,1.58-.65c0-.36-.09-.71-.13-1.07.61,1,1.25,2,1.91,3s2,.33,1.69-.72c-.08-.25-.17-.49-.26-.74a.86.86,0,0,0,0-.85l-.84-1.49A61.22,61.22,0,0,0,19.91.84a1,1,0,0,0-1.7.2v0a.89.89,0,0,0-.34.13,1,1,0,0,0-1.31-.4l-.49.32h0A.93.93,0,0,0,14.47.28a45.42,45.42,0,0,0-3.14,4,.89.89,0,0,0-.35.22L10,5.38a83,83,0,0,0-9.78,9,.94.94,0,0,0,1,1.53M17.87,4.49c.07-.1.13-.2.19-.3l.51,1.17a1,1,0,0,0-.22.13c-.17-.33-.32-.67-.48-1m20.7,51.43-.25-.05A33.77,33.77,0,0,1,23.39,42.42a38.64,38.64,0,0,1-3.81-9A45.87,45.87,0,0,0,23.82,42c3.55,5.55,8.69,10.89,14.75,14M76.94,28.76,76.58,28A48,48,0,0,0,71,14.16a30.23,30.23,0,0,1,5.92,14.6M47,58.44a21.16,21.16,0,0,0,5-.11,24.38,24.38,0,0,0,12.1-5.54,21.38,21.38,0,0,0,8.51-11.31,27.51,27.51,0,0,0-1-18.89l0,.05c.94,1.55,2,3.33,3,5.22A47.3,47.3,0,0,1,76,39.23c-3.23,10.94-13,19.3-24.6,19.48A28.09,28.09,0,0,1,47,58.44M21.84,43.32a39.64,39.64,0,0,0,2.21,3.36,34.8,34.8,0,0,0,4.24,4.68,25,25,0,0,1-6.45-8M16.46,6.67l.24-.36c.28.57.57,1.13.87,1.69a60.37,60.37,0,0,0-1.23,7.71c-.05-3.12,0-6.16.12-9',
|
|
arrow12:'M60,.27A48.4,48.4,0,0,1,44.74,12.14a.92.92,0,0,0,.71,1.68c.82-.29,1.64-.6,2.45-.9l-.65.6c-.83.77.27,1.91,1.14,1.4l-3.34,3c-.78.69.27,2.07,1.12,1.45l12-8.82q0,13.29.14,26.59l-2,.1.58-.1c1-.17.71-1.68-.23-1.67l-55.35.86a.84.84,0,0,0,0,1.68q9.44.81,18.9,1.16C15.09,39.15,10,39,4.91,38.6a.69.69,0,0,0-.74.46l-3.09-.47C0,38.41-.47,40.06.62,40.25s2,.32,3,.47a.49.49,0,0,0,.34.79c2.7.19,5.41.32,8.12.41,13.52,2.21,27.26.1,40.93-1.19l4.45-.33.82,0c0,1.34,0,2.68,0,4a.87.87,0,0,0,1.73,0c0-1.27,0-2.54,0-3.82l.06.48c.07.56.93.57.88,0L61,40.5a.7.7,0,0,0,.39-.4l.19,0a.77.77,0,0,0,.64-.42c0,.32,0,.63,0,.94.07,1.18,1.89,1.19,1.85,0q-.3-8.66-.58-17.33-.11-6.75,0-13.49a54.61,54.61,0,0,1,5.38,5.59c1.09,1.45,2.18,2.89,3.3,4.32h0a1.09,1.09,0,0,0,.13.17c.59.75,1.87-.25,1.32-1-.09-.13-.19-.24-.28-.36-.6-.77-1.18-1.56-1.76-2.34a.88.88,0,0,0,.31-.27c.87.94,1.74,1.88,2.62,2.81A.92.92,0,0,0,76,17.59l0,0a.92.92,0,0,0,.17-1.39l-6.82-8c-1.75-2.23-3.57-4.4-5.52-6.49a.81.81,0,0,0-1.31.09c-.4-.5-.82-1-1.21-1.49A.93.93,0,0,0,60,.27M45.56,37.36l-2.46.38q-9.19.18-18.38-.07l20.84-.31M62.1,37c0,.56,0,1.12.08,1.69a.71.71,0,0,0-.6-.26l-.76.05c0-.36-.07-.72-.1-1.08A.92.92,0,0,0,62.1,37m2.16-28.2c-.58-.49-1.17-1-1.78-1.44l.06-.05a1,1,0,0,0,.35-.52l1.37,2m-3.68,0,1-.72.16.12A.84.84,0,0,0,61.2,9q0,4,0,7.9c0,.93,0,1.86,0,2.79q-.3-5.46-.59-10.9',
|
|
arrow13:'M.16,14.71l1,1.5A.83.83,0,0,0,.7,17.48c.38.6.76,1.2,1.13,1.8a.86.86,0,0,0-.34,1.24L13.88,38.4a1,1,0,0,0,1.73-.5l.27.38c.69.94,2.25.06,1.58-.94L15,33.63c1.81,2,3.68,4,5.65,5.9.7.68,2-.28,1.39-1.1q-6.45-8.34-12.9-16.7C9,21.57,8.5,21.05,8,20.42q23.81.18,47.62.38c15.93.95,31.88,1.51,47.77,1l-1.16,1q-5,3.8-10.32,7.17a.89.89,0,0,0-.08,1.45l-1.13.93c-.78.65.24,1.77,1,1.34,1.68-.9,3.32-1.84,5-2.8q-3.18,2.67-6.34,5.36c-.74.62.24,1.82,1,1.31l26-17,.07,0c.85.4,1.87-.7,1.06-1.39l-.34-.28a.93.93,0,0,0-.37-.91l-9.94-7.43Q101,5.21,93.9.16c-.71-.5-1.35.26-1.23.94-.77-.41-1.46.54-1.12,1.23a.93.93,0,0,0-.37.58l-.89-.57c-.86-.52-1.87.78-1.07,1.42q5.49,4.46,11.28,8.48c.6.55,1.18,1.12,1.77,1.69.41.44.82.89,1.24,1.33-8,1-16,1.41-24.07,1.63-21.55-.25-43.11-.47-64.66-.78A114.75,114.75,0,0,0,31,5.13c.69-.56-.07-1.86-.9-1.52-1.37.58-2.74,1.17-4.1,1.77a.52.52,0,0,0-.68-.52L22.56,6,23,5.64l.76-.46a.81.81,0,0,0,.42-.64l.1-.08a.81.81,0,0,0,.14-1A1,1,0,0,0,23,2.55Q12.78,8.25,3.15,14.9a.83.83,0,0,0-.32.41c-.37-.51-.74-1-1.11-1.53-.68-.92-2.22,0-1.56.93m110.6,4.2c-.21.17-.44.34-.65.52l-.55.26h-.69l1.31-1.13c.2.11.39.24.58.36m-6.82,8,6.37-5.38.51,0c-2.24,1.87-4.53,3.68-6.88,5.4M92.38,19.54l.82,0q6.74-.29,13.46-.85l.21.23-.93.78-13.56-.12m-71.7-9.11a.76.76,0,0,0-.65,0L18.26,11c1.76-.88,3.53-1.74,5.31-2.56-.95.66-1.92,1.32-2.89,1.95M8.8,17.57l-2.7.09.05-.08,1.78-1c1.33-.52,2.94-.95,3.41-1.12l1-.36L9.22,17a.9.9,0,0,0-.42.56',
|
|
arrow14:'M0,15.41c1.44,4.23,5.46,8.24,8.07,11.86l3.55,4.94c-.58,0-1.19.7-.77,1.27Q16.76,41.39,22,49.74a.8.8,0,0,0,.83.39c.08.13.17.26.25.4a.85.85,0,0,0,1.44,0,49.74,49.74,0,0,0,3.19-6.14,21.77,21.77,0,0,0,1.34-3,143.52,143.52,0,0,1,21.71,12A146,146,0,0,1,65.4,65.65c1.21,1.27,2.4,2.57,3.53,3.93a.6.6,0,0,0,.62.19l.7.71c.69.71,1.68-.33,1.07-1.07l-.65-.75c1-11-6.27-20.82-13.05-28.71a137.27,137.27,0,0,0-27-24,.63.63,0,0,0-.5-.11A48.59,48.59,0,0,0,33.82,5.13a.79.79,0,0,0-1.16-.89L33.6,1A.79.79,0,0,0,32.45.08q-8.73,3.81-17.37,7.8c-1.13.44-2.26.88-3.39,1.34C8,10.72,3.22,12,.24,14.63a.81.81,0,0,0-.21.78m35.2,5.89a70,70,0,0,0-7.13-3.74c.1-.35.19-.7.3-1.06h.05a.82.82,0,0,0,1.11.24.75.75,0,0,0,.3.44c1.84,1.31,3.63,2.69,5.37,4.11M58.42,43.07c5.13,6.15,9.9,13.31,10.76,21.09A83.17,83.17,0,0,0,58.42,43.07M30,38c0-.11.05-.21.07-.32.2-1-1.32-1.48-1.6-.44-.23.84-.48,1.65-.75,2.46l-.05.06a34.4,34.4,0,0,0,.17-4.57.84.84,0,0,0-1.65-.22c-.71,2.6-1.42,5.19-2.14,7.79a21.23,21.23,0,0,1-1.52,2.06.9.9,0,0,0,.56,1.44l0,.11a.82.82,0,0,0,1.26.89,1,1,0,0,0,.07.15l-.64,1.16c-1-1.63-2.06-3.22-3.14-4.8-.44-.79-.89-1.57-1.34-2.34a.79.79,0,0,0,.25-1.05A111.4,111.4,0,0,0,3.1,16.21a3.48,3.48,0,0,1,.6-1.14l2.92-1.32A108.78,108.78,0,0,0,28.14,4.87a.7.7,0,0,0,.36-.76c1-.54,2-1.11,3.05-1.69l-.3,1a.7.7,0,0,0-.88.48,41.84,41.84,0,0,0-1.5,6.16c-.59,2.48-1.17,4.95-1.72,7.44a.43.43,0,0,0,.21.49.38.38,0,0,0,.17.19A92.77,92.77,0,0,1,46.69,32.12,107.21,107.21,0,0,1,67,64.48,98,98,0,0,0,34.41,41.81c-2-1.13-3.72-2.41-4.42-3.86',
|
|
arrow15:'M75.57,17.61l-1.78.95L49.28,2.49l-.58-.4c-.07-.43-.13-.87-.22-1.3C48.32,0,47.1-.09,47,.78c0,0,0,.1,0,.14a.87.87,0,0,0-.25-.1l-1-.67a.79.79,0,0,0-1,1.26c.37.29.74.56,1.11.84a52.93,52.93,0,0,1,0,8.63l0,.25-.15-7.8c0-.87-1.49-.86-1.53,0-.14,3,.67,11-2.34,12.51l0,0-6-.56c-.73-.15-1.36-.27-1.77-.31q-2.91-.32-5.84-.58c-7.71-.74-15.43-1.32-23.16-1.8a.83.83,0,0,0-.17-.15c.08-.9.19-1.44.35-1.47a.24.24,0,0,0,0-.47l-.43,0a.3.3,0,0,0-.31.18,6.29,6.29,0,0,0-.61,1.88c-1-.06-2-.13-3-.18S-.36,13.85.67,13.94l1,.09a.49.49,0,0,0,.23.89l1.4.09A45.67,45.67,0,0,0,3,30.65l-.65.13a.82.82,0,0,0,.22,1.63l.73-.1c.12.59.23,1.18.38,1.77a.73.73,0,0,0,1.45-.19c0-.29,0-.93,0-1.82,13.82-1.85,27.67-3.59,41.44-5.81.07,1.5.14,3,.2,4.48-.05.69-.12,1.38-.23,2.08a.71.71,0,0,0,.37.75.75.75,0,0,0,1,.56l1.88-1a.69.69,0,0,0,1,.47c8-4.29,15.94-8.63,23.91-13a.91.91,0,0,0,.46-1l1-.59c.85-.48.28-1.91-.61-1.43m-4.11,2.2L57.89,27.07c-1.22.66-7.87,5.16-8.83,4.73a1.45,1.45,0,0,1-.72-.88l.78-5.08.35-.05a.55.55,0,0,0,.42-.3l1.59-.17c1-.09.74-1.52-.2-1.46-1.15.07-2.3.16-3.45.25a.73.73,0,0,0-1.36.1,358.52,358.52,0,0,0-41.37,6c.1-5,.12-10.07.14-15.1,13,.84,26,1.64,39,2.51a.8.8,0,0,0,.36-.06.93.93,0,0,0,1.31-.28A22.75,22.75,0,0,0,49,4.63,255,255,0,0,0,71.46,19.81',
|
|
arrow16:'M.1,5.72c1,2,2,3.9,3,5.87S4.7,15.74,6,17.44a.62.62,0,0,0,.38.22.8.8,0,0,0,1,.49,130.09,130.09,0,0,1,19.93-4.93A94.87,94.87,0,0,1,38.25,12c3.44-.13,11.54-.57,7.08,7.89-.71,1.34-2.89,2.36-4.08,3.11-8.51,5.35-20.44,6.23-27.5,13.84-5.51,5.94-3.27,14.51,3.11,18.84,8.12,5.5,20.41,3.54,29.45.75.16,4,.41,8,.69,12,0,.62.74,1.2,1.34.77,7.18-5.11,14.28-10.35,21.42-15.53a1,1,0,0,0-.22-1.7c-1.61-.66-3.19-1.36-4.76-2.07a.4.4,0,0,0-.49-.21,148.59,148.59,0,0,1-15.61-8.3.94.94,0,0,0-1.4.8c-.12,2.39-.15,4.76-.12,7.15-6.36.47-13.15,1-19.24-1.28-3.2-1.19-10-4.46-4.45-10.12,1.07-1.08,3.07-1.39,4.46-1.74,3.25-.82,6.62-1,9.89-1.7,8.65-1.87,17.75-8.7,18.87-18.11C57.86,6.6,47.46,2.46,39.58,1,26.89-1.4,14,1,1.52,3.62a.77.77,0,0,0-.66.78A.92.92,0,0,0,.1,5.72M48.69,27A108.68,108.68,0,0,0,51.45,7.85a9.72,9.72,0,0,1,3,4.7c1.3,4.6-1.1,9.31-4.11,12.78A20.83,20.83,0,0,1,48.69,27M63.82,55.69a29.79,29.79,0,0,0,.83-3.86c.93.41,1.85.84,2.79,1.23l-3.62,2.63M59.24,59A27.43,27.43,0,0,0,61,50.15c.9.43,1.8.87,2.72,1.28a48.65,48.65,0,0,1-.85,4.92L59.24,59m-5.09,3.72a102.26,102.26,0,0,0,2.13-15c1.23.64,2.46,1.27,3.71,1.88a39.32,39.32,0,0,1-1.53,9.67.28.28,0,0,0,0,.24c-1.45,1.06-2.88,2.12-4.33,3.17m-4.51,3.31a132,132,0,0,0,2.25-20.47.64.64,0,0,0,0-.2c1.1.62,2.22,1.24,3.34,1.83a.25.25,0,0,0,0,.12q-.93,8-1.85,16l-3.67,2.69M44.13,55.32A8.89,8.89,0,0,0,45.41,51l1.84-.19A.93.93,0,0,0,49,50.43c-.05-2.22,0-4.43.06-6.65.74.44,1.49.86,2.24,1.29a.58.58,0,0,0-.52.51c-.92,7-1.43,14.13-2.11,21.16l-.06.05C48.31,63.2,48,59.62,47.55,56l.36-.12a.7.7,0,0,0-.37-1.34l-3.41.74m-5.36,1a24.86,24.86,0,0,0,1.93-5c1.26-.07,2.49-.17,3.65-.28A18.46,18.46,0,0,1,44,53c-.22.86-.6,1.65-.87,2.49-1.45.3-2.91.59-4.38.84m-5.1.66a19.46,19.46,0,0,0,1.44-5.62c1.48.07,3,.07,4.42,0-.54,1.71-1.09,3.4-1.71,5.1-1.38.21-2.77.39-4.15.51m-4.91.13c.73-2,1.49-4.1,2.08-6.19,1,.18,2.1.3,3.17.38a56.72,56.72,0,0,1-1.18,5.74c-1.36.09-2.71.11-4.07.07m-6-1a67.16,67.16,0,0,0,2.48-6.93,20.8,20.8,0,0,0,4.45,1.5c-.73,2.07-1.3,4.24-1.9,6.36L26.42,57a18.59,18.59,0,0,1-3.68-.81m-3.58-1.57A20.24,20.24,0,0,0,22,47.09a13.53,13.53,0,0,0,2.17,1.58,71.16,71.16,0,0,0-2,7.31,21.07,21.07,0,0,1-3-1.37m-2.56-18a111.73,111.73,0,0,0-3.9,10.83,9.07,9.07,0,0,1,.59-6.64,12.34,12.34,0,0,1,3.31-4.19m3.74-2.52c-1.72,5.66-3.69,11.2-5.79,16.73a11,11,0,0,1-1.42-2.27,108.71,108.71,0,0,0,4.71-12.85v-.06a24.33,24.33,0,0,1,2.5-1.55m0,11.19c.21.28.43.54.66.8l0,0c-.45,1.54-.72,3.1-1.24,4.61-.4,1.16-.9,2.27-1.37,3.4A16.63,16.63,0,0,1,15.3,51.7c1.38-3,2.62-6,3.73-9.09a7.73,7.73,0,0,0,1.33,2.7M26,31.61a16.38,16.38,0,0,0-1.64,4.17A13.26,13.26,0,0,0,20.58,38q.77-2.37,1.45-4.77c1.31-.61,2.65-1.16,4-1.66M30.4,30c-.52,1.41-.93,2.9-1.33,4.32a35.49,35.49,0,0,0-4,1.21c.28-.64.55-1.28.86-1.91.41-.82.9-1.6,1.28-2.43l2.73-1L30.4,30m4.33-1.67c-.27.68-.48,1.41-.72,2.09-.35,1-.73,2.05-1,3.09-.86.15-1.88.34-3,.59a41.18,41.18,0,0,0,1.69-4.58c1-.39,2-.78,3.06-1.19m9.91-5.35c-.55,2.54-1.07,5.11-1.42,7.68A27,27,0,0,1,39,32.17v0a34.57,34.57,0,0,0,1.86-5.79A.48.48,0,0,0,40,26.1a32.77,32.77,0,0,0-1,3.41A10.74,10.74,0,0,1,38,32.45c-1.35.35-2.73.63-4.15.86.31-.74.61-1.49.9-2.24A19,19,0,0,0,36,27.77a40.89,40.89,0,0,0,7.5-4c.38-.26.78-.54,1.18-.84M46,11.36a26.09,26.09,0,0,0,.53-6.49,18.79,18.79,0,0,1,4.11,2.28c-1.05,6.8-1.82,13.68-2.7,20.51a21.91,21.91,0,0,1-3.81,2.53c.72-2.71,1.26-5.49,1.79-8.24,1.93-1.62,3.6-3.68,3.28-6.22A5.78,5.78,0,0,0,46,11.36M40.31,10a20.66,20.66,0,0,0,1.31-6.76,36.59,36.59,0,0,1,3.93,1.25c0,2.19-.08,4.36-.18,6.55a11.23,11.23,0,0,0-3.49-.93c-.52-.06-1-.09-1.57-.11m-4.9.17c.16-1.49.29-3,.49-4.45.16-1.17.43-2.35.5-3.53,1.46.21,2.92.47,4.35.82-.19.93-.22,1.89-.34,2.83-.17,1.35-.43,2.69-.65,4,0,0,0,.07,0,.11a38,38,0,0,0-4.37.19M23.9,12A27.11,27.11,0,0,0,25.15,1.85c1.66-.09,3.32-.14,5-.1-.36,2.83-.52,5.76-.61,8.61,0,.42.67.52.74.1.46-2.85.87-5.8,1.05-8.69,1.39.06,2.76.17,4.13.33a27.37,27.37,0,0,0-.68,8.16c-2.67.29-5.35.77-7.88,1.17-1,.16-2,.36-3,.54m-5.51,1.16v0A92.49,92.49,0,0,1,19.55,2.33C21,2.16,22.51,2,24,1.91A36.63,36.63,0,0,1,23.16,12a.33.33,0,0,0,0,.14c-1.6.3-3.19.65-4.77,1m-4.56,1.16A101.16,101.16,0,0,0,14.52,3c1.27-.2,2.54-.39,3.82-.55a45.83,45.83,0,0,0-.78,10.64.47.47,0,0,0,.06.21c-1.27.3-2.53.63-3.79,1m-.85.24q-2.58.72-5.13,1.55a.15.15,0,0,0,0-.07A38.73,38.73,0,0,0,8.22,4.14c1.71-.33,3.44-.65,5.18-.94A104.56,104.56,0,0,0,13,14.53M2,5.41H2c1.63-.35,3.29-.69,5-1A72.48,72.48,0,0,1,7.1,15.9a.34.34,0,0,0,.22.35l-.39.13,0,0A25.17,25.17,0,0,0,5,11.49C4,9.44,3.08,7.37,2,5.41',
|
|
arrow17:'M81.48,17.76c-.3-3-5.38-5.36-7.6-7Q66.54,5.2,58.9.12a.86.86,0,0,0-1.27.73c0,3.61-.26,7.18-.42,10.77l-28-.89C20,10.44,9.87,9,.67,10.2c-.51.07-.76.82-.27,1a.7.7,0,0,0-.38.64c0,1.46,0,2.91,0,4.37v0C.1,19.66.28,23.05.4,26.44a.92.92,0,0,0,.92.92c18.53-1.77,37.07-2.92,55.65-4,.2,3.55.38,7.1.56,10.65a.88.88,0,0,0,1.31.75C66.14,29.65,73.49,24.55,80.5,19a.69.69,0,0,0,.25-.42.81.81,0,0,0,.73-.86M4,11.8c-.49.53-1,1.07-1.44,1.6l-.84.89c-.05-.81-.11-1.61-.19-2.42a.76.76,0,0,0-.21-.46c.88.16,1.78.28,2.68.39m4.13.4A83.15,83.15,0,0,0,2,19.11c-.06-1.35-.11-2.7-.19-4a41,41,0,0,0,3-3.16c1.1.13,2.22.22,3.34.3m5.1.21A86.67,86.67,0,0,0,2.32,24.16c-.53-.95-.26-2.43-.33-4.1,0-.07,0-.14,0-.21a84.38,84.38,0,0,0,7.07-7.6c1.38.08,2.78.13,4.18.16m6.08.06A124.21,124.21,0,0,0,6.74,25.24a13.22,13.22,0,0,1-2.44,0,3.07,3.07,0,0,1-1.53-.54A158,158,0,0,1,14.66,12.44q2.32,0,4.65,0m4.88,0c-4,3.8-7.76,7.94-11.45,12-1.63.18-3.44.52-5.2.71,4.23-4.29,8.77-8.31,12.86-12.71h3.79m6.49.16c-3.52,3.71-7,7.46-10.49,11.21q-3.32.25-6.62.54c4-3.83,8.07-7.76,11.76-11.89,1,0,1.94,0,2.88.06l2.47.08m5,.16a80.49,80.49,0,0,0-8.46,10.5c-1.7.13-3.4.25-5.09.39l-1.06.08q5.34-5.52,10.63-11.1l4,.13m6.81.21a64.18,64.18,0,0,0-8.79,9.82c-1.91.14-3.83.27-5.74.42,2.75-3.64,5.66-7.07,8.75-10.42l5.78.18m4,.13c-.81.92-1.61,1.84-2.41,2.77-1.88,2.19-3.78,4.37-5.62,6.6l-3.95.26c2.91-3.25,6-6.3,8.9-9.55a.62.62,0,0,0,.1-.17l3,.09m4.57.15c-2.63,2.81-5.07,5.92-7.46,8.91l-4.28.25c1.45-1.56,2.87-3.15,4.3-4.73.81-.89,1.62-1.79,2.42-2.7a13.55,13.55,0,0,0,1.34-1.5l.3-.34,3.38.11m4.74.23a80.15,80.15,0,0,0-6.63,8.37l-4.74.26c2.68-2.84,5.43-5.75,7.85-8.82l3.4.11a1.25,1.25,0,0,0,.12.08M61.8,4.2a.3.3,0,0,0-.25.12A22.73,22.73,0,0,0,60.1,6.57c-.37.56-.77,1.09-1.18,1.63a47.7,47.7,0,0,0,.39-5.74L61.8,4.2m2.78,1.94-.06,0A135.09,135.09,0,0,0,53.18,21.56a.27.27,0,0,0,0,.15L50,21.85a68.94,68.94,0,0,0,6.78-8.25h0l1-.09a.94.94,0,0,0,.47-1.72c.22-.87.38-1.73.52-2.6h0A16.2,16.2,0,0,0,60.7,7.09,8.9,8.9,0,0,0,62.2,4.7a.36.36,0,0,0,0-.23l2.39,1.67m4.11,3A99.65,99.65,0,0,0,57.6,21.77a.78.78,0,0,0-.62-.23l-3.21.14A137.13,137.13,0,0,0,65.25,6.74a.32.32,0,0,0,0-.09c1.14.82,2.28,1.63,3.41,2.46M72,11.56a106.88,106.88,0,0,0-13.31,15c-.14-1.28-.31-2.56-.52-3.84a.47.47,0,0,0-.27-.36c3.67-4.42,7.42-8.7,11.42-12.84.9.66,1.79,1.34,2.68,2m2.33,1.74c.33.25,1.11.75,2,1.35A203.16,203.16,0,0,0,59.76,32l-.6.43c-.11-1.62-.23-3.23-.39-4.85A193.37,193.37,0,0,1,72.61,12c.55.42,1.12.83,1.68,1.26m5.28,4.32s-.09,0-.12.05c-5.7,4-11.29,8.19-16.93,12.29C67.42,25.1,72.4,20.25,77,15.13a9.1,9.1,0,0,1,2.61,2.49',
|
|
arrow18:'M106.19,17.81A271.86,271.86,0,0,0,79.79.11.93.93,0,0,0,78.41.9a86.74,86.74,0,0,1,.32,11c-12.82-.73-25.68-1-38.52-1.38S13.94,9,1,10a.45.45,0,0,0-.33.76.79.79,0,0,0-.67.85C.42,24.84,1,38.05,1.46,51.25l.71,19.31c.23,6-.34,12.61,1.34,18.37a.29.29,0,0,0,.38.17.69.69,0,0,0,.86.64c8.15-1.87,16.32-3.51,24.61-4.61A.93.93,0,0,0,30,84c-3.64-19.57-4.84-39.08-6.74-58.83,17.62.09,35.74-.26,53.32-1.64A55.48,55.48,0,0,0,74.4,36.73a.92.92,0,0,0,1.36.81c10-6.29,20.11-12.36,30.41-18.12a.94.94,0,0,0,0-1.61M76.82,31.2a11.89,11.89,0,0,0,2,2.3L76.39,35c.11-1.27.26-2.53.43-3.78m.75-4.89a21.63,21.63,0,0,0,4.53,5.05l.06,0c-.88.53-1.74,1.08-2.61,1.63-.9-.92-1.75-1.84-2.59-2.82.19-1.3.39-2.59.61-3.89m-73,58a16.34,16.34,0,0,0,3.08,3.19c-1.09.27-2.18.54-3.26.85a.82.82,0,0,0-.28.15,29,29,0,0,0,.46-4.19m0-4.92a89.23,89.23,0,0,0,8.11,7c-1.42.27-2.83.56-4.24.89a34.69,34.69,0,0,1-3.8-3.77c0-1.38,0-2.78-.07-4.17m13.84,6-4.71.89-.08-.09c-3.15-2.37-6.15-4.91-9.09-7.53-.1-1.9-.24-3.8-.35-5.65,4.71,4.16,9.42,8.33,14.23,12.38m-14.51-19c6.76,6.14,14,11.85,21.08,17.6-1.81.45-3.63.84-5.46,1.2-5-4.38-10.15-8.62-15.27-12.87,0,0-.07,0-.12,0,0-.54,0-1.08-.07-1.62Zm-.3-8.1c8,6.2,15.72,12.59,23.44,19.1.65,2.73,1.53,5.06-.88,6.2-7.33-6-14.62-12.23-22.28-17.83Zm-.25-6.74C11,57.23,18.51,63.22,25.72,69.59c.31,2,.62,4,1,6A208.46,208.46,0,0,0,3.54,57.47ZM3.09,45c7.35,5.16,14.4,10.7,21.45,16.27l.57,4.11c.12.87.25,1.75.38,2.62A199.52,199.52,0,0,0,3.32,50.81h0L3.09,45m-.24-6.58c3.54,2.8,7.17,5.47,10.8,8.15,2.56,1.89,6.68,6.28,9.9,7.18.26,2,.52,4.08.79,6.1-6.72-5.52-13.82-10.56-21-15.43a.24.24,0,0,0-.24,0c-.07-2-.15-4-.22-6m-.23-6.3a131.39,131.39,0,0,0,20.28,16c.17,1.63.36,3.26.56,4.89a9.21,9.21,0,0,0-2.78-2.49l-2.45-1.78-4.91-3.58c-3.47-2.51-6.94-5-10.49-7.41l-.21-5.6M2.39,26q10,7.94,19.9,15.89c.15,1.7.3,3.4.48,5.11A181,181,0,0,1,2.59,31.21c-.06-1.74-.14-3.48-.2-5.22m-.27-7c5.57,6.77,12.74,12.72,19.81,17.87.08,1.23.16,2.46.26,3.69q-9.75-7.9-19.83-15.39L2.12,19m19,10.33a.43.43,0,0,0,.57-.1c0,2.13.1,4.28.22,6.43C15,30.13,8.72,24.1,2.09,18.26l-.15-4c5.67,5.61,12.62,10.65,19.13,15.12M7.35,11.52A95,95,0,0,0,22.07,24.09a.72.72,0,0,0-.45.71c0,1.27,0,2.55,0,3.83h0C15.11,23.52,8.68,18,1.9,13.24l-.06-1.59a.87.87,0,0,0-.3-.65q2.88.32,5.81.52m7.9.4c4.3,4,8.81,7.85,13.44,11.51l-5.41.37c-5.27-3.79-10.12-8-15-12.22q3.49.22,7,.34m17.81.31A81,81,0,0,0,44.27,22.52q-7.16.35-14.26.82C25.36,19.65,20.84,15.83,16.35,12c2.75.08,5.52.13,8.28.16A68.72,68.72,0,0,0,37.11,22.8c.34.22.75-.3.44-.56-4.07-3.31-8.11-6.49-11.9-10.1,2.47,0,5,0,7.41.09m6.79.14a90.54,90.54,0,0,0,11.48,9.85l-5.71.23c-4-3.3-7.83-6.72-11.66-10.2q3,0,5.89.12m19,9.61c-2.1.05-4.2.12-6.3.19a.53.53,0,0,0-.12-.14c-4-3.05-7.85-6.24-11.58-9.63l8.15.29A64.15,64.15,0,0,0,58.85,22m-1.8-9c2.69,3.06,5.54,6,8.48,8.86-1.8,0-3.61,0-5.42.08l0-.06a84.78,84.78,0,0,1-10.22-9.17l7.21.29m6.87.26a60.86,60.86,0,0,0,8,8.54c-1.89,0-3.8,0-5.7.05a.4.4,0,0,0,0-.54c-2.61-2.85-5.38-5.64-8.23-8.28l6,.23m14.15,8.61a.86.86,0,0,0-.24,0h-.22s0,0-.06,0c-1.52,0-3,0-4.58,0a.36.36,0,0,0-.11-.26c-2.65-2.72-5.22-5.48-7.81-8.25l4.13.15q4.36,4.29,8.89,8.42m.47.43Q82.23,25.7,86,29.07L82.83,31a.41.41,0,0,0-.11-.22c-1.72-1.68-3.34-3.43-5-5.16.13-.74.25-1.47.38-2.21a.86.86,0,0,0,.46-1.07m10.68,4.81-2.48,1.47C81.32,23.5,75.88,18.38,70.27,13.5l5.42.16A73.07,73.07,0,0,0,89.22,27.12m-9-14c4,4,8.26,7.93,12.52,11.71a.37.37,0,0,0,.23.1c-1,.58-2,1.16-3,1.75a172.21,172.21,0,0,1-13.5-13l2.86.09a.8.8,0,0,0,.85-.69m.32-6.74A191.74,191.74,0,0,0,97,22.57c-1.17.68-2.35,1.36-3.52,2.06a.37.37,0,0,0-.09-.42c-4.17-4.05-8.47-8-12.87-11.86a1.2,1.2,0,0,0,.09-.35c.06-1.9,0-3.78,0-5.66m7.08.8c4.17,4.6,8.73,8.89,13.19,13.2l-3,1.71a.36.36,0,0,0-.12-.16Q89.11,14.12,80.91,5.94a.25.25,0,0,0-.37,0c0-1.1-.08-2.2-.16-3.31,2.45,1.46,4.86,3,7.26,4.51M104,18.5c-.78.44-1.55.89-2.32,1.34-3.57-3.55-7.14-7.17-10.84-10.59,4.47,3,8.86,6,13.16,9.25',
|
|
arrow19:'M9.36,48.9c22.37-13.4,46.2-26.11,72.77-27.48a40.14,40.14,0,0,0-3,10.89c-.1.73.81,1.12,1.37.83q13.83-7.17,27-15.45a.94.94,0,0,0,0-1.6A176.79,176.79,0,0,0,75.68.06c-.92-.35-1.32.85-.86,1.46a48.82,48.82,0,0,0,5.29,5.91C53.67,2.24,25.78,5.42.71,15c-.68.26-1.07,1.29-.25,1.7a155.4,155.4,0,0,0,22.16,9L8.11,47.62A.93.93,0,0,0,9.36,48.9M7.85,14.46a7.93,7.93,0,0,1,.63,1.89,18,18,0,0,1,.16,2.07C6.85,17.65,5.08,16.85,3.33,16q2.25-.81,4.52-1.54m4-1.25a35.41,35.41,0,0,0,1.55,7.18l0,0c-1.35-.53-2.68-1.1-4-1.66h0a6.83,6.83,0,0,0-.84-4.53c1.09-.34,2.18-.69,3.27-1M16.08,12c1.35,3.55,2.55,7.12,3.71,10.75-1.93-.67-3.83-1.39-5.73-2.13a.32.32,0,0,0,.19-.36A34.67,34.67,0,0,0,12.47,13c1.2-.35,2.4-.68,3.61-1m4.29-1c1,4.32,2,8.69,3.05,13-1-.3-1.93-.65-2.89-1a.37.37,0,0,0,.11-.4A56.35,56.35,0,0,0,16.7,11.89c1.22-.31,2.44-.62,3.67-.9M81.61,4.43c.19,1,.4,1.89.59,2.84a58.12,58.12,0,0,1-4-4.31c1.15.47,2.29,1,3.43,1.47m20.07,14.69a21.45,21.45,0,0,0-2.19-5.7c.69.39,1.39.76,2.07,1.16.37,1.12.78,2.22,1.21,3.3.13.33.69.1.58-.23-.28-.84-.58-1.69-.9-2.54,1,.59,2,1.17,2.91,1.77-1.22.76-2.45,1.5-3.68,2.24M98.6,21a66.7,66.7,0,0,0-2.45-9.38c.76.41,1.52.81,2.27,1.23.92,2.24,1.67,4.5,2.48,6.79L98.6,21m-2.83,1.65c-1.06-4.48-2.52-8.93-4-13.32,1.21.62,2.41,1.25,3.61,1.89.9,3.35,1.64,6.72,2.46,10.08a.31.31,0,0,0,0,.1l-2.17,1.25M92,24.79C90.28,18.87,88.6,13,87.26,7c1.2.58,2.4,1.17,3.59,1.77,1.25,4.77,2.48,9.64,4.13,14.29l-3,1.71m-4.46,2.49Q85.06,16,82.29,4.73q2.08.93,4.15,1.9a90.35,90.35,0,0,0,4.69,18.63l-3.64,2m-4.62-2.72a19.43,19.43,0,0,1,.76,4.5.35.35,0,0,0,.1.26c-.81.44-1.62.89-2.43,1.32a37.94,37.94,0,0,1,1.57-6.08m1-2.63a1,1,0,0,0-.43-1.28.83.83,0,0,0-.83-1.11l-.51,0A76.24,76.24,0,0,0,79.7,8.8c.81.12,1.61.22,2.41.35a.7.7,0,0,0,.46-.09c1.28,6.26,2.61,12.5,4,18.71-.73.41-1.47.79-2.2,1.19a11.06,11.06,0,0,0-1.21-5.28c.22-.59.45-1.17.7-1.75m-6.48-2c-.75-4-1.88-7.92-3-11.82,1.55.18,3.11.37,4.66.59.74,3.63,1.56,7.24,2.19,10.9-1.31.08-2.6.2-3.89.33m-3.64.44c-1.13-4.23-2.31-8.45-3.5-12.67,1.16.11,2.31.21,3.47.34.85,4,1.69,8.06,2.86,12-1,.1-1.89.24-2.83.37m-5,.83c-.22-4.52-1.7-9.37-2.91-13.84,1.25.08,2.5.17,3.75.28,1.1,4.28,2.21,8.57,3.37,12.84-1.42.21-2.82.45-4.21.72m-4.22.89a.31.31,0,0,0,0-.19c-1.12-5-2.7-9.79-3.77-14.78,1.45.05,2.9.11,4.35.2.73,4.61,1.34,9.71,3,14,0,0,0,0,0,0-1.21.24-2.42.5-3.62.77m-4.82,1.24a.38.38,0,0,0,.2-.44A112.87,112.87,0,0,1,56.07,7.06c1.35,0,2.71,0,4.06.06.6,5,1.62,10.52,3.72,15.07a.18.18,0,0,0,0,.07c-1.41.33-2.81.7-4.21,1.09M54.2,25c-1-6-2.31-12-3.67-17.88,1.62,0,3.24-.07,4.86-.07a54.6,54.6,0,0,0,3.75,16.15.31.31,0,0,0,.32.2c-1.76.5-3.52,1-5.26,1.6m-3.81,1.3C48.74,20,46.66,13.72,44.87,7.4c1.68-.11,3.35-.19,5-.25,1,6,2,12.18,3.42,18.15-1,.32-2,.66-2.93,1m-5,1.9c.5-3.11-1.35-7.4-2.11-10.43-.85-3.35-1.65-6.72-2.67-10,1.2-.11,2.41-.23,3.62-.31a166.43,166.43,0,0,0,5.34,19.17c-1.18.43-2.35.89-3.52,1.35a.43.43,0,0,0-.66.25m-4,1.66c-1.66-7.23-3.56-14.51-5.79-21.59,1.48-.18,3-.35,4.45-.49.72,4,1.72,7.89,2.65,11.81.6,2.55.82,6.46,2.19,8.8-1.17.48-2.34,1-3.5,1.47M34,33.27c-3-7.73-5.38-15.56-7.69-23.52,1.15-.22,2.31-.42,3.47-.61,1.75,7.41,3.63,14.85,6,22.08.25.78,1.49.49,1.25-.31C34.88,23.6,32.56,16.35,30.44,9c1.48-.23,3-.45,4.45-.64,1.49,7.36,3.37,14.74,5.44,22Q37.14,31.74,34,33.27m-6.08,3c-1.76-8.56-4.29-17.1-6.77-25.48,1.5-.34,3-.66,4.51-.95a118.36,118.36,0,0,0,6.87,22.9.44.44,0,0,0,0,.5l.33.55q-2.46,1.2-4.9,2.48M24,38.41c-.59-2.78-1.26-5.58-2-8.32l2.18-3.3c.88,3.37,1.82,6.71,2.88,10l-3,1.63m-3.28,1.8A14,14,0,0,0,19,34.46l2.46-3.71c.52,2.68,1.11,5.37,1.8,8-.88.47-1.75,1-2.62,1.45m-.84.47-2.49,1.41A8.51,8.51,0,0,0,16,39l2.55-3.84a27.4,27.4,0,0,1,1.28,5.49m-7.92,4.54,3.71-5.61a8.86,8.86,0,0,1,.64,1.67,9.77,9.77,0,0,1,.21,1.3q-2.3,1.31-4.56,2.64',
|
|
arrow20:'M.13,7C6.67,16,15.2,23.84,24,30.62c7.29,5.64,16.44,13.14,25.95,14.62-2.1.42-4.24,1.17-6.18,1.64a.79.79,0,0,0-.54,1c.64,2.58,1.13,5.2,1.79,7.78a.6.6,0,0,0,.23.33.73.73,0,0,0,1,.75A201.1,201.1,0,0,1,70.3,50.3a.81.81,0,0,0,.56-1l-.06-.15a14.46,14.46,0,0,0,5.27-2.6.48.48,0,0,0,.18-.44c.22,0,.49-.17.41-.43q-.47-1.53-1-3.06a1.4,1.4,0,0,0,.16-.2.23.23,0,0,0-.31-.32h0c-.82-2.39-1.72-4.75-2.66-7.09l.17-.1c.31-.17,0-.62-.28-.47l-.09,0c-.51-1.27-1-2.52-1.57-3.77a.25.25,0,0,0-.14-.34Q70,28.21,69,26.05c-.13-.3-.27-.73-.44-1.2l.19-.09c.27-.14.08-.61-.21-.5l-.17.08c-.43-1.14-1-2.36-1.93-2.63a2.22,2.22,0,0,0-.45-.07l.36-.12a.26.26,0,0,0-.14-.51,84.55,84.55,0,0,1-9.79.75.27.27,0,0,0-.26,0l0,0a.53.53,0,0,0-.21.11,31.39,31.39,0,0,0-5.85,3.51.35.35,0,0,0,0,.55.8.8,0,0,0,0,.66c.55,1.16,1.13,2.31,1.73,3.45-3.57-1.14-7-3.77-10.12-6.58a.27.27,0,0,0-.33-.31h0c-1.79-1.65-3.46-3.35-4.94-4.84A51.9,51.9,0,0,1,24.73.93.83.83,0,0,0,23.45.6c-2.68-.07-5.27-.37-8-.6-.7-.06-.74,1-.16,1.16a16.62,16.62,0,0,0,8.06.45c.32.84.68,1.66,1.05,2.47a54.32,54.32,0,0,0-6.64.46c-.55.09-.4,1,.13,1a57.16,57.16,0,0,0,6.88-.65C25.37,6,26,7.14,26.64,8.26A38,38,0,0,0,20.57,9a.43.43,0,0,0-.29.58A89.44,89.44,0,0,1,14.54,1s0,0,0,0A.54.54,0,0,0,14,0,52.72,52.72,0,0,0,.84,5.15.68.68,0,0,0,.48,6,.71.71,0,0,0,.13,7m29.46,5.73a43.83,43.83,0,0,0-6,1c-1.1-1.28-2.17-2.58-3.19-3.94a.37.37,0,0,0,.24.09,40.36,40.36,0,0,0,6.31-1c.8,1.33,1.69,2.61,2.6,3.86m2.8,3.51a15.8,15.8,0,0,0-5,1.18.39.39,0,0,0-.19.19c-1-1-1.94-2-2.87-3.07A51.27,51.27,0,0,0,30,13.23c.77,1,1.58,2,2.42,3m3.4,3.65a14,14,0,0,0-5,1.26h0c-1-.95-2-1.93-3-2.93,1.07-.2,2.12-.59,3.19-.83.7-.16,1.41-.25,2.12-.36.87,1,1.77,1.93,2.71,2.86m3.72,3.59a36.85,36.85,0,0,0-4.78,1c-1.07-.87-2.12-1.77-3.15-2.69.83-.23,1.64-.54,2.48-.74s1.66-.32,2.5-.44c.92.9,1.91,1.87,2.95,2.83m3.35,2.91a22.22,22.22,0,0,0-4.19,1.16c-1-.75-2-1.51-3-2.29a45.16,45.16,0,0,0,4.55-1.14c.86.78,1.74,1.54,2.66,2.27m4.36,2.95a22.42,22.42,0,0,0-4.2,1.2c-1.15-.76-2.3-1.52-3.42-2.32a36.3,36.3,0,0,1,4-1.27,30.67,30.67,0,0,0,3.63,2.39M52,31.15c-1.59.61-3.17,1.23-4.78,1.74A.55.55,0,0,0,47,33c-1-.6-2-1.21-3-1.84,1.37-.42,2.73-.89,4.12-1.27l.09-.05A15.71,15.71,0,0,0,52,31.15m4.56,6.77c-2-.9-4-1.89-5.88-2.92.68-.28,1.32-.65,2-.89a10.52,10.52,0,0,1,1.22-.34c.83,1.42,1.69,2.81,2.63,4.15M48,33.55c1.53-.71,3.1-1.35,4.66-2,.31.57.64,1.12,1,1.67a8.38,8.38,0,0,0-3.4,1.11.4.4,0,0,0-.18.32c-.68-.37-1.37-.72-2-1.11M58.61,22.88c-1.28.69-2.56,1.43-3.75,2.22L52,25.36a39.52,39.52,0,0,0,4-2.71.56.56,0,0,0,.28.13,17.86,17.86,0,0,0,2.32.1m4.63-.5c-1.12.55-2.17,1.27-2.83,1.67a.59.59,0,0,0-.3.56H60a.44.44,0,0,0-.32,0l-2.85.27c1.14-.66,2.26-1.38,3.33-2.1a23.57,23.57,0,0,0,3.13-.44M68,26.88c-1.83.92-3.69,1.83-5.47,2.84-.55-1.21-1.12-2.41-1.7-3.61a.89.89,0,0,0,.39-1,8.46,8.46,0,0,1,5.28-1.56l.61,1.36c-1.67.72-3.33,1.45-5,2.13a.52.52,0,1,0,.4.95c1.62-.85,3.26-1.66,4.88-2.49.19.41.38.82.56,1.23a1.11,1.11,0,0,0,.07.16m1.73,4a52.47,52.47,0,0,0-5.29,2.83l-.08.07c-.47-1.08-1-2.15-1.44-3.23,1.81-.94,3.58-2,5.35-3.06.49,1.13,1,2.26,1.46,3.39m3.7,8.75c-1.87.75-3.77,1.46-5.6,2.32q-1.55-3.75-3.16-7.46a.53.53,0,0,0,.2,0,50.62,50.62,0,0,0,5.12-3c.44,1,.89,2,1.32,3.07l.2.47c-1.7.77-3.42,1.53-5,2.43-.47.27-.06.93.42.72,1.65-.74,3.26-1.66,4.86-2.55l1.67,4m-3.82,6.59a.41.41,0,0,0,.33,0A12.61,12.61,0,0,0,75,43.44c.31.75.62,1.5,1,2.25a.63.63,0,0,0-.55,0c-.88.39-1.67,1-2.52,1.44s-1.62.79-2.44,1.14l-.84-2m-.24-.58c-.39-.95-.79-1.91-1.19-2.86,1.86-.78,3.67-1.72,5.47-2.6l1,2.52A15,15,0,0,1,72.9,44a15.38,15.38,0,0,1-3.25,1.35.44.44,0,0,0-.31.31M1.67,6.49C5.44,4.82,9.23,3.22,13,1.64a1.42,1.42,0,0,0,.05.16C23,19.07,38.86,33.18,57.76,39.7h.09l.32.42c.31.4.91-.11.68-.52-1.68-2.89-3.34-5.75-4.89-8.68a.39.39,0,0,0-.19-.35c-.63-1.21-1.25-2.43-1.84-3.67,2.63-.2,5.25-.42,7.87-.64,1.35,3.78,2.86,7.5,4.4,11.21.78,1.88,5,9.22,4,11s-9.2,2.65-11.48,3.27Q51.39,53.22,46.1,55c-.37-2.27-.85-4.52-1.25-6.79,2.74-.53,5.93-.87,8.35-2.12a.65.65,0,0,0-.33-1.2c-.16,0-.33,0-.5,0a.55.55,0,0,0-.42-.7c-10.51-1.63-20.85-10-29-16.5C15.06,21.37,8.41,14,1.67,6.49',
|
|
arrow21:'M93.88,20.28c-3.14-3.83-9.08-5.72-13.37-8Q71.59,7.68,62.64,3.09a.7.7,0,0,0-1,.29l0,0A21.48,21.48,0,0,0,55.35,0C55-.12,54.62.26,54.6.6A30.32,30.32,0,0,0,55,8c-5.22-.17-10.45-.17-15.69-.15a.22.22,0,0,0-.14,0c-3.36,0-6.73,0-10.09,0-8.58,0-17.57-.74-26.09.33a.36.36,0,0,0-.32.48,2,2,0,0,0-.77-.07.63.63,0,0,0-.55.31,12,12,0,0,0-.83,3.53l-.14-.08c-.21-.13-.47.18-.27.35L.43,13c-.07.69-.12,1.37-.18,2a47.18,47.18,0,0,0-.11,8.32.39.39,0,0,0,.2.32.66.66,0,0,0,.15.4,23.45,23.45,0,0,0,2.43,2.24c.82.74,1.64,1.48,2.5,2.16a.47.47,0,0,0,.76-.19,1.06,1.06,0,0,0,.19-.06.47.47,0,0,0,.37.15c15.75,0,31.52-.64,47.27-.91a8.66,8.66,0,0,0-.18,1.17l-.19-.11c-.22-.12-.47.18-.27.35s.3.22.45.34a12.77,12.77,0,0,0,.25,2.88.33.33,0,0,0,.2.26.46.46,0,0,0,.2.19c1.09.55,2.21,1,3.27,1.63s2,1.33,3.15,1.84h0a.69.69,0,0,0,.79.08C71.87,30.71,82.48,26.79,93,22.34a.7.7,0,0,0,.39-.92.68.68,0,0,0,.47-1.14m-39,11.1c0-.45,0-.91,0-1.37a25.5,25.5,0,0,0,5.51,3c0,.58.08,1.16.13,1.74a16.2,16.2,0,0,0-5.62-3.33h0m5.34-1.1c0,.57.07,1.13.11,1.7-1.83-.87-3.61-1.79-5.37-2.77.05-.46.11-.92.16-1.39,1,.44,1.91.85,2.85,1.3.76.37,1.5.79,2.25,1.16m-4.77-2.89,4.64-.07c0,.65,0,1.3.08,1.94a27.27,27.27,0,0,0-4.72-1.87M1.25,17.88a14.23,14.23,0,0,0,4.29,4,.33.33,0,0,0,.3,0c-.1,1.79-.19,3.58-.24,5.36-.64-.67-1.3-1.33-2-2A25.42,25.42,0,0,0,1.26,23a.54.54,0,0,0-.33-.11c.11-1.68.2-3.36.32-5m.36-4a38.33,38.33,0,0,0,3.95,2.75.35.35,0,0,0,.45-.1c0,.91,0,1.78,0,2.28,0,.79-.08,1.58-.13,2.37a21.73,21.73,0,0,1-4.58-4c.08-.93.16-1.86.26-2.78l.06-.55M4,11.27a19.68,19.68,0,0,1,2.64,2.31A4.62,4.62,0,0,0,6,16.14l0,0a38.38,38.38,0,0,0-4.32-3c.17-1.63.49-3,2.36-1.86M9.38,9.41a22.66,22.66,0,0,0,3.5,2.93,17.13,17.13,0,0,0-4.25.37c-.31.07-.6.12-.87.2-1.08-1-2.7-3.08-4.34-3.94,2,.23,4,.36,6,.44M15,9.5a32,32,0,0,0,4.3,3h-.15c-1.68,0-3.6-.15-5.5-.2a.32.32,0,0,0-.13-.4,34.11,34.11,0,0,1-3.3-2.51c1.59.05,3.18.07,4.78.06m5.79-.1a38.34,38.34,0,0,0,3.3,3.09l-4.32,0a.34.34,0,0,0,0-.53,27,27,0,0,0-3.4-2.53c1.46,0,2.92-.05,4.38-.08m5.77-.1a29.69,29.69,0,0,0,3.87,3.12L25,12.48a.54.54,0,0,0-.07-.13,30.45,30.45,0,0,0-3.13-3l4.69-.08m6.28,0c1.14,1,2.28,2.05,3.46,3l-5.07.06a.32.32,0,0,0-.08-.32,23.7,23.7,0,0,0-3.39-2.8l1.31,0h3.74l0,.05m7.27,0c.58.48,1.16,1,1.71,1.49s1,1,1.44,1.49c-1.87,0-3.74,0-5.61.05-1.16-1.07-2.4-2.07-3.64-3.06l6.1,0m5.84.21c1.21.88,2.44,1.9,3.73,2.73-1.76,0-3.51,0-5.26,0a13.42,13.42,0,0,0-2.12-2.2l-.91-.77c1.47,0,2.94,0,4.41,0a.35.35,0,0,0,.15.22M47,9.3l4.4-.05c.93,1,1.93,2,2.93,3H51.15A30.94,30.94,0,0,0,47,9.3m10,1.43c.54.48,1.07,1.06,1.65,1.52H55.55a.45.45,0,0,0-.13-.29c-.88-.92-1.8-1.86-2.76-2.74l2.48-.06.06,0c.6.54,1.23,1.06,1.83,1.59m3.5,1.53h-.44A.46.46,0,0,0,60,12a9.57,9.57,0,0,0-2.33-2.2,18.83,18.83,0,0,0-1.94-1.37h0c0-.9,0-1.8,0-2.7a36.31,36.31,0,0,0,4.88,3.3,22.77,22.77,0,0,0-.07,3.21m.92-8.09A27.88,27.88,0,0,0,60.69,8a29.58,29.58,0,0,0-5-2.87c0-1.21,0-2.42,0-3.64,1.85.83,3.57,1.89,5.42,2.67a.39.39,0,0,0,.28,0m31.26,16.9h0c-10.62,3-21,8.07-30.72,13.22-.13-1.25-.23-2.51-.34-3.77a.43.43,0,0,0,0-.4c-.09-1-.19-2.06-.28-3.09A.9.9,0,0,0,61,25.62a.63.63,0,0,0-.55-.05c-17.86.21-35.84.34-53.66,1.71l-.06,0c.25-2.52.43-5,.62-7.56.11-1.63,0-2.73,1-4.15,1.3-1.89,1.61-1.48,3.82-1.48,5.32,0,10.64-.07,16-.11,11-.08,21.95,0,32.91-.28a.74.74,0,0,0,.43-1.31c0-.72,0-1.83,0-2.94a.45.45,0,0,0,.19-.83.71.71,0,0,0-.14-.1c.1-1.37.34-2.58.89-2.87,1.56-.82,2.57.24,4,1q4.44,2.36,8.9,4.68c5.71,3,12.47,5.55,17.44,9.73',
|
|
figure1:'M13.08,13.37c-4-4.55-18.22-1.82-11.14,3.2,5.35,3.8,12,3.34,17.35,7.15,1-5,1.56-19.61-3.87-22.89-6.64-4.42-3.68,10-2.34,13',
|
|
figure2:'M36.13,39.29C29,32,3.5,26,.19,40.22-.92,45,3,48.74,6.35,51.38,20,62.27,39.79,61.92,54.48,71.4c.69.45,1.15-.75,1.25-1.2,3.92-19,7-60-15.19-69.5C24.87-6,34.05,37.84,36.78,43.21c1.15,2.27,1.89-1.91,1.55-2.9-2.06-6.1-10.38-34.39.5-34.25C57,6.28,55.54,43.76,55,55c-.14,3.2-.48,6.38-.87,9.56-.36,2.91-6.86-2.44-10-3.78C33.09,56.07,21.05,54.65,10.24,49c-12.09-6.26-5.84-11.54,4-12.94,7.36-1.05,16,.38,21.51,5.52.49.45.83-1.86.37-2.33Z',
|
|
figure3:'M49.27,42.61c-2.21-4.14-.65-7.31-1.35-11.39a28.36,28.36,0,0,0-2.49-7.28C43,18.71,38.52,12.57,33.84,9.16,26.66,3.94,15.5,2.45,9.92,11,2.3,22.78,7.23,35.84,13.2,47.16c7.28,13.79,15.26,29.53,26,41a1.75,1.75,0,0,0,2.48,0c12.1-14,24.32-27.95,35.41-42.77C83.22,37.13,94.25,19.81,89,8.82,79.93-9.93,49,37.73,47,43.66l3.44.47C50.2,29.4,30.68-8,11.79,7.21,4.08,13.4,6,30.34,8.3,38.4c2.14,7.41,7.16,13.93,12.05,19.73C27.87,67.07,34,77,40.18,86.82a1.76,1.76,0,0,0,2.75.35c12.16-14,22-29.62,31.37-45.62C79.47,32.72,92.88,15.06,86.92,4c-4.58-8.51-15.56-1.33-21,2.46-5.22,3.64-9.06,8.33-12.49,13.64-5.2,8-5.81,14.43-7.36,23.57l3.44.47c-1.32-15-7.06-29.54-20-38.07C21.59.81,5.29-2.13,1.37,9.58c-3.5,10.42.33,23,4.47,32.69,3.08,7.22,7.57,13.45,12.43,19.57,3.59,4.53,7.35,9,11.28,13.27,3.7,4,7.94,6.91,10.31,12,.94,2,4,.26,3-1.77C40.45,80.12,36.11,76.6,32,72.64c-6.09-5.93-11.57-13.32-16.51-20.18C9.63,44.28,6.12,34.69,4.25,24.84,3.32,19.94,3,14.39,5.1,9.74,8,3.13,16.72,4.87,22.07,6.43,37.82,11,44.71,29.44,46,44.13c.16,1.83,3.09,2.54,3.44.46,1.07-6.27,1.05-12.34,4.26-18.07C56.71,21.14,60,16,64.63,11.86a48.24,48.24,0,0,1,9.42-6.33C77.29,3.77,83.62,1.09,84.43,9c.45,4.28-1.71,9.28-3.33,13.07C76.88,31.92,70.54,41.18,65,50.32A247,247,0,0,1,40.45,84.7l2.76.35C36.83,75,30.6,64.76,22.82,55.65,14.16,45.52,9.63,35,10.26,21.67c.26-5.53,1.61-12,7.64-13.83s12.14,3.39,16,7.33C41,22.4,46.77,33.89,47,44.13a1.76,1.76,0,0,0,3.44.46c3.21-9.85,12.52-21,19.64-28.26a39.92,39.92,0,0,1,7.68-5.88C87.63,4.36,86,19,84.54,24.25,81.4,35.9,72.4,45.93,65,55.09c-7.66,9.53-15.67,18.78-23.66,28-2.07,2.39-7.57-8-8.83-10C29.26,68,26.25,62.7,23.19,57.43,17.45,47.53,10.9,37.75,9.43,26.14c-.82-6.51,1.9-13.19,7.5-16.67,6.49-4,13.91,1.26,18.18,5.76,4.76,5,9.29,11.85,9.4,18.92.07,3.92-.13,6.73,1.73,10.22,1.07,2,4.09.23,3-1.76Z',
|
|
figure4:'M41.67,68.49c-7.91-.38-11.85-6-16.67-10.34-4.42-4-9.45-7.4-13.63-11.64C5.08,40.12.81,32.34.07,23.3-.58,15.45,3.38,9.7,10.15,5.68c6.17-3.65,12.49-4.54,19-1.51C31.71,5.34,33.92,7.23,36.61,9c1.19-1.11,2.71-2.35,4-3.77C44.74.82,49.86-1,55.59.53a17.74,17.74,0,0,1,13,12.81,26.78,26.78,0,0,1,.79,11.78,32.11,32.11,0,0,1-5.06,11.76C57,47.61,49.23,58,41.67,68.49Zm-1.39-2.75c1-1.47,1.72-2.64,2.54-3.75,2.43-3.26,5-6.42,7.3-9.77,4.59-6.69,9.29-13.33,13.42-20.3,2.31-3.91,4.18-8.36,2-13.19a4.31,4.31,0,0,1-.06-1.65c0-4.79-2.53-8.37-6.12-11-4.23-3.08-9-4-13.66-.76a63,63,0,0,0-7.25,6.33c-1.61,1.53-2.53,2.15-4.63.1-2.45-2.38-4.61-5.69-8.61-6-4.55-.32-8.92,0-13,2.45C5.27,12.47,1.48,21.38,4.41,28.76A54.17,54.17,0,0,0,19,49.24c3.55,3.17,7.15,6.29,10.89,9.22C32.92,60.85,36.22,62.92,40.28,65.74Z M24.2,45.74c2.54-.91,2.54-.91,9,5.49l-1.4,3C28.79,51.54,25.67,49.45,24.2,45.74Z M48.61,47a22.92,22.92,0,0,1-1.71,4.24c-1.21,1.88-2.74,3.55-4.33,5.58l-2.26-1.92,7.07-8.53Z M19.47,41.4c-.73,1-2,1.63-3.45-.14s-2.84-3.58-4.44-5.61l1.51-2Z M17.28,13.11l-7.4,5.22-2.62-1.4c.35-.6.53-1.32.9-1.43,3-.89,5.09-4.3,8.6-3.55C16.93,12.34,17.11,12.72,17.28,13.11Z M36.57,18.83c6.73-7.95,6.73-7.95,9.56-7.49-2.78,3-5.3,5.75-7.9,8.4C38.11,19.86,37.16,19.16,36.57,18.83Z M55.89,35c.45,4.41-2.82,9.15-6.14,9.48C50.25,40.5,52.7,38,55.89,35Z M57.66,9.43c-3.7.3-6.54,1.41-9.89.25C51.65,5.72,53.82,5.55,57.66,9.43Z M61.8,20.62a5.24,5.24,0,0,1-1.09.78,5.11,5.11,0,0,1-1.51,0c-.32-2.82-.65-5.68-1-8.72,2.44-.78,2.75,1.09,3.07,2.54A47.9,47.9,0,0,1,61.8,20.62Z M10.73,22c.2,2.52.37,4.71.57,7.36L8.6,30.76C7.66,23.19,7.86,22.44,10.73,22Z M60.89,25.51c.44,3.81-1,6.83-3.5,8.1C56.2,31.08,57.3,28.34,60.89,25.51Z M27.26,12.12c-3,1.31-7.3.43-8.87-1.58C23.16,9.32,24.68,9.57,27.26,12.12Z M41.48,58.1c-1.74,1.23-3.17,2.42-3.29,2.29A62.17,62.17,0,0,1,34,55.45C38.09,53.82,38.35,57.5,41.48,58.1Z M36,16.11l-1.65,3.38-5.54-6C31.92,12.82,33.32,15.66,36,16.11Z',
|
|
figure5:'M47.28,28.2c-.07-.49-.2-1-.3-1.47a25.32,25.32,0,0,0-.9-2.84,16,16,0,0,0-3.15-5.19l-.56-.54-.28-.27-.3-.25-.61-.5c-.17-.13-.35-.23-.53-.36a9.85,9.85,0,0,0-1.07-.65L39.29,16a8,8,0,0,0-.76-.33c-.32-.11-.68-.25-1.08-.38L36.2,15,35,14.71c-.4-.08-.76-.11-1.06-.15a3.38,3.38,0,0,0-.92-.07,6.2,6.2,0,0,0-2.78.24c-.12.1,0,.24.37.41s1.08.35,2.11.65a28.84,28.84,0,0,1,3.71,1.36l.39.17.33.19.56.29A3.6,3.6,0,0,1,38,18l.12.08a6.56,6.56,0,0,1,.93.53l.44.29.22.16.54.43a11.85,11.85,0,0,1,3.09,4.18,10.31,10.31,0,0,1,.52,1.23c.16.43.32.85.44,1.29a16,16,0,0,1,.6,2.62,16.17,16.17,0,0,1-1.78,10.36,14.76,14.76,0,0,1-1.48,2.19,14.44,14.44,0,0,1-1.87,1.88,12.74,12.74,0,0,1-4.59,2.48,3.25,3.25,0,0,1-.63.17l-.63.15-.65.09a4.76,4.76,0,0,1-.65.06l-.65,0c-.22,0-.44,0-.66,0a11.4,11.4,0,0,1-1.3-.11,13.78,13.78,0,0,1-5-1.73,18.43,18.43,0,0,1-7.29-7.73,18.24,18.24,0,0,1-1.73-5.09,15.23,15.23,0,0,1-.07-5.3,13,13,0,0,1,.69-2.53,12.57,12.57,0,0,1,.54-1.18c.09-.2.22-.38.32-.56s.22-.38.35-.55A11.49,11.49,0,0,1,21.7,18a14.25,14.25,0,0,1,3.4-1.44.46.46,0,0,0,.14-.14,1.46,1.46,0,0,0,.27-1.52,1.45,1.45,0,0,0-.91-.64.19.19,0,0,0-.18,0,16.21,16.21,0,0,0-3.94,1.67,13.32,13.32,0,0,0-1.28.83c-.41.3-.81.63-1.2,1a12.59,12.59,0,0,0-1.08,1.11l-.5.59L16,20l-.23.32-.2.33-.39.67-.34.69-.17.35-.14.36-.28.72-.22.73c-.16.49-.24,1-.36,1.49a18.22,18.22,0,0,0,0,6,21.45,21.45,0,0,0,1.83,5.7,21,21,0,0,0,7.91,8.79A17,17,0,0,0,29,48.39a14.31,14.31,0,0,0,6.11-.13,14.87,14.87,0,0,0,5.52-2.58,16.4,16.4,0,0,0,4.11-4.44,18.37,18.37,0,0,0,2.74-11.55C47.44,29.19,47.34,28.7,47.28,28.2Z M24.08,2.61c0,.38.06.79.09,1.19s.08.81.1,1.19,0,.75.05,1.06l.05,1,.25,1a4.94,4.94,0,0,0,.29.94c.33.8.89,1.28,1.33,0a8.37,8.37,0,0,0,.39-1.24c.09-.37.14-.65.14-.65L26.72,6c0-.31,0-.69,0-1.09s-.06-.84-.1-1.27-.07-.87-.1-1.28-.12-.81-.17-1.14C26.19.56,26.12.1,26.11.08L26,0A3.16,3.16,0,0,0,23.8.5c-.05,0-.05,0-.05.06s.07.43.17,1C24,1.89,24,2.23,24.08,2.61Z M40.8,11.4a9.33,9.33,0,0,0,.94-.74l.44-.41.51-.81c.31-.48.72-1.13,1.16-1.76s.88-1.29,1.22-1.77l.58-.84a.47.47,0,0,0,0-.1,3.29,3.29,0,0,0-1.85-1.28c-.06,0-.06,0-.07,0l-.58.83c-.34.48-.78,1.13-1.22,1.78l-.64,1c-.19.31-.38.59-.54.84l-.52.83-.1.28c-.06.17-.13.4-.2.63a4.31,4.31,0,0,0-.23.89C39.52,11.52,39.75,12.18,40.8,11.4Z M49.52,22.09a7.08,7.08,0,0,0,1.17.15h.6L52.2,22c.55-.14,1.28-.33,2-.48s1.47-.34,2-.4l.93-.15a.35.35,0,0,0,0-.11,3.34,3.34,0,0,0-.27-2.23c0-.06,0-.06,0-.06l-1,.17c-.61.08-1.35.26-2.1.42s-1.49.35-2,.49l-.91.23s-.42.21-.82.43a3,3,0,0,0-.75.46C48.56,21.26,48.26,21.9,49.52,22.09Z M58.27,35.65c0-.06,0-.06,0-.06l-.81,0-.79-.08-.88-.16-.86-.23-.72-.26a5.09,5.09,0,0,1-.49-.22l-.18-.09-.23,0-.49-.13a6.7,6.7,0,0,0-.7-.18,1.18,1.18,0,0,0-.85.08c-.2.14-.26.43,0,1a3.86,3.86,0,0,0,.65,1,3.27,3.27,0,0,0,.43.44l.23.11.63.29.91.34,1.07.29,1.09.2,1,.1c.56,0,.94,0,1,0a.19.19,0,0,0,0-.1A3.77,3.77,0,0,0,58.27,35.65Z M42.19,56.36c-.14-.23-.3-.48-.46-.77l-.47-.91c-.16-.31-.32-.61-.46-.91s-.26-.57-.36-.81l-.36-.8-.16-.22-.34-.48a3.43,3.43,0,0,0-.52-.65c-.52-.54-1.18-.79-1.25.45a6.52,6.52,0,0,0,0,1.16c0,.17,0,.32,0,.43l0,.16.37.86c.12.26.25.56.39.88s.33.65.5,1l.51,1c.17.31.36.6.51.85l.51.85a.21.21,0,0,0,.11,0,3.58,3.58,0,0,0,1.88-1.24s0,0,0-.07Z M24.44,50.25a4.7,4.7,0,0,0-1,.82,5.06,5.06,0,0,0-.45.49l-.12.27c-.08.17-.2.4-.32.7s-.25.64-.4,1-.26.78-.39,1.18l-.32,1.19L21.21,57C21.1,57.58,21,58,21,58a.31.31,0,0,0,.09.07,3.3,3.3,0,0,0,2.22.35c.06,0,.06,0,.07,0s.07-.4.17-1c.06-.28.13-.61.21-1s.19-.7.29-1.06a17.35,17.35,0,0,1,1.05-2.74s.49-1.76.43-1.72C25.7,50.23,25.56,49.46,24.44,50.25Z M12.85,40a10.51,10.51,0,0,0-1.25.71l-.44.29-.18.11L8.2,43.81l-1,1-.88,1-.9,1a.42.42,0,0,0,0,.12,2.76,2.76,0,0,0,1.73,1.44c.06,0,.07,0,.08,0L8,47.42l.81-.88,1-1,2.75-2.68.22-.3c.12-.19.28-.45.45-.7a7,7,0,0,0,.56-1C14.26,40,14.24,39.24,12.85,40Z M6.74,31.71,7,31.6l.61-.28a2.9,2.9,0,0,0,.82-.43c.69-.46,1-1.08-.28-1.3A8.82,8.82,0,0,0,7,29.39l-.61-.05-.94.16-1,.13-1.11.11-1.1.07h-1c-.57,0-.95,0-1,0a.26.26,0,0,0-.05.09,3.24,3.24,0,0,0-.16,2.25c0,.06,0,.06,0,.06s.46,0,1.09,0H2.33l1.2-.06L4.72,32l1-.15Z M7.29,11.94c.5.5,1.18,1.15,1.87,1.79l1,.93.94.78c.56.45.95.73.95.73l.33.17.74.33a4.25,4.25,0,0,0,1,.37c1,.23,1.66,0,.71-1.13-.27-.35-.59-.77-.86-1.08-.13-.15-.24-.28-.33-.37l-.12-.16-.89-.67-.88-.74c-.33-.28-.66-.59-1-.89-.67-.62-1.34-1.27-1.84-1.77l-.86-.85A.22.22,0,0,0,8,9.4,2.85,2.85,0,0,0,6.43,11c0,.06,0,.07,0,.08Z M53.8,47.17l-.59-.47-.64-.57-.63-.58c-.19-.19-.37-.38-.53-.53l-.51-.52s-.32-.18-.63-.38a2.8,2.8,0,0,0-.63-.33c-.59-.23-1.26-.18-1,.87a5.37,5.37,0,0,0,.28,1,2.72,2.72,0,0,0,.21.46l.55.57.57.58.69.63.7.64.65.52.65.53.09,0a4.35,4.35,0,0,0,1.36-1.8c0-.06,0-.06,0-.07Z',
|
|
figure6:'M49.09,16.61c-.42-.09-1-.19-1.8-.28-1.28-.19-2.84-.35-4.09-.46l-1.57-.1-.62,0-1.14.05c-.38,0-.76,0-1.14.08l-1.3.13c-.44,0-.87.12-1.3.18s-.86.12-1.29.21l-1,.22h0l-.32-.74-1-2.31a97.51,97.51,0,0,1-3.82-9.25L28,2.45c-.19-.62-.34-1.25-.51-1.88a.76.76,0,0,0-.14-.16c-1.33-.95-2,0-2.18.58a.22.22,0,0,0,0,.17h0c-.18.28-.4.62-.64,1s-.67,1.2-1,1.84-.64,1.28-.89,1.86S22.18,7,22,7.34s-.24.58-.24.58l-.67,2.13c-.29.92-.57,1.86-.9,2.75l-.47,1.36-.54,1.32c-.19.44-.35.89-.55,1.32L18,18.09c-.29.61-.2.42-.21.46H16.9c-.5,0-1,0-1.5,0s-1,0-1.5.07c-1,.08-2,.15-3,.28-2,.22-3.91.51-5.84.77l-2,.26-2,.23a.83.83,0,0,0-.17.12,1.57,1.57,0,0,0-.56,1.17A1.31,1.31,0,0,0,0,22.75c0,.1,0,.12.06.16.89,1.05,1.87,2,2.85,3A36.7,36.7,0,0,0,11.64,32l1.21.59c.41.18.85.32,1.27.49l.08,0v0l-.07.56c-.23,1.68-.5,3.38-.76,5.08l-.29,1.9s-.15,1.7-.21,3.38a21.23,21.23,0,0,0,0,3.2,11.05,11.05,0,0,0,.27,1.82,2.3,2.3,0,0,0,.4.91.11.11,0,0,0,.15,0,1.45,1.45,0,0,0,1.33.29c.1,0,.11,0,.15-.07L18,47.37c1.68-1.57,3.34-3.19,5.09-4.68.87-.77,1.73-1.54,2.64-2.25L27,39.34l.24-.2s0,0,0,0L29.68,41c.46.35.92.73,1.4,1.07l1.43,1,2.85,2c.55.39.79.55,1.13.78l1,.65,2.9,1.7c.71.43,1.45.8,2,1.09a5.73,5.73,0,0,0,.81.39c1.53.74,2.77,1.19,2.68.78a5.79,5.79,0,0,0-.49-2.63C45,46.64,44.42,45.16,44,44l-.8-2-1-2a52.87,52.87,0,0,1-2.32-5.54A28.81,28.81,0,0,1,39,31.62c-.12-.48-.22-1-.31-1.44v-.09h0l.59-.44.62-.5c.41-.33.82-.68,1.21-1,.79-.7,1.54-1.42,2.28-2.16,1.47-1.48,2.86-3,4.23-4.57.88-1,1.75-2,2.61-3.05a.58.58,0,0,0,.05-.2C50.33,16.89,49.67,16.6,49.09,16.61Zm-3.26,3.18c-1.49,1.71-3,3.38-4.61,4.95-.8.78-1.62,1.54-2.46,2.25-.42.35-.85.7-1.29,1l-1.19.86c-.06.05-.12.08-.17.13l0,.21.07.42.13.84a34.93,34.93,0,0,0,2,6.82c.44,1.09.91,2.15,1.4,3.2l.59,1.23.51,1.05,1.66,2.9c.82,1.43,1.59,2.83,1.55,2.7l.52.86-.69-.57c-.49-.41-1-.86-1.6-1.29s-1.08-.89-1.57-1.27l-1.68-1.34-2-1.35-2.87-2.06c-1-.69-1.93-1.36-2.84-2.09l-3-2.31-.7-.55-.36-.27s-.06-.07-.09-.05l-.08.07-.17.14-1.29,1.05L24.3,38.47c-.46.38-.93.75-1.38,1.14L21.57,40.8C19.75,42.35,18,44,16.28,45.65l-2.14,2.16c0-.14,0-.29.07-.45.21-1.25.5-2.76.75-4l.45-2.09.32-2.18c.26-1.7.54-3.4.77-5.13l.1-.75L16.74,32l0-.31,0-.16s0,0-.05,0l-.07,0-.61-.23L15,30.82c-.38-.15-.77-.28-1.14-.44l-1.11-.53a34.57,34.57,0,0,1-8.11-5.73C4,23.56,3.44,23,2.89,22.41l.52-.06,2-.26c2.17-.29,4.33-.62,6.46-.85.53-.07,1.06-.09,1.59-.14l.8-.07.8,0c.53,0,1.06-.06,1.59-.05h2.67s0-.05.06-.07l0-.09.35-.73.47-1L21,17.57,21.59,16c.21-.52.42-1,.6-1.56l.55-1.58c.18-.52.33-1.05.5-1.57L24,9s.09-.42.25-1,.38-1.4.59-2.19.48-1.54.65-2.1c.08-.28.15-.5.2-.65a.5.5,0,0,0,0,.13l.61,2a99.2,99.2,0,0,0,3.91,9.48l1,2.3.7,1.58.25.58.13.29,0,.07h.08l.15,0,1.25-.26,1.43-.31c.4-.08.8-.13,1.2-.19s.81-.14,1.22-.18l1.22-.11c.61-.08,1.24-.08,1.86-.12l.28,0,.74-.07c.62,0,1.44-.12,2.26-.16,1.64-.11,3.27-.21,3.13-.24.17,0,.35,0,.51-.06C47.09,18.34,46.47,19.07,45.83,19.79Z',
|
|
figure7:'M63.16,23.74l-.25,0L59,23.28l-5.67-.62c-1.28-.16-2.57-.24-3.85-.35-1.72-.13-3.43-.28-5.13-.4-.12-.46-.24-.92-.37-1.38l-.25-1-.29-.94-.57-1.88c-.39-1.26-.86-2.5-1.28-3.76l-.74-1.86c-.25-.62-.47-1.25-.76-1.86-.56-1.22-1.07-2.46-1.73-3.65-.31-.61-.62-1.21-.94-1.81l-1.3-2.17L35.64.79,35.39.36,35.26.15s-.07-.23-.14-.11L33.64,1.37,32.92,2l-.37.37-.74.75a41,41,0,0,0-5,6.66A76,76,0,0,0,21.32,21l-1.19,0-6.88-.08-8.68,0H.88a.56.56,0,0,0-.19.1c-1.27,1-.5,1.91,0,2.26a.23.23,0,0,0,.16.05H5.63c.16.35.37.76.64,1.27l.47.91c.17.3.36.61.54.91.37.62.75,1.22,1.08,1.75s.66,1,.88,1.3l.36.51.63.75c.2.24.44.54.73.87l2,2.25c.9.91,1.81,1.85,2.78,2.77-.45,1.3-.89,2.61-1.34,3.91s-.91,2.59-1.39,3.87c-.24.64-.49,1.27-.73,1.91l-1.5,3.64L10,51.79c-.06.11,0,.14.06.07l.24-.1.47-.21.95-.41,3.73-1.61c1.27-.57,2.56-1.09,3.81-1.68q3.32-1.6,6.55-3.3l.66.44A90.54,90.54,0,0,0,37.94,51.2c1,.45,2.05.93,3.1,1.37s2.11.88,3.19,1.31l2,.75,1.61.62.81.31.21.08s.17.1.13,0l0-.43-.15-3.33c0-.59-.05-1.19-.09-1.78-.29-4.75-.78-9.61-1.53-14.56-.14-.94-.3-1.89-.46-2.84L47.88,32l3.47-1.93c1.16-.63,2.29-1.31,3.47-1.89l5.51-2.84,1.74-.89.87-.45.43-.22A1,1,0,0,0,63.16,23.74ZM26,41.75c-1.46-1-2.86-2-4.18-3.09-1.15-.91-2.24-1.85-3.27-2.79.87-2.58,1.73-5.15,2.63-7.69.57-1.59,1.15-3.17,1.76-4.73l3.09.07c2.35,0,4.73.13,7.14.23l3.63.14,3.66.2,2,.12c.59,2.41,1.1,4.83,1.54,7.23-3.2,1.85-6.4,3.74-9.62,5.6-2.33,1.32-4.64,2.7-7,4Zm1.44-28.24A46.93,46.93,0,0,1,31.66,7,31.34,31.34,0,0,1,34.2,4.15l.41-.42h0l.18.31a64.34,64.34,0,0,1,6,13.94c.39,1.26.75,2.51,1.09,3.77-5-.31-9.88-.49-14.65-.62l-3.31-.08A81.31,81.31,0,0,1,27.44,13.51ZM14.28,31.63,12.75,30c-.06-.07-.13-.14-.18-.21l-.32-.38-.6-.72s-.28-.31-.71-.76-1-1.07-1.5-1.69L8,24.52a4.54,4.54,0,0,0-.57-.67l-.5-.56,5.39,0,8.08.09c-.18.48-.37,1-.54,1.44C18.7,27.89,17.66,31,16.63,34,15.81,33.23,15,32.43,14.28,31.63Zm6,13.07c-1.2.59-2.4,1.21-3.64,1.72l-2.12.92s0,0,0-.1l.66-1.73.71-1.92c.63-1.76,1.23-3.51,1.82-5.26A74.93,74.93,0,0,0,23.63,43ZM46,46.49c.11,1.15.17,2.3.25,3.44,0,.57.08,1.13.1,1.7l0,.42v.08h0l-.78-.3c-1-.38-2-.82-3-1.23a102,102,0,0,1-11.23-5.5c-1-.6-2.05-1.21-3-1.84,1.89-1,3.77-2.06,5.62-3.14,2.37-1.34,4.71-2.72,7-4.08L44.47,34C45.17,38.21,45.67,42.4,46,46.49ZM48.22,29l-2,1.13q-.56-2.9-1.24-5.8l2.9.23,3.77.3,3.51.38h0C52.82,26.45,50.54,27.76,48.22,29Z',
|
|
label1:'M207.88,23.26l15.56,2.2c.19.38.48.94,1.13,2.2a20.4,20.4,0,0,1-3.49,2.7C209.54,36,198.11,42,186.31,47.11,177.79,50.78,169,54.26,159.89,56s-18.5,3.95-27.9.65a43.74,43.74,0,0,1-21-14.93c-4.47-5.87-9.78-11-17-13.4A19.89,19.89,0,0,0,86,27c-10.55,1.13-21,2.94-30.63,7.76-8.67,4.37-17.17,9.11-25.55,14C26,51,22.61,54.1,19,56.74a21.37,21.37,0,0,1-3.14,1.56c-1.87-6.52.66-12,1.69-18.08H.69c-1.31-2-.58-3.29.74-4.33,3.54-2.77,7-5.67,10.7-8.21A192.48,192.48,0,0,1,40,11.38a132.76,132.76,0,0,1,31.64-10A67,67,0,0,1,87,.05c12.64.58,24.22,4.12,33.83,12.85,3.59,3.26,7,7,11.19,9.24,5.76,3.15,11.88,5.87,18.75,6.17a53.08,53.08,0,0,0,23.65-4.43c8.11-3.46,16.39-6.52,24.52-9.92,3.29-1.37,6.35-3.28,9.62-4.71,1.09-.48,2.49-.25,3.93-.35C210.92,13.87,209.53,18.18,207.88,23.26ZM208.26,12c-5.83,2.5-11.26,4.69-16.58,7.14a213.61,213.61,0,0,1-23.46,9.45A44.47,44.47,0,0,1,147,30.27c-10.58-1.74-18.9-7.87-26.83-14.74-5.1-4.42-10.44-8.75-17.29-10.37-2.49-.59-5-1.08-7.51-1.6a55.85,55.85,0,0,0-24.21.12C66.6,4.73,61.88,5.51,57.51,7.2,49.2,10.4,41,14,32.93,17.76A88,88,0,0,0,21,24.68c-5.31,3.58-10.39,7.5-15.56,11.26l.33,1c1.4.16,2.81.25,4.2.48,3.2.55,7-2,9.86,2.26-.61,4.13-1.27,8.65-2,13.46,7.16-4.17,14-8,20.62-12C47,36,55.65,31.08,65.36,28.6c6.68-1.71,13.48-3,20.26-4.19a12.16,12.16,0,0,1,5.82.2c8,2.73,15,7.12,20.14,14.11A36.4,36.4,0,0,0,118,45.28a105.37,105.37,0,0,0,9.45,6.57c5.67,3.66,12.15,3.67,18.56,3.79a32,32,0,0,0,5.73-.69c3.9-.64,7.84-1.18,11.69-2.09,2.33-.56,4.49-1.81,6.77-2.62,5.28-1.87,10.74-3.33,15.85-5.57,8.32-3.65,16.44-7.74,24.59-11.77,3-1.49,5.82-3.32,8.56-4.9-4.39-2.94-10.6.9-14.21-4.21C206.08,19.81,207.14,16,208.26,12Z',
|
|
label2:'M3.24,45.05C4.61,41.47,6,37.89,7.41,34.17c-2.95.52-3.8,3.93-6.52,5L0,37.79a89.32,89.32,0,0,1,5-8.94c3.63-5.11,7.71-9.83,13.3-13,2.56-1.46,4.72-3.63,7.29-5.06,4.34-2.42,9-4.31,13.27-6.77C44.11,1,50,.85,55.67.09c2.94-.39,6,.61,9.08.77,6.89.37,12.59,3.71,18,7.39,2.56,1.72,4.62,4.21,6.83,6.43,4.6,4.62,8.4,10.07,14.06,13.6,5,3.08,9.93,2.88,15,.2,1.85-1,3.66-2,5.56-2.92a8.56,8.56,0,0,1,2.65-.19l-5.36,10.37.39.52c2.75-.92,5.54-1.77,8.24-2.81,1.58-.6,2.94-.85,4.35.79a14.48,14.48,0,0,1-1.27,1.92c-3.71,4.08-7.33,8.26-11.25,12.13-1.76,1.74-4.12,2.91-6.27,4.25-2.39,1.49-4.79,3-7.29,4.28-5.44,2.82-10.86,6.12-17,6.58a117.68,117.68,0,0,1-19.23-.2c-5.39-.49-10.37-2.3-15.42-3.86a25.24,25.24,0,0,1-11.87-8.06A139.17,139.17,0,0,0,34,39.48c-2.9-2.71-6.57-4.61-10.79-4.36a18.37,18.37,0,0,0-10.11,4.25c-1.92,1.49-3.55,3.34-5.48,4.82a15.62,15.62,0,0,1-3.55,1.57ZM122.39,29.93l-.52-.48a22.48,22.48,0,0,1-3.07,1.34c-2.82.79-5.76,2.26-8.5,2-3-.31-6-2-8.72-3.59-5.91-3.59-9.34-9.78-14.38-14.31-1.69-1.53-3-3.52-4.89-4.75-4.57-3-9.26-5.85-14.7-7.21S56.9,1.65,51.53,2.05a27.14,27.14,0,0,0-7.79,2C40.07,5.49,36.58,7.41,33,9,27.28,11.56,22.46,15.44,17.39,19A39.6,39.6,0,0,0,4.85,33.81C6.2,33,7.23,32.26,8.34,31.7s2.27-1.6,3,.32c-2.4,3.25-4.7,6.42-5,10.55a3.37,3.37,0,0,0,1.29-.91,29.84,29.84,0,0,1,13.91-8.25A6.47,6.47,0,0,1,24,33.05a17.82,17.82,0,0,1,8,2.5,33.2,33.2,0,0,1,8.6,7.66,91,91,0,0,0,8.8,9.54c4.31,4.35,10.24,5.41,15.74,7.09,5.87,1.79,12.06,1.89,18.17,2.12a30.33,30.33,0,0,0,6.37-.52,39.58,39.58,0,0,0,8.28-2c4.19-1.73,8.14-4,12.24-6a51.48,51.48,0,0,0,18.12-14.54c.76-.94,1.39-2,2.4-3.43-4.55,1.06-8.32,4.25-12.37,2C119.81,34.82,121.1,32.38,122.39,29.93Z',
|
|
label3:'M198.73,48.81c0,.48-.09,1-.14,1.51-4.37-2.47-8.47-5.06-12.8-7.18a32.33,32.33,0,0,0-14-3.42c-.21,2-.44,4.08-.66,6.08-5.89-1.25-11.46-2.5-17.08-3.58-2.32-.45-4.73-.49-7.08-.81-2.84-.38-5.65-.92-8.49-1.3-1.27-.17-2.57-.08-3.85-.19-3.59-.31-7.17-.79-10.76-1-8.14-.43-16.28-.89-24.43-1-6.48-.1-13,.1-19.46.55-4.45.31-8.83,1.45-13.27,1.91a104.35,104.35,0,0,0-20,4.22c-1.4.43-2.75,1-4.37,1.6C41.84,36,38.73,26.79,34.86,18c6-4.69,11.54-9,14.66-15.92-2.74.45-5.41.65-8,1.34C36.73,4.71,32,6.23,27.2,7.75c-3.68,1.18-7.33,2.44-10.95,3.81C12,13.17,7.84,15,3.57,16.59c-1.39.51-1.45,1.21-.94,2.23,2.53,5.11,3.59,10.68,5.15,16.1C8.4,37.08,9,39.25,9.62,41.53,19.29,38.46,28.77,35,38.71,33c-2,1.89-4.77,1.68-7.15,2.54S26.5,37.22,24,38.06s-5.13,1.63-7.67,2.56-4.93,2-7.9,3.15c-.1-1.29.2-3.13-.35-3.43-1.78-1-1.06-2.56-1.45-3.84-1.34-4.34-2.61-8.71-4-13A17.2,17.2,0,0,0,1,20c-.61-1-1.41-2-.82-3.28a4.24,4.24,0,0,1,2.71-2.24c4-1.4,7.78-3.25,11.76-4.59Q23.82,6.86,33.1,4.28C38.36,2.82,43.72,1.68,49,.45,50.11.2,51.22.12,52.1,0l2.08,2.19c-1.66,2.44-.58,5.27-.87,8.51,3.23-.32,6.17-.59,9.1-.92,2.27-.25,4.52-.68,6.8-.87,5-.39,10-.79,15.07-1,2.66-.09,5.34.27,8,.42.26,0,.51,0,.77,0,5.69,0,11.38-.13,17.05.12s11.41.91,17.11,1.4c4.09.35,8.21.57,12.28,1.12,3.31.46,6.54,1.39,9.83,2,3.9.72,7.82,1.29,12,2,.48-3.47,1-7.1,1.48-10.69A154.48,154.48,0,0,1,212.8,23.63a6.87,6.87,0,0,1-.67,2.13,79.75,79.75,0,0,0-10.35,20.15,10.45,10.45,0,0,0-.42,1.45c-.32,1.56-1.19,2.1-2.7,1.52,1.41-5.69,4.29-10.75,6.89-15.94,1.46-2.93,3.12-5.76,4.89-9-14.16-7.87-28.72-14-44.81-16.89a5.39,5.39,0,0,0,.28,1.82c2.39,3.77,4.65,7.69,8.4,10.29A2.45,2.45,0,0,1,175.5,22c-.49,2.57-.88,5.15-1.4,7.71s-1.18,5.22-1.72,7.64c2.48.7,4.78,1.4,7.1,2A46.29,46.29,0,0,1,190.7,44C193.41,45.56,196.06,47.21,198.73,48.81ZM44.09,44.14a85.47,85.47,0,0,1,17.56-4.25c6.19-.75,12.35-1.83,18.55-2.47,4.33-.45,8.71-.47,13.07-.55,5-.08,10.1-.1,15.14,0,4.45.08,8.9.36,13.35.56l.76.06,15.34,1.42c.68.06,1.38,0,2.06.1,4.72.65,9.45,1.29,14.17,2,2.69.4,5.36.89,8,1.37,2.45.43,4.91.91,7.15,1.33,1.58-7.5,3.06-14.58,4.6-21.88-1-.76-1.95-1.9-3.11-2.24-4.92-1.43-9.87-2.75-14.86-3.88a188,188,0,0,0-26-4.19c-5.49-.46-11-.84-16.5-1-8.39-.29-16.79-.39-25.19-.54-2.59,0-5.19,0-7.78,0-1.56,0-3.12,0-4.66.15-2.66.23-5.33.48-8,.87-3.86.59-7.76,1.07-11.54,2-4.56,1.15-9,2.71-13.49,4.19-1.88.62-3.68,1.51-5.73,2.36C41,27.42,42.35,35.75,44.09,44.14Z',
|
|
label4:'M157.32,33.73c-5,.27-9.75.43-14.5.81-8.77.71-16,5.35-23.29,9.61-6.14,3.57-11.88,8-18.73,10.12-5,1.58-10.06,2.73-15.15,3.88-7.29,1.65-14.75,1.53-22.13,1.14a35.93,35.93,0,0,1-16-4.66,20.87,20.87,0,0,0-4.43-2.37c-2.26-.61-2.68-2-2.63-4,0-1.61,0-3.21,0-5.38-11.21-1.46-21.56,1.31-31.8,5.39l-.33-.64-.41-.83C18,43.29,28.12,40.7,39.32,41a14.3,14.3,0,0,0,1.06-3.56c.31-6.2.48-12.42.65-18.64.06-2.13,0-4.26,0-6.39,0-4.27.22-4.69,3.24-7C37.75,3.48,10.77,11.82,2.7,19.22c3.3.62,6.64.91,9.74,1.93s6.3,2.29,9,5c-2.44,2.41-4.8,4.59-7,6.92-3.66,3.91-7.51,7.69-9.17,13-.18.57-1,.93-1.58,1.39l-.75-.4a7.18,7.18,0,0,1,.61-2.53C6.27,40.71,9,36.82,12,33.12c2-2.52,4.39-4.74,6.71-7.21A33.53,33.53,0,0,0,.46,21.2C.17,21,0,21,0,20.91c0-.8,0-1.59,0-2.46C7.43,13.87,15.1,9.89,23.66,7.84c3.54-.85,7-2.06,10.48-3.06a10.58,10.58,0,0,1,2.61-.45,22,22,0,0,0,8.59-1.61c2.6-1.13,5.85-.77,8.57-1A7.11,7.11,0,0,1,55.15,9c-.93,2.77-1.06,5.83-1.37,8.78-.36,3.37.93,4.61,5.21,5.24a65,65,0,0,0,8.52,1.14,53.34,53.34,0,0,0,9.93-.84c3.65-.64,7.23-1.72,10.81-2.69s6.76-3.08,9.86-5.25c3.55-2.48,7.45-4.48,11.09-6.85,4.21-2.75,9-4,13.7-5.41,10-3,20.3-3.48,30.61-3a125.14,125.14,0,0,1,17.63,2.41c3.24.63,6.29,2.17,9.78,3.41-.17,1.37-.37,2.92-.6,4.75,3.58.27,7.18.78,10.79.79,8.21,0,16.12,1.78,24,3.86a40.61,40.61,0,0,1,5,1.86A2.73,2.73,0,0,1,222,20.09l-19.55,8.15a93.66,93.66,0,0,1,7.34,6.6c1.75,1.94,2.93,4.38,4.45,6.54,1.36,1.94,2.92,3.76,4.24,5.74A23.62,23.62,0,0,1,220,50.89c-1.33-.09-2.27.12-2.6-.24a11.92,11.92,0,0,1-1.67-2.83c-.11-.21.21-.69.09-.82-4-4.41-5.57-10.64-10.56-14.33-1.74-1.27-3.46-2.55-5.74-4.24,2.44-1.36,4.31-2.58,6.33-3.5,4.35-2,8.78-3.79,13.13-6.07-12.55-5.38-25.65-6.43-39.18-6l-4.36,23.49c-2.62.77-5.83,1.59-8.95,2.68s-6.43,1.79-8.69,4.41c0,.26.09.51.14.77a37.39,37.39,0,0,0,5.8,0,75.26,75.26,0,0,1,13.91-.62c5,.16,10-.14,15,.16,6.46.38,12.89,1.12,19.33,1.82.74.08,1.42.84,2,1.62-19.79-2.67-39.5-3.8-59.6-.13C155.36,42.65,156.27,38.48,157.32,33.73ZM43,50.09a45.92,45.92,0,0,1,4.39,2A36.42,36.42,0,0,0,66.55,57.5a105.67,105.67,0,0,0,15.18-1.21C87.55,55.41,93.5,54.54,99,52.6c5.21-1.83,9.93-5,14.86-7.65a68.15,68.15,0,0,0,6.47-3.5c7.85-5.32,16.12-8.89,25.91-9.11,8.56-.18,17,0,25.41,1.57,1.79.34,2.5-.31,2.52-2.31a17.19,17.19,0,0,1,0-3.13c.89-4.13,2-8.23,2.86-12.36.63-3,1.08-6,1.6-8.89-2-.65-3.6-1.13-5.16-1.69S170.41,4,168.8,3.81C162.69,3,156.57,2.24,150.43,2a147.81,147.81,0,0,0-15.3.55,36.18,36.18,0,0,0-7,1c-7,1.84-14,3.83-20.17,8.08C104,14.28,99.85,16.54,95.77,19a45.41,45.41,0,0,1-4.36,2.31,46.11,46.11,0,0,1-12.75,3.56A75.75,75.75,0,0,1,68.31,26a47.78,47.78,0,0,1-10-1.17c-5.28-1.1-10.44-2.63-14-7.18a10.13,10.13,0,0,0-1.8-1.29c0,4.66.48,8.83-.13,12.84s.48,8.11-.51,12.25C41.28,44.11,42.56,47.22,43,50.09Zm7.84-38.76c.21.16.43.3.64.45l1.93-2.63-.7-.5Zm-7.5-1.4.66.35,1.1-2.11-.67-.35ZM163.83,35.64l.36.6,1.33-.78-.33-.61Z',
|
|
label5:'M68.72,160.92c.36-2.68.76-4.74.9-6.82.26-3.84.13-7.73.61-11.53s-1.52-6.62-3.79-9.28c-5.49-6.42-12.58-10.7-19.92-14.59-1.44-.76-2.73-2-4.68-1.73-.48.08-1.1-.83-1.59-1.23-2.65-.11-4.48-2.33-7.17-2.62a48.17,48.17,0,0,1-7.45-1.65c-2.48-.68-5-1.22-7.49-1.78s-5.21-1.38-7.86-1.9S5,107,2.1,106.62v19.13l-1.56-.47c-.23-6.77-.61-13.53.13-20.5,1.52-.23,2.85-.36,4.14-.67,1.87-.44,3.71-1,5.58-1.52,6.6-1.74,13.23-3.37,19.8-5.22,3.25-.91,6.38-2.25,9.6-3.29.63-.2,1.51.39,2.12.17,4.27-1.54,8.91-2.09,12.81-4.71,1-.65,2.41-.51,3.53-1,2.14-.93,4.2-2,6.56-3.22-1.12-2.31-2-4.42-3.1-6.37a100,100,0,0,0-5.53-8.8A61.14,61.14,0,0,0,49.36,62c-7.5-7.23-16.61-12.06-25.74-16.87A91.17,91.17,0,0,0,9.84,38.85c-2.3-.76-4.65-1.39-7-2-2.58-.67-3.23-2-2.61-4.64.69-2.95,1-6,1.63-9C2.61,19.81,3.49,16.38,4.53,13a3.69,3.69,0,0,1,2-2c10.59-3.94,21.57-6.55,32.5-9.31C42.21.93,45.47.58,48.8,0c.26,1.6-.56,2.42-1.27,3.37a21.51,21.51,0,0,0-2.47,4.05A2.45,2.45,0,0,0,46.53,11c2.75,1,5.61,1.72,8.41,2.61,1.13.36,2.21.87,3.32,1.32l-.06.8-8.7,2.93a7.52,7.52,0,0,0-5.19.38c-1.29.6-3.2.38-4.87,1s-3.41.19-5.12.32a18.28,18.28,0,0,0-2.53.61,56.69,56.69,0,0,1,14.89,8.72c2.25,1.93,4.79,3.53,7,5.51,2.75,2.49,5.66,5,7.8,7.92a143.33,143.33,0,0,1,9.38,15c1.72,3.13,2.68,6.68,4,10a4.31,4.31,0,0,0,.56,1.39C78,72.43,77.51,75.81,77,79.26c-.35,2.53-.41,5.09-.66,7.63-.48,4.89-1.05,9.76-1.48,14.64-.16,1.8,0,3.61,0,5.61-3.32,1.15-6.59,2.19-9.76,3.44a13.13,13.13,0,0,0-2.81,2.22c-2.22-.77-9.27.89-10.6,2.64L49.78,115l-1.2,2.14-1.59-1c0,.34-.05.69.07.78.81.6,1.64,1.18,2.5,1.7,5.55,3.31,11,6.8,15.57,11.38,2.68,2.67,4.76,5.94,7,8.8-.16,1.15-.34,2.05-.4,3-.39,5.6-.74,11.2-1.11,16.81-.13,1.88-.19,3.78-.49,5.64a2.61,2.61,0,0,1-1.34,1.59c-3.74,1.75-7.64,3.2-11.28,5.13-5.29,2.8-10.82,5.24-15.27,9.44a34.92,34.92,0,0,1-4.68,3.22l-.66-.37a7.85,7.85,0,0,1,0-2.17c1.39-4.68,2.87-9.32,4.29-14,.26-.85.39-1.74.67-3.05l-4,.57,0,.44c-.49-.28-1.08-.89-1.46-.78-3.63,1-7.7-.27-11.06,2.08-1.34.94-2,.08-2.86-1,2.75-2.35,5.33-5,8.31-7a107.79,107.79,0,0,1,18.61-9.69c.83-.36,1.62-.81,2.58-1.29-3.21-2.56-6.1-5.2-10-6.56-6.11-2.15-12-4.91-18.16-6.91-5.56-1.8-11.34-2.92-17-4.38-1.95-.5-3.87-1.12-5.78-1.75-.18-.06-.21-.57-.45-1.26a13.62,13.62,0,0,1,3.4,0c7.27,2.1,14.55,4.17,21.76,6.49,6.05,2,12.09,4,18,6.46,2.76,1.14,5.18,3.16,7.66,4.93a92.46,92.46,0,0,1,9.29,7.12c2.41,2.23,4.26,5.06,6.37,7.61C67.46,159.56,67.87,160,68.72,160.92Zm-17-53q-.91,2.58-1.82,5.16l.78.21c.33-1.82.65-3.63,1-5.44l.45-1.73-.53-.05C51.61,106.71,51.66,107.33,51.7,108Zm-9.32,63.66c-1.58,1.86-1.9,4.19-2.7,6.34l.76.28q.95-3.34,1.87-6.69l.72-2-.65-.08ZM46,105.88c-.58,2-1.19,3.93-1.7,5.91a17.11,17.11,0,0,0-.29,2.59l.65,0c.42-2.87.85-5.74,1.27-8.61l.45-1.73-.52,0C45.92,104.64,46,105.26,46,105.88Zm7.94-3c.22-.16.58-.28.64-.48.73-2.23,1.47-4.46,2.07-6.72.38-1.42.51-2.91.76-4.36l-.86-.2C55.26,95,54.88,99,54,103l-.45,1.73.53.05C54,104.14,54,103.52,54,102.91ZM73.4,100.8c.3-3.48.6-7,.91-10.45.24-2.8.48-5.59.74-8.39.32-3.55.91-7.1-.7-10.56a49,49,0,0,1-1.78-4.93,76.13,76.13,0,0,0-7.63-15.23c-3.49-5.61-7.28-11-12.65-15-2.94-2.22-5.95-4.37-8.77-6.73a25.89,25.89,0,0,0-8-4.79c-1.1-.39-2.07-1.11-3.16-1.53-1.78-.69-3.61-1.26-5.68-2a12.89,12.89,0,0,0-2.92-2c-5.54-2.06-11.15-4-17-6A71.7,71.7,0,0,0,1.78,34a23,23,0,0,0,3.08,1.21,67,67,0,0,1,16.05,6c6.51,3.39,12.86,7.11,19.18,10.85a57.32,57.32,0,0,1,15,12.9C60,71,63.16,78,66.61,84.86c1.26,2.5,1.25,5.89,4.54,7C70.4,94.53,71,97.47,73.4,100.8ZM49.28,112c1.56-6.54,3.11-13.08,4.74-19.93l-4.59,1.85c-.7,3.84-1.42,7.77-2.13,11.7,2-3.8,2.49-8,4.42-11.75C52,100.11,49.26,105.85,49.28,112ZM61.87,90l-.58-.51c-.48.43-1.25.78-1.4,1.31q-1.66,5.81-3.1,11.68c-.47,1.92-.73,3.9-1.08,5.84l.44.09Q59,99.17,61.87,90Zm.92,17.85.4.16a8.12,8.12,0,0,0,.73-1.23c1.32-3.45,2.58-6.92,3.91-10.36.88-2.26.85-2.79-.69-4.8Q65,99.73,62.79,107.82ZM39,16.2l.44.08c1.06-3.43,2.11-6.86,3.22-10.48a2.89,2.89,0,0,0,2.06-3.13l-3.61.69C40.37,7.78,39.68,12,39,16.2Zm6.07,79.27c-1.63-.43-2.44.2-2.72,2-.38,2.49-1.05,4.92-1.54,7.39-.28,1.47-.44,3-.66,4.43l.35,0C42,104.75,43.52,100.14,45.06,95.47Zm16.36,5.59c1.7-4.33,4.08-8.52,4.68-13.3-1.56-.34-1.95.23-2.17,1.39C63.15,93.13,62.26,97.09,61.42,101.06ZM27.14,18.25c1.36-3.92,2.48-7.78,2-12l-2,.34ZM34,108.4c1.4-1.71,1.77-3.86,3.33-5.6,1.13-1.26.9-3.74,1.34-6l-1.9.26ZM39.57,3.71c-2.36.82-3.55,6.07-2.79,11.73C38,11.45,39.43,7.81,39.57,3.71Zm15.17,145h-.55q-2.14,6.19-4.31,12.38a1.54,1.54,0,0,0,1-.74c1.42-3,2.89-6,4.15-9.15C55.34,150.57,54.87,149.59,54.74,148.74ZM30.59,5.93c1.22,3.93-1.12,8,.69,11.86.42-4.11.83-8.23,1.28-12.77Zm2.68,9.76C35.15,11.14,36,5.89,35.38,4c-.55.83-1.31,1.45-1.38,2.15C33.65,9.29,33.5,12.49,33.27,15.69Zm4.45,92.18c1.29-3.72,2.94-7.35,3-11.38A27.79,27.79,0,0,0,37.72,107.87ZM60,99.31q-1.9,6.16-3.82,12.33l.7.21C59.23,108.06,59.39,103.61,60,99.31ZM23.93,14.73l.57,0,1.32-7.45-2.48.37C23.56,10.19,23.74,12.46,23.93,14.73Zm35.2,139.09.76.19-1.17,5.13.47.15c.76-1.72,1.52-3.43,2.3-5.21l-3-1.91c-.19.85-.36,1.49-.49,2.14s-.17,1.07-.25,1.6l.25,0ZM32.45,98.5c-2.36,1-3.45,4.16-2.86,8.41Zm10.71,6.56-.27,0c-.73,2.46-1.5,4.92-2.18,7.4-.3,1.09.17,1.77,1.27,1.76C42.38,111.12,42.77,108.09,43.16,105.06Zm2.05,54.1c1.25-2.71,2.49-5.42,3.8-8.28C47.19,151.36,45,156,45.21,159.16Zm-2.49,17.68.38.29,2.06-1.29c.23-1.82.43-3.45.64-5.09l-.28-.08Q44.11,173.76,42.72,176.84Zm-.93-17.28.27.17c1.1-2.37,2.19-4.75,3.29-7.13-.12-.14-.24-.28-.35-.43-.52.26-1.39.41-1.51.79C42.82,155.13,42.34,157.35,41.79,159.56Zm12.55,3-.59-.27c-2.18,2-2.17,4.88-3.22,7.33l.53.23Zm-1.75-13.09-.69-.3a15,15,0,0,0-2.5,7.46Q51,153,52.59,149.46Zm10.39-47c-1,2.51-2.56,4.9-2.51,7.66l.81.19C61.85,107.72,62.42,105.11,63,102.49ZM42.11,154.12c-2.46.88-3.18,2.63-2.71,5.52Zm6,8.62-2.13.83c-.24.86-.47,1.66-.67,2.47s-.35,1.58-.53,2.37l.39.11ZM20.08,8.57c.23,1.49.44,2.83.65,4.18l.3-.05c.4-1.57.79-3.15,1.24-4.91Zm6.51,96.57c2.35-3.21,2.56-4.12,1.31-5.74C27.47,101.29,27.06,103,26.59,105.14Zm23.52,60-.88-.33q-1,2.83-1.94,5.66l.47.18C48.54,168.78,49.33,166.94,50.11,165.1ZM35.18,111.74l.59.08q.39-2.85.79-5.71C35.88,108,34.44,109.7,35.18,111.74Zm20,43.62.31.26c.6-1.16,1.27-2.29,1.76-3.5.15-.37-.21-.94-.34-1.42l-.44.18ZM34.61,99l-.68-.17-1.11,5.34.55.11Q34,101.63,34.61,99ZM26,100.45l-.73-.26L24,104.29C26.47,103.37,25.21,101.56,26,100.45Zm-5.69.7c.54.95.94,1.65,1.47,2.6.49-1.09.81-1.82,1.21-2.72Zm43,55.15-.84-.26c-.36,1.2-.73,2.4-1.09,3.6l.68.2C62.39,158.66,62.81,157.48,63.22,156.3ZM16.38,102.92c-2.09.19-1.39,1.64-1.42,2.81Zm19.56,56.29.52.25,1.69-3.25-.65-.32Zm30.09-54-.47-.32c-.35,1.23-.69,2.46-1,3.69l.62.18C65.44,107.62,65.74,106.43,66,105.25ZM10.25,11.76l2.26,1.11.34-.25-.93-1.81C11.22,11.22,10.78,11.46,10.25,11.76Zm12.54,97.13c-.16-1.18-.27-2-.41-3-.47.9-.81,1.58-1.16,2.24Zm-2.69-7.65-2,1,.6,1.72ZM16.73,9.75c.37.63.62,1.05,1,1.66l.9-2.54ZM65,158.73l-.68-.29c-.28.8-.57,1.59-.86,2.39l.45.17C64.28,160.25,64.65,159.49,65,158.73ZM48.64,171.65c-.25.75-.47,1.43-.84,2.56C49.77,173.52,49,172.55,48.64,171.65ZM30.85,107.79l-.42-.07L30,110.21l.68.08C30.73,109.46,30.79,108.63,30.85,107.79ZM21.64,16.16a4.59,4.59,0,0,0,.6.25c.05,0,.16,0,.16-.06,0-.68.07-1.36.1-2l-.65-.05C21.78,14.94,21.7,15.61,21.64,16.16Zm2.09,92.42.64.23c.27-.72.55-1.43.82-2.15l-.43-.16C24.42,107.19,24.08,107.89,23.73,108.58Zm3.84-1.49h-.23c-.11.8-.23,1.61-.34,2.41l.57.05Zm41-6,.47.1c.19-.75.37-1.51.56-2.27a1.72,1.72,0,0,0-.78,1C68.75,100.39,68.69,100.77,68.61,101.14Zm-15.5,11,.81.25c.06-.7.13-1.41.2-2.12l-.35,0ZM71.26,102l-.45-.16c-.23.63-.45,1.27-.68,1.9l.44.15Zm-55.38,5.58.68.2c.1-.56.21-1.12.31-1.68l-.39-.11Zm33.63-94a7.26,7.26,0,0,0,.11,1.34,6.19,6.19,0,0,0,1.14.09ZM18.59,15.05l.83-.12-.57-1.74-.41.09Zm30.2,147.12c0-.57.05-1,.07-1.44l-.28-.08-.64,1.24Zm23-57-.41-.34c-.23.54-.45,1.08-.67,1.62l.38.17Zm-58.73,1.57c0-.56,0-1,.07-1.43l-.27-.09-.65,1.25Zm30.57,58.76-.34,0,.12,1.29.33,0C43.71,166.4,43.68,166,43.64,165.54ZM55,159.32l-.35,0c0,.43.08.86.13,1.29l.33,0C55.1,160.19,55.06,159.76,55,159.32ZM38.46,110.67l-.34,0,.12,1.3.33,0C38.54,111.53,38.5,111.1,38.46,110.67Zm4.82-98.83-.4-.09v1.43l.29,0C43.21,12.75,43.24,12.29,43.28,11.84ZM15,11.28l.28-.12c-.13-.41-.26-.81-.38-1.22l-.48.17Z',
|
|
label6:'M142.64,43.21S149.12,25,86,45.13C86,45.13,41.6,60,7,54,7,54,34.88,42.25,35.6,38.17c0,0-41.52-26.88-33.6-22.32,26.79,15.43,74.4-.72,74.4-.72,71-26.64,73.92-7.44,73.92-7.44S152.24,20.65,142.64,43.21Z M166.16,38.05s7.68-12.6,25.8-17c0,0-14.38-3.66-43.22,3.63a108.07,108.07,0,0,1-5.94,18.11c-.9,3-4.33,8.22-17.44,4.18,0,0-12.53-5.15-18.27,4.46a8.73,8.73,0,0,0,0,6.1s2.76,7.44,21.84-.72c16.39-7,42.24-12.36,60.24-5.4C189.2,51.37,186.56,45.49,166.16,38.05Z M112.57,37.94l-5.69,13.71c5.64-10.08,18.48-4.8,18.48-4.8,12.81,4,16.38-.89,17.38-4C143.15,40.87,143.54,31.45,112.57,37.94Z',
|
|
label7:'M38.12,18.25A98.43,98.43,0,0,0,5.36,18c-1,.16-.88,1.67,0,1.92,6.56,1.93,12.38,5.56,18.05,9.29V27.5C14.73,31.75,6.26,37.61.24,45.26a1,1,0,0,0,1,1.68,50.39,50.39,0,0,1,25-.18c6.06,1.44,11.77,4.93,18,5.43,12.38,1,10.54-10.85,10.38-19.59a1,1,0,0,0-2,0c.08,4.44,1.13,9.7-.44,14-2.83,7.72-14.63,1.77-19.7-.07A52.88,52.88,0,0,0,.68,45l1,1.67c5.93-7.55,14.19-13.26,22.76-17.45a1,1,0,0,0,0-1.73C18.6,23.68,12.62,20,5.89,18v1.92a95.82,95.82,0,0,1,31.7.24c1.25.22,1.79-1.71.53-1.93Z M174.46,49.71c-.25-4.72,12.1-4.39,15.42-6,3.06-1.45,5.48-4,5.71-7.51.22-3.35-1.51-4.95-3.44-7.34-4.47-5.55-5.41-11.83-6-18.7C185.52,2,181.13-.68,173.34.54,163.79,2,154.56,5,145,6.42a223.62,223.62,0,0,1-58,1C76.51,6.26,66.62,3.55,56.36,1.45,50.41.23,42.27-2.25,39,4.65c-2.35,5-1.12,11.1-2.92,16.35-1.29,3.76-3.12,6.18-5.53,9.14a8.73,8.73,0,0,0-2.08,4.13,8.5,8.5,0,0,0,3.13,8.06A14.5,14.5,0,0,0,37.31,45c1.21.3,2.47.43,3.7.61l3.42.45q3.56-.12,3.73,4.26c-.83.37-.24,1.67.6,1.44,5.51-1.51,1.62-6.38-2-7.47-5.65-1.7-13-.25-15.92-6.92C29.46,34.16,36.1,27.05,37.42,24A37.28,37.28,0,0,0,40,12c.34-4.06.63-8.82,5.53-9.72,2.16-.4,4.7.39,6.85.76,9.08,1.58,17.88,4.3,27,5.67a216.25,216.25,0,0,0,50.07,1.63,201.19,201.19,0,0,0,26.31-3.71c6.62-1.44,24.66-9.07,27.76.23,1.66,5,.74,10.41,2.62,15.48,1.62,4.38,5.48,7.84,6.52,12.14,3.42,14.15-21.26,4.19-19.52,15.37.11.71,1.29.54,1.26-.18Z M194.31,32.15c-4.9-3.57-12.29-2.51-17.92-1.69-7.79,1.14-15.35,3.29-23,4.94a192.47,192.47,0,0,1-46.06,4,201.48,201.48,0,0,1-42.56-5.47c-7.25-1.8-14.53-3.82-22-4.19-4.48-.22-10.14-.34-13.69,2.86-1.2,1.09.54,2.72,1.75,1.75,5.26-4.24,16.1-1.68,21.84-.5C59.1,35.13,65.48,37,72,38.32A213.3,213.3,0,0,0,108.88,42a198.07,198.07,0,0,0,39.05-3c6.67-1.19,13.16-3,19.75-4.57,8-1.91,18-4.65,25.95-1.16a.67.67,0,0,0,.68-1.16Z M186.26,20a106.8,106.8,0,0,1,31.93.12v-2.2c-6.77,1.92-12.76,5.6-18.61,9.42a1.24,1.24,0,0,0,0,2.13c8.53,4.21,16.75,9.93,22.65,17.48l1.29-2.21a55.47,55.47,0,0,0-32.94,1.9c-5.33,2-13.56,6.22-16.88-.57-1.9-3.86-2.63-9.22-3.27-13.43-.17-1.16-2-.86-2,.27a43.56,43.56,0,0,0,2.83,14.52c1.65,4.38,3.66,5.37,8.38,5.09,6.89-.4,13-4.32,19.63-5.74a54.55,54.55,0,0,1,23.55.51A1.34,1.34,0,0,0,224.1,45c-6-7.65-14.56-13.51-23.28-17.74v2.13c5.65-3.73,11.45-7.38,18-9.35,1-.3,1.19-2,0-2.2a89.81,89.81,0,0,0-32.73.61c-.81.18-.64,1.58.2,1.47Z',
|
|
label12:'M46.82,7.19a88.35,88.35,0,0,1,13.72-.65C48.13,4,2.44-4.6,1,6.64,1.5,8.25,6.29,12.91,46.82,7.19Z',
|
|
label13:'M1,1s-1.89,6.68,39.17.89c0,0,20.36-3.34,55.63,6.12,0,0,31.7,9,67.08-7,0,0-6.23,15.8-13.57,20.47,0,0,6.23,5.45,21.36,10.13,0,0-34,16.8-87.67,5a145.68,145.68,0,0,0-42-4.67s-6.36.38-19.29,2.56c0,0-19,3.34-20.71-.56Z',
|
|
label14:'M100.85,1C50.53,0,12.74,18.75,11.15,19.55L26.88,50.88c.32-.16,32.38-15.79,74-14.78,41.59-1,73.65,14.62,74,14.78l15.73-31.33C189,18.75,151.17,0,100.85,1Z M26.88,50.9,16.49,30.21A126.69,126.69,0,0,0,1,37.52l15.06,9.21L12.46,70.1S30.08,59.5,43.52,54.82h0L26.9,50.89Z M200.7,37.52a127.39,127.39,0,0,0-15.49-7.31L174.82,50.9h0l-16.62,3.92h0c13.44,4.68,31.07,15.28,31.07,15.28l-3.6-23.37Z M26.9,50.89l16.62,3.92-3-9.29A129.94,129.94,0,0,0,26.9,50.89Z M161.15,45.52l-3,9.29,16.62-3.92A129.94,129.94,0,0,0,161.15,45.52Z',
|
|
etc1:'M32,43.8A63.35,63.35,0,0,1,19.4,41.89c-3.19-.75-5.84-2.47-8.64-4a23.83,23.83,0,0,1-6.4-5.16A16.43,16.43,0,0,1,.12,23.85a16.05,16.05,0,0,1,1.24-8.07,38,38,0,0,1,2.74-5.3A12.28,12.28,0,0,1,6.9,7.23c1.22-1,2.49-2,3.81-2.89A15.76,15.76,0,0,1,13.78,3,34.32,34.32,0,0,1,21.33.79C23.55.44,25.77.28,28,.11a47.58,47.58,0,0,1,6.09,0A36.14,36.14,0,0,1,44.61,2.17a33.87,33.87,0,0,1,6,3c.41.25.81.51,1.24.72a25.23,25.23,0,0,1,8.8,7.39,15.29,15.29,0,0,1,3.28,10.48A8.39,8.39,0,0,1,63,27.3a27.17,27.17,0,0,1-5.3,7.46,31.24,31.24,0,0,1-8.26,5.61,47,47,0,0,1-5.91,2.27A11.47,11.47,0,0,1,41,43.2c-3.14.25-6.29.43-9,.6M22.35,27.05A15.89,15.89,0,0,1,20.25,22c-.24-1.17-.51-2.34-.81-3.49a1.18,1.18,0,0,0-1.17-1,1.3,1.3,0,0,0-1.19,1,7.53,7.53,0,0,0-.22,1.05,39.65,39.65,0,0,1-1.14,4.88c-.49-1.42-.89-2.83-1.3-4.24-.24-.8-.47-1.61-.76-2.39a1.47,1.47,0,0,0-1.57-.8,1.43,1.43,0,0,0-.6,1.54c1.06,3.3,1.62,6.75,3,9.93.35.77.86,1.31,1.38,1.29a1.78,1.78,0,0,0,1.37-1.33c.26-.88.49-1.77.75-2.65.08-.29.05-.64.39-.8.06.06.14.11.17.17.68,1.7,1.84,3.17,2.47,4.9a2.29,2.29,0,0,0,.39.6,1.36,1.36,0,0,0,2.42-.24,8.36,8.36,0,0,0,.43-1.12,72.84,72.84,0,0,0,2.82-11.84,2.42,2.42,0,0,0,.05-.47,1.28,1.28,0,0,0-1-1.42,1.41,1.41,0,0,0-1.3,1,6.92,6.92,0,0,0-.31,1.27c-.31,2.1-.72,4.17-1.2,6.23a10.36,10.36,0,0,1-1,3M42.94,15.21H41.26a1.47,1.47,0,0,0-.91.24,1.57,1.57,0,0,0-.69,1.42c0,1.06.48,2,.57,3.05A52.47,52.47,0,0,0,41,25.37,21,21,0,0,1,41.33,28c.06,1.09.91,1.63,1.49,2.36.17.22.51.2.79.16,3.23-.41,6.5-2.41,7.32-6.25a6.22,6.22,0,0,0-1.06-5.32c-.16-.23-.29-.48-.45-.71a5.79,5.79,0,0,0-3.28-2.63,10.1,10.1,0,0,0-3.2-.38m-10.49.26v0c-.4,0-.8,0-1.2,0a9.08,9.08,0,0,0-2.26.18c-.59.18-.93.54-.77,1.14a28.38,28.38,0,0,1,.32,3.44c.21,1.67.55,3.31.91,4.94a18.44,18.44,0,0,0,.63,3.28,1.91,1.91,0,0,0,1.58,1.29,4.89,4.89,0,0,0,1.43,0l3.32-.5a3.06,3.06,0,0,0,1-.39,1,1,0,0,0,.51-1.32,1.08,1.08,0,0,0-1.14-.86,6,6,0,0,0-1,.13c-.94.16-1.88.35-2.82.51-.7.12-.83,0-1-.69-.07-.39-.06-.79-.13-1.19-.2-1.24-.16-1.3,1-1.33.2,0,.4,0,.59,0a6.93,6.93,0,0,0,2.82-.41,1.36,1.36,0,0,0,.79-1.46,1.44,1.44,0,0,0-1.46-.81,2,2,0,0,0-.35.1,7.6,7.6,0,0,1-3.67.08c-.31,0-.57-.14-.58-.47,0-.88-.37-1.71-.35-2.61,0-.64.24-.86.85-.82a15.7,15.7,0,0,0,1.68,0,6.67,6.67,0,0,0,2.14-.15,1.1,1.1,0,0,0,.85-1.27,1.12,1.12,0,0,0-1.18-.95c-.88,0-1.76,0-2.64,0'
|
|
+'M43,17.64a9.43,9.43,0,0,1,.26,1.45,51.09,51.09,0,0,0,.7,5.15,21.8,21.8,0,0,1,.36,2.5A4.92,4.92,0,0,0,48,23.06a3.31,3.31,0,0,0-.54-2.93,4.52,4.52,0,0,1-.37-.56L47,19.43c-.67-.91-1.09-1.39-1.5-1.48a12.08,12.08,0,0,0-2.06-.34h-.13l-.18,0Z',
|
|
etc2:'M2.36,51.63A11.37,11.37,0,0,0,2,49.39C2,49.27,2,49.1,2,49c-.19-.85-.39-1.69-.59-2.54-.07-.28-.15-.55-.21-.83A5.18,5.18,0,0,0,.77,44a1.82,1.82,0,0,1-.1-.9c0-.79-.41-1.48-.48-2.25a6.79,6.79,0,0,1-.1-2.46A3.5,3.5,0,0,1,.23,38c.14-.35.53-.67.15-1.1a.17.17,0,0,1,0-.12c.37-.53.51-1.24,1.27-1.46.53-.15,1.09-.11,1.62-.29h.06c1.13.39,2.33.07,3.48.35a1.89,1.89,0,0,1,.52.13,2.8,2.8,0,0,0,1,.35,13.07,13.07,0,0,1,1.34.56c.31.09.55.35.9.33.15,0,.25.12.35.22a18.72,18.72,0,0,1,1.45,2,1.69,1.69,0,0,1,.29.74c.12.76.23,1.52.32,2.29a1.06,1.06,0,0,1-.15.65,8,8,0,0,0-.58,1.53,1.11,1.11,0,0,0,0,.6.34.34,0,0,0,.32.32,2.16,2.16,0,0,1,1.29.58,2.53,2.53,0,0,0,.62.38,2.86,2.86,0,0,1,1.88,2.67c0,.1,0,.2,0,.3a3.17,3.17,0,0,1-.27,2.16,2.18,2.18,0,0,0-.09.23,6.85,6.85,0,0,1-1.39,2.41,1.25,1.25,0,0,1-.27.24L11.7,55.6a.78.78,0,0,1-.32.15c-.79.06-1.55.28-2.33.39-1,.13-1.94.17-2.91.3a6.26,6.26,0,0,1-1.2-.12,3.41,3.41,0,0,1-1-.31.49.49,0,0,1-.34-.33c-.07-.37-.4-.62-.46-1,0,0,0-.1,0-.11-.62-.21-.54-.75-.54-1.21S2.4,52.21,2.36,51.63ZM3.81,39a14.31,14.31,0,0,0,.38,2.7,12,12,0,0,1,.53,2.43.73.73,0,0,0,.91.65A4.62,4.62,0,0,0,7,44.35a3.3,3.3,0,0,0,1-.6,3,3,0,0,0,1-2,2,2,0,0,0-1.24-2.08,7.7,7.7,0,0,0-1.93-.65A9.32,9.32,0,0,0,3.81,39ZM9.4,48.39a13.55,13.55,0,0,0-3,.38c-.42.06-.44.09-.41.51a2,2,0,0,0,.07.42,4,4,0,0,1,.16,1.45c0,.33,0,.65,0,1s.13.41.47.38c.19,0,.33-.12.53-.13a9.15,9.15,0,0,0,3.32-.63,2.72,2.72,0,0,0,1.83-1.81.6.6,0,0,0-.28-.77A4.12,4.12,0,0,0,9.4,48.39Z'
|
|
+'M66.2,44.9a7.46,7.46,0,0,1,1.84.16,7.55,7.55,0,0,0,2.76-.22c.12,0,.23-.08.26-.22a2.56,2.56,0,0,0,.18-1.25c0-.08,0-.18,0-.24a3.86,3.86,0,0,0,.14-2.1,5,5,0,0,1,.11-1.11c0-.22.17-.42,0-.63a.17.17,0,0,1,0-.12c.17-1.17,0-2.34.13-3.52a2.55,2.55,0,0,1,.12-.66,2.71,2.71,0,0,1,1.39-1.51l.12,0a.53.53,0,0,1,.35.05c.49.28,1.23,0,1.53.73a1.72,1.72,0,0,1,.22.59c0,.52-.05,1.06,0,1.56.13,1,0,1.9,0,2.85a4.34,4.34,0,0,1-.09,1.86,1.11,1.11,0,0,0,0,.6,7.19,7.19,0,0,1-.12,2.12,4.82,4.82,0,0,0-.08,1.32,4.64,4.64,0,0,1-.14,1c-.05.41-.27.82,0,1.23a.23.23,0,0,1,0,.18c-.3.54-.09,1.11-.1,1.67a8.54,8.54,0,0,0,.11,1.75c.11.61.16,1.23.26,1.85a4.2,4.2,0,0,1,.1,1.8.74.74,0,0,0-.06.36c.08.76-.39,1.2-.86,1.69a.93.93,0,0,1-1.12.24,5.78,5.78,0,0,0-.6-.11,1,1,0,0,1-.73-.59c-.05-.1,0-.26-.12-.34-.52-.54-.34-1.23-.46-1.86s.08-1.07-.17-1.59A3.36,3.36,0,0,1,71,51.1a6.75,6.75,0,0,1-.06-1.62c.07-.28-.24-.53-.62-.52a5.32,5.32,0,0,0-1.38,0,1.62,1.62,0,0,1-.9,0,5.48,5.48,0,0,0-1.62-.08c-.3,0-.54-.15-.82-.18s-.56,0-.47.45a5.47,5.47,0,0,1,0,2.28.74.74,0,0,0,.06.36.55.55,0,0,1,0,.36,12.91,12.91,0,0,0-.06,2.78,1.65,1.65,0,0,0,.13.53,2.24,2.24,0,0,1-.25,2,5.12,5.12,0,0,1-1,.9.45.45,0,0,1-.29,0,8.18,8.18,0,0,1-1.21-.16c-.21-.05-.49-.12-.53-.43a.27.27,0,0,0-.08-.16c-.77-.64-.59-1.53-.63-2.35,0-.44,0-.89,0-1.32,0-.65-.11-1.29-.06-1.93s0-1,.11-1.56a5.48,5.48,0,0,0-.14-1.38,1.47,1.47,0,0,1,0-.36,21.8,21.8,0,0,0,.05-2.68,12.31,12.31,0,0,0,0-1.92,2.53,2.53,0,0,1,0-1.16,1.21,1.21,0,0,0,0-.53,7.91,7.91,0,0,1-.28-3,1.4,1.4,0,0,0-.05-.54,1.3,1.3,0,0,1,0-.78.65.65,0,0,0,0-.73c-.17-.25,0-.64.09-1a2,2,0,0,1,1.78-1.42c.29,0,.57-.13.87.11a2.31,2.31,0,0,1,1,1.62,22.45,22.45,0,0,1-.08,2.6,8.33,8.33,0,0,0,.22,1.31c.07.56,0,1.13.09,1.68,0,.14,0,.3.1.41a1.26,1.26,0,0,1,.14.83s0,0,0,.06C65,44.63,65.3,45,66.2,44.9Z'
|
|
+'M80.21,54.11c.05-.47-.09-1-.09-1.6A.81.81,0,0,1,80.2,52c0-.06.1-.14,0-.22-.33-.62,0-1.34-.27-2,.22-.41,0-.78-.12-1.17a5.76,5.76,0,0,1,0-.83,8,8,0,0,0-.23-2.32,4.18,4.18,0,0,1,0-.94c0-.1,0-.22,0-.3a6.11,6.11,0,0,1-.34-1.58,3.4,3.4,0,0,1-.06-.46c0-.8-.07-1.6-.12-2.4a2.33,2.33,0,0,1,0-.79A2.15,2.15,0,0,0,79,37.85a.91.91,0,0,1,.09-.69,2.62,2.62,0,0,0,.19-.46,1.51,1.51,0,0,1,1.63-1.06,4.16,4.16,0,0,0,1.22,0,.5.5,0,0,1,.36,0c.39.3.8.13,1.21.12a2.16,2.16,0,0,1,.91.09,1.11,1.11,0,0,0,.72,0,1.55,1.55,0,0,1,1,0,1.55,1.55,0,0,0,.6.1c.08,0,.19,0,.24,0,.69.59,1.63.7,2.34,1.25a8,8,0,0,1,2.3,2.93c.09.18.17.37.26.55a2.94,2.94,0,0,1,.4,1.2,3.12,3.12,0,0,0,.22.82,8.52,8.52,0,0,1,.62,2.91c0,.54,0,1.1,0,1.63a11.5,11.5,0,0,1-.2,1.84,15.8,15.8,0,0,1-1.49,3.66A8.61,8.61,0,0,1,90.69,54c-.53.71-1.42.92-2,1.56a.2.2,0,0,1-.15.09c-.58,0-.92.47-1.37.72a2.14,2.14,0,0,1-1,.38,1.83,1.83,0,0,0-.92.46,3,3,0,0,1-1.28.52,8.32,8.32,0,0,1-1.2.27,3.44,3.44,0,0,1-1.21-.39,1.07,1.07,0,0,1-.56-.75,1.39,1.39,0,0,0-.46-.83,1.09,1.09,0,0,1-.35-.81C80.26,54.91,80.23,54.56,80.21,54.11Zm9.31-7.22a14.71,14.71,0,0,0-.24-2.14c0-.24-.2-.43-.25-.7a6.69,6.69,0,0,0-.68-2c-.26-.45-.67-.81-.88-1.27a1.6,1.6,0,0,0-1.08-.8,5.22,5.22,0,0,0-2.12-.33c-.36,0-.71-.12-1.09-.08s-.37.07-.33.36c.07.59.06,1.18.16,1.76a17.09,17.09,0,0,0,.32,2.66,11.79,11.79,0,0,1,.36,2.27c.11,1,.12,2,.21,3.06a3.67,3.67,0,0,1,.08,1c-.14.75.07,1.5,0,2.24-.06.38.14.52.52.44a1.68,1.68,0,0,0,.83-.36,3.94,3.94,0,0,1,1.06-.59,4,4,0,0,0,1.71-1.3c.39-.53.53-1.18.86-1.72A6.78,6.78,0,0,0,89.52,46.89Z'
|
|
+'M36.51,35.23l.22,0c.07.2.25.26.41.35a4.89,4.89,0,0,1,1.11.7,4.9,4.9,0,0,1,1.22,2.13,3.45,3.45,0,0,1,0,2.41.9.9,0,0,0-.08.23,6.67,6.67,0,0,1-1,2.25,1,1,0,0,0-.24.55L38,44a.42.42,0,0,0-.47.3c-.15.43-.52.62-.84.87a4.58,4.58,0,0,0-.42.35c-.37.39-.35.59.16.82s1,.33,1.4.55a8.43,8.43,0,0,1,1.54.74A10.75,10.75,0,0,1,41.91,50a.54.54,0,0,0,.34.23l.07.09a1,1,0,0,0,0,.24,6.31,6.31,0,0,1,.12,1.55c-.09.41-.25.72-.74.73-.08,0-.18.09-.25.16a.72.72,0,0,1-.56.18,2,2,0,0,1-1.71-1c-.27-.35-.66-.54-.91-.89,0,0-.11,0-.17,0l-.12,0c0-.13-.08-.25-.26-.2L37.63,51c-.07-.31-.32-.44-.56-.59a8.09,8.09,0,0,0-1.3-.61c-.73-.28-1.45-.59-2.18-.89h0c0-.06,0-.13-.07-.17a20.74,20.74,0,0,1-2.17-1.54.1.1,0,0,0-.05,0c-.38-.17-.65,0-.65.42a1.33,1.33,0,0,0,.08.6,5.85,5.85,0,0,1,.35,1.22,5.79,5.79,0,0,1,.29.92,13.52,13.52,0,0,1,.28,2.29,1.38,1.38,0,0,0,.15.46,2.52,2.52,0,0,1,0,1.44,1.33,1.33,0,0,1-.86.85,2.67,2.67,0,0,1-1.48.06c-.41,0-.43-.37-.55-.63l0-.05a2.62,2.62,0,0,1-.7-2.08A3.14,3.14,0,0,0,28,51.56c-.17-.49-.32-1-.47-1.49a8.53,8.53,0,0,1-.38-1.9c-.08-1.4-.44-2.77-.41-4.19a6.7,6.7,0,0,1-.1-1.43c0-.1-.08-.23-.11-.34a2.13,2.13,0,0,1-.1-.42c0-.74-.11-1.48-.14-2.22a10.24,10.24,0,0,1,.11-2.35c.09-.48.18-1,.26-1.43A2.43,2.43,0,0,1,27.64,34a.31.31,0,0,0,.17-.23h0c.24-.08.5.13.71,0a1.74,1.74,0,0,1,1.36-.08c1.13.21,2.26.43,3.38.72a20.78,20.78,0,0,1,2.91.88C36.3,35.3,36.41,35.35,36.51,35.23ZM33,42.89c.4.11.65-.18.95-.34a3.23,3.23,0,0,0,1.27-1.1,11.35,11.35,0,0,0,.64-1.31,1.09,1.09,0,0,0-.2-1.18c-.15-.24-.37-.08-.55-.18a14.5,14.5,0,0,0-2.56-.93,1.57,1.57,0,0,0-.61-.05.73.73,0,0,1-.41-.07,3.84,3.84,0,0,0-1.06-.27c-.45-.1-.62,0-.53.51A13,13,0,0,1,30,39.84c0,.81.13,1.62.16,2.43a2.29,2.29,0,0,0,.07.36c.07.27.23.37.5.24a.84.84,0,0,1,.6-.06C31.88,43,32.43,42.77,33,42.89Z'
|
|
+'M80.79.65A7,7,0,0,1,83.33,1a21.84,21.84,0,0,0,3,.84,4.52,4.52,0,0,1,1.23.51c.73.41,1.57.57,2.29,1.06a3.22,3.22,0,0,1,1,1.19,10.1,10.1,0,0,0,.62,1.11,1.48,1.48,0,0,1,.29.7,3.69,3.69,0,0,0,.21.93A7.67,7.67,0,0,1,92.05,10a4.82,4.82,0,0,1-.9,2.65,3.1,3.1,0,0,1-1.27,1.29,1.77,1.77,0,0,0-.69.56.7.7,0,0,1-.43.26c-.74.11-1.38.51-2.12.64s-1.45.31-2.17.49a5.94,5.94,0,0,1-1.26.15c-.68,0-.75.12-.76.78a27.89,27.89,0,0,0,.17,3.29c.08.74.15,1.5.19,2.26a4.36,4.36,0,0,0,.17,1,2,2,0,0,1-.8,2.18,2.05,2.05,0,0,1-1.24.43,2.64,2.64,0,0,1-1.2-.5,1.25,1.25,0,0,1-.62-.85,6.89,6.89,0,0,0-.4-1.07,2.15,2.15,0,0,1,0-1.33,1.55,1.55,0,0,0,0-.74,5.61,5.61,0,0,1-.17-1.23,9.16,9.16,0,0,0-.1-2.09,8.65,8.65,0,0,1-.16-2.22,6.34,6.34,0,0,0-.18-2.25,1.36,1.36,0,0,1,0-.45c0-.12.09-.28,0-.37-.21-.41,0-.84-.1-1.24-.19-1-.1-2-.36-3a1.52,1.52,0,0,1,0-.52,3.34,3.34,0,0,0-.23-1.56.59.59,0,0,1,0-.26,7,7,0,0,0-.12-2.42,2.56,2.56,0,0,1,1.13-2.28A3.6,3.6,0,0,1,80.79.65ZM82.1,12a2,2,0,0,1,.38,0,1.24,1.24,0,0,0,1.2-.2.83.83,0,0,1,.5-.11A5.6,5.6,0,0,0,86.72,11,2.27,2.27,0,0,0,88,9.83c.13-.32,0-.57,0-.86a2.68,2.68,0,0,0-.41-1.82,1.49,1.49,0,0,0-1.11-.85.58.58,0,0,1-.32-.21.54.54,0,0,0-.46-.17,1.13,1.13,0,0,1-1-.34.51.51,0,0,0-.48-.14c-.22.08-.36-.05-.53-.13S83.22,5.07,83,5a2.34,2.34,0,0,0-1.36-.21c-.23.06-.37.21-.28.41a2.88,2.88,0,0,1,.12,1.33c0,.43.21.82.22,1.23C81.73,9.15,82,10.52,82.1,12Z'
|
|
+'M52.35,10.64l.2.2a7.05,7.05,0,0,1,1,1.71c0,.06.08.1.12.15a6.13,6.13,0,0,1,.92,1.73,1.8,1.8,0,0,0,.3.64,4.74,4.74,0,0,1,.86,1.83c.24.72.54,1.42.75,2.15a8.84,8.84,0,0,1,.32,1.35A1.41,1.41,0,0,1,56,21.94a1.63,1.63,0,0,1-1.67.16,2.23,2.23,0,0,1-1.18-1.51A6.39,6.39,0,0,0,52.66,19a7.93,7.93,0,0,1-.59-1.11A15.23,15.23,0,0,0,51,15.21a1,1,0,0,0-1.17-.55c-.86.34-1.78.49-2.66.79-.21.07-.48,0-.68.12A6.62,6.62,0,0,1,44.4,16c-.46.06-.68.3-.61.75a1.37,1.37,0,0,1-.07.75,1.88,1.88,0,0,0-.15.55c-.1,1.4-.15,2.8-.28,4.19a5.55,5.55,0,0,1-.62,2.7.55.55,0,0,1-.44.31,1.23,1.23,0,0,0-.43.1c-.7.27-1.11-.31-1.64-.53a.73.73,0,0,1-.42-.29,1.17,1.17,0,0,1-.14-.35,2.64,2.64,0,0,1,0-1.12,6.69,6.69,0,0,0,.17-1.27c0-.44,0-.89,0-1.31s.06-.88.17-1.32a3.55,3.55,0,0,0,0-1.34c-.09-.47.2-.84.2-1.29A15.7,15.7,0,0,0,40.36,14a.29.29,0,0,1,.06-.24,1.31,1.31,0,0,0,.19-.92,4,4,0,0,1,.1-1.08c.12-.46.09-.94.21-1.41.07-.27-.08-.61,0-.93.34-1,.26-2.13.51-3.18a9.09,9.09,0,0,0,.17-2,2.49,2.49,0,0,1,.2-1.37.31.31,0,0,0,0-.31c-.16-.3.06-.41.24-.56s.41-.08.44-.33A.42.42,0,0,1,43,1.26a5.31,5.31,0,0,1,.68-.05,2.5,2.5,0,0,1,1.47,1A15.4,15.4,0,0,1,47.36,5,18.5,18.5,0,0,0,49,7.14a9.35,9.35,0,0,0,1.46,1.49,13.6,13.6,0,0,1,1.44,1.6C52,10.39,52.11,10.59,52.35,10.64Zm-4.66.64c-.12-.16-.2-.28-.3-.39-.65-.69-1.28-1.39-1.94-2.07-.16-.16-.25-.43-.55-.51a2.6,2.6,0,0,1,0,.49c-.15,1-.31,2-.47,3-.06.39,0,.38.4.34s1-.32,1.46-.38A3,3,0,0,0,47.69,11.28Z'
|
|
+'M107.45,46.33a4.31,4.31,0,0,1-.13,1.28,2.22,2.22,0,0,0,.48,1.62,1.58,1.58,0,0,1,.37.88,6.09,6.09,0,0,0,.54,1.87,8.86,8.86,0,0,0,.65,1.56c.17.28-.06.66.22.92a.06.06,0,0,1,0,.06c-.44.5-.57,1.28-1.32,1.53a2,2,0,0,1-.46.14c-1.23.05-1.66-.21-2.13-1.25a5.62,5.62,0,0,0-.39-.82c-.26-.41-.18-.92-.41-1.33s-.43-1.21-.7-1.79a8.8,8.8,0,0,1-.5-1.23c-.17-.55-.17-.49-.78-.5a15.29,15.29,0,0,0-1.67.27,2,2,0,0,1-.6,0c-.6-.08-.92.12-1,.72a7.73,7.73,0,0,0-.37,1.65,8.09,8.09,0,0,0-.66,2.61c-.12.51-.17,1-.3,1.58-.07.26-.41.45-.21.78-.21.16-.35.39-.65.43a1,1,0,0,0-.89.45s-.72,0-.75-.05-.2-.07-.26-.14a1.55,1.55,0,0,0-.8-.55c-.11,0-.12-.14-.15-.24a3.5,3.5,0,0,1,0-2.49c.09-.24,0-.49.09-.72.2-.7.42-1.39.63-2.08,0-.06.06-.12.05-.17a15,15,0,0,1,.43-2.66c.07-.73.22-1.46.36-2.19.06-.35.39-.62.31-1,.36-.38.15-.9.35-1.33.35-.75.44-1.6.84-2.34a2.11,2.11,0,0,0,.18-.77,3.07,3.07,0,0,1,1.28-2,4.66,4.66,0,0,1,1.4-.76c.16-.06.34-.13.4-.27.3-.59.85-.39,1.24-.31a2.25,2.25,0,0,1,1.42.88c0,.07.14.12.15.19a10.86,10.86,0,0,0,.89,1.73c0,.06,0,.13.06.17.46.42.5,1,.75,1.55a1.46,1.46,0,0,0,.32.52,1,1,0,0,1,.24.54,2.73,2.73,0,0,0,.76,1.6c.33.26.44.75.74,1.08C107.61,46.07,107.4,46.25,107.45,46.33Zm-5.56-.78c.5,0,.58,0,.49-.51a5.16,5.16,0,0,0-.82-2c-.14-.21-.36-.18-.47,0a1,1,0,0,0-.06.3,8.12,8.12,0,0,1-.46,1.62c-.07.22-.17.44,0,.63s.42.11.63.08S101.64,45.44,101.89,45.55Z'
|
|
+'M101.54,30.58c-.63.1-1.08,0-1.31-.59a.36.36,0,0,0-.12-.15,1.4,1.4,0,0,1-.56-1.68c.14-.5,0-1.05.27-1.52a.31.31,0,0,0,0-.31,1.55,1.55,0,0,1,0-1.06,20.75,20.75,0,0,0,.37-3.85c0-.69,0-1.39,0-2.09a3,3,0,0,1,.11-1.79,1,1,0,0,0,.05-.81,3.82,3.82,0,0,1-.06-1.87,9.84,9.84,0,0,1,0-1.07,7.09,7.09,0,0,1,.38-1.21.76.76,0,0,0-.23-1.07c-.45-.39-.92-.75-1.37-1.13a1,1,0,0,1-.24-.21C98.52,9.68,98,9.5,97.68,9c-.42-.69-1-1.25-1.4-2s-.75-1.41-1.1-2.13S94.83,3.62,94.56,3c-.09-.22.07-.45.1-.68a.51.51,0,0,1,.46-.46c.08,0,.2-.08.2-.13a.5.5,0,0,1,.38-.52,2.18,2.18,0,0,1,1.07-.11,2.7,2.7,0,0,1,1.86,1.71,7.31,7.31,0,0,0,.83,1.56,5.06,5.06,0,0,0,.83,1.27c-.07.54.45.68.72,1a16.86,16.86,0,0,0,1.79,1.69c.5.37.92.36,1.22-.16a6.16,6.16,0,0,1,1.08-1.55.24.24,0,0,0,.06-.11c.26-.75.76-1.39,1-2.14a4.28,4.28,0,0,1,1.82-2,.74.74,0,0,1,.78,0,5.91,5.91,0,0,0,.84.28,1,1,0,0,1,.75.78c.06.33.1.67.13,1a1.48,1.48,0,0,1-.32,1.19A9.53,9.53,0,0,0,109,7.77a11.32,11.32,0,0,1-.83,1.43,17.23,17.23,0,0,1-1.88,2.65c-.47.48-.76,1.11-1.19,1.64a1.06,1.06,0,0,1-.3.33.88.88,0,0,0-.53,1,9.56,9.56,0,0,0,0,2.33c.07.24-.08.54-.09.82a3.24,3.24,0,0,0,.06.82.77.77,0,0,1-.11.72c-.12.14-.08.31,0,.49a2,2,0,0,1,0,1.13.93.93,0,0,0,0,.44,8.51,8.51,0,0,1-.16,2.89,1.18,1.18,0,0,0,0,.25,20.06,20.06,0,0,1-.25,3.55,1.71,1.71,0,0,1-.6,1.41.36.36,0,0,0-.16.33.48.48,0,0,1-.59.5C102,30.48,101.77,30.7,101.54,30.58Z'
|
|
+'M114,56.69c-.06-1.29-.12-2.51-.17-3.73,0-.25-.13-.46-.15-.71a9.59,9.59,0,0,1,0-2.78c.06-.27-.15-.49-.13-.77,0-.69,0-1.38,0-2.06a2,2,0,0,0-.64-1.38A10.06,10.06,0,0,1,111.22,43c-.1-.21-.19-.45-.48-.52a.23.23,0,0,1-.16-.16,13.92,13.92,0,0,0-1.12-2.17,6.43,6.43,0,0,0-1-1.73.84.84,0,0,1-.14-1.1,1.16,1.16,0,0,0,.16-.63.86.86,0,0,1,1.06-.79c.16,0,.26-.05.39-.09a1.19,1.19,0,0,1,1.36.38A24.23,24.23,0,0,1,113,38.64,13.28,13.28,0,0,0,114,40.32a4.92,4.92,0,0,0,.73.92,1,1,0,0,1,.49.67c0,.24.22.3.4.14a1.7,1.7,0,0,0,.65-.86.6.6,0,0,1,.09-.22,10.94,10.94,0,0,0,1.28-1.88,8.35,8.35,0,0,0,.87-1.52,7.19,7.19,0,0,1,.94-1.77,2.75,2.75,0,0,0,.26-.4,1.67,1.67,0,0,1,1.78-.84,2.24,2.24,0,0,1,1.56,1.11,1.25,1.25,0,0,1,.09.95c-.08.49-.38.89-.49,1.37a11,11,0,0,1-.68,1.53c-.18.44-.55.78-.73,1.24a3.47,3.47,0,0,1-.87,1.28c-.2.19-.17.47-.32.7-.46.75-1,1.45-1.43,2.24a2.68,2.68,0,0,1-.8,1.18,1,1,0,0,0-.32.71,10,10,0,0,0-.21,1.82c0,.2,0,.41.14.58a.33.33,0,0,1,.07.34,1.59,1.59,0,0,0,.07.78c0,.1.11.2.06.29-.34.6,0,1.19,0,1.78a10.64,10.64,0,0,1,.1,2.25,13.85,13.85,0,0,0,.11,1.94,2.38,2.38,0,0,1-.13,1.49.39.39,0,0,0,0,.3.54.54,0,0,1-.28.57c-.43.19-.77.52-1.2.71a.64.64,0,0,1-.78-.13c-.08-.07-.14-.18-.23-.19-.71-.15-.88-.72-1-1.3A2.84,2.84,0,0,1,114,56.69Z'
|
|
+'M33.41,2.75c.1,1.17.15,2.33.23,3.5A25.85,25.85,0,0,0,34,8.89a.77.77,0,0,1,0,.26,5.63,5.63,0,0,0,.12,2.2,1.13,1.13,0,0,1,0,.32,18.68,18.68,0,0,0,.17,3c.06.69.2,1.38.27,2.08s.16,1.35.2,2A4,4,0,0,0,35,19.91,3.87,3.87,0,0,1,35.09,21c0,.68.11,1.36.22,2a1.47,1.47,0,0,1-.21,1.09c-.2.27-.3.74-.82.7a.47.47,0,0,0-.36.24c-.18.3-.4.26-.64.06a.59.59,0,0,0-.22-.12c-1.15-.35-1.31-1.33-1.44-2.31a3.37,3.37,0,0,0-.21-1.24,3.41,3.41,0,0,1-.15-1.12c-.06-.57-.12-1.15-.14-1.72,0-1.08-.14-2.16-.28-3.24,0-.37-.3-.66-.6-.57-.59.17-1.22,0-1.77.24s-1.35.32-2,.58a1.22,1.22,0,0,1-.87.08c-.28-.1-.54.09-.82.1a9.76,9.76,0,0,1-2.09-.22c-.5-.1-.64,0-.57.51.19,1.44.21,2.89.39,4.32,0,.05,0,.1,0,.13a3.68,3.68,0,0,1,.39,1.84,2.53,2.53,0,0,1-.65,1.78.45.45,0,0,1-.22.1c-.29.06-.56.18-.83-.1s-.51.28-.8.08a.64.64,0,0,1-.16-.11,2.86,2.86,0,0,1-.95-1.87,3.61,3.61,0,0,0-.27-.92c-.16-.68-.11-1.39-.25-2.08-.18-.87-.14-1.77-.33-2.65a3.27,3.27,0,0,1-.09-2,.17.17,0,0,0,0-.12A13.34,13.34,0,0,1,18,12.24a1.66,1.66,0,0,1,0-.32A35.88,35.88,0,0,0,18,8c0-.75-.09-1.51-.11-2.26a2.92,2.92,0,0,0-.17-.87,1.49,1.49,0,0,1,0-1,2.09,2.09,0,0,1,.61-.77c.49-.49,1-.27,1.47-.2l.12.06c.18.13.47,0,.62.23a3.47,3.47,0,0,1,.68,1.54c.06.91.07,1.82.21,2.73.06.43,0,.89.07,1.32a11.11,11.11,0,0,0,.21,2.76c.07.18.13.35.35.28a2.16,2.16,0,0,1,1.48.23,3,3,0,0,0,1.88.05,7.6,7.6,0,0,1,2.23-.49,2,2,0,0,0,.61-.18,2.73,2.73,0,0,1,1.06-.19,1.84,1.84,0,0,0,.69-.13.55.55,0,0,0,.43-.57c0-.38,0-.76-.06-1.15a7.64,7.64,0,0,1-.11-2.08c0-.08,0-.19,0-.24-.29-.36-.17-.78-.19-1.18A4,4,0,0,0,30,5.17a3.7,3.7,0,0,1-.07-1.25,9.56,9.56,0,0,0-.14-1.58A3.23,3.23,0,0,1,30.3.5c.07-.12.3-.26.37-.22C31.19.54,31.5-.16,32,0s1.45,1.07,1.38,1.81C33.39,2.15,33.41,2.45,33.41,2.75Z'
|
|
+'M46.85,35.56a13.08,13.08,0,0,0,2.84-.2,3.45,3.45,0,0,1,1.28,0,5.7,5.7,0,0,0,1.25.11,12.16,12.16,0,0,1,1.57.13,9.33,9.33,0,0,0,1.57.18c.56,0,1.12-.06,1.67-.07a3,3,0,0,1,1.67.52l0,0a7.26,7.26,0,0,1,.35,1.33,1.33,1.33,0,0,1-.56,1,2.51,2.51,0,0,1-1.45.56,11.83,11.83,0,0,0-1.68.09,1.13,1.13,0,0,1-.66,0,3.1,3.1,0,0,0-1.5-.18c-.48,0-.63.15-.64.61a16.49,16.49,0,0,0,.14,2.11c0,.08.08.16.07.23A23.88,23.88,0,0,0,53,44.5c0,1.64-.06,3.29,0,4.94,0,1.13.2,2.27.18,3.4A6.63,6.63,0,0,1,53,54.77a.9.9,0,0,1-.42.51,8.68,8.68,0,0,1-.92.45.8.8,0,0,1-.75-.12,2.3,2.3,0,0,1-1.22-2.39,3.87,3.87,0,0,0,0-1,4.65,4.65,0,0,1,.05-1.34,3.31,3.31,0,0,0-.08-1.08,27.66,27.66,0,0,0-.18-2.88c0-.14.06-.32.07-.48a23,23,0,0,0-.21-3.71c-.05-.4,0-.82,0-1.22a2.64,2.64,0,0,0-.08-1c-.11-.27.08-.51.09-.78,0-.7-.16-.87-.86-.75a1.53,1.53,0,0,1-.37,0c-1-.12-2,.05-2.95,0a3.18,3.18,0,0,1-1.43-.63.42.42,0,0,1-.16-.32A3.46,3.46,0,0,1,44,36.1c.15-.31.59-.37.93-.39A10.43,10.43,0,0,1,46.85,35.56Z'
|
|
+'M63.84,1.26a6.68,6.68,0,0,1,1.26-.09,5.22,5.22,0,0,1,2.49.38,1.56,1.56,0,0,0,.6.19A9.69,9.69,0,0,1,71.59,3a3.92,3.92,0,0,1,1.58,1.43A4.43,4.43,0,0,1,73.9,6.7,4.12,4.12,0,0,0,74,8.1a.25.25,0,0,1,0,.19c-.29.55-.17,1.21-.48,1.77a4.53,4.53,0,0,0-.34,1.55,4.85,4.85,0,0,1-.61,1.52c-.13.28-.35.53-.48.82a3.34,3.34,0,0,1-1.51,1.42,9.44,9.44,0,0,1-3.24,1.11,16.85,16.85,0,0,1-2.45.37c-.24,0-.34.15-.35.37a2.27,2.27,0,0,0,0,.64A13.51,13.51,0,0,1,65,21.07a12.85,12.85,0,0,1,.32,2.46,1.74,1.74,0,0,0,.11.63,1.93,1.93,0,0,1-.62,2.12s-.09.14-.13.13c-.41-.05-.81.17-1.2.14A2.34,2.34,0,0,1,62.33,26s0-.08-.07-.1c-.21-.2.06-.5-.09-.64s-.36-.2-.45-.42a1.47,1.47,0,0,1,0-.88c0-.17.09-.33,0-.49a1.72,1.72,0,0,1-.2-.8,16.25,16.25,0,0,1-.34-3.1A.68.68,0,0,0,61,19c-.14-.13-.1-.32-.09-.49a4.23,4.23,0,0,0-.28-1.69.31.31,0,0,1-.05-.12c0-1.12-.56-2.13-.58-3.24a5.6,5.6,0,0,0-.24-1.06c-.16-.62-.15-1.26-.25-1.89-.06-.37-.2-.7-.27-1.05-.17-.92-.52-1.8-.68-2.7A7.56,7.56,0,0,1,58,4.09.8.8,0,0,0,58,3.72a.57.57,0,0,1,.22-.78.57.57,0,0,0,.24-.37c0-.13.11-.27.23-.27a1.31,1.31,0,0,0,.78-.4,2.81,2.81,0,0,1,1.4-.36A13.68,13.68,0,0,1,63.84,1.26Zm-1.77,4a8.47,8.47,0,0,1,.39,1.52,20.22,20.22,0,0,1,.78,3.53c.08.58.15,1.15.24,1.72s.53,1.1,1.07,1a10.24,10.24,0,0,0,2.12-.31c.35-.15.78-.2,1.14-.32a1.68,1.68,0,0,0,1.11-.87,12.57,12.57,0,0,0,.71-1.75,6.28,6.28,0,0,0,.27-2.89A.87.87,0,0,0,69.15,6a19.87,19.87,0,0,1-2-.58A14.74,14.74,0,0,0,65,5c-.81-.1-1.61.16-2.43,0A.56.56,0,0,0,62.07,5.23Z'
|
|
+'M23.39,54.81c-.21.43.11,1-.23,1.47-.18.24-.45.34-.6.59,0,.09-.19,0-.28,0s-.2-.19-.32-.15a1.61,1.61,0,0,1-1.15-.24,1.37,1.37,0,0,1-.83-1.4c0-.1.1-.21,0-.3a2.29,2.29,0,0,1-.24-1.12,11.75,11.75,0,0,1-.2-1.88,6.45,6.45,0,0,0-.28-2,3,3,0,0,1-.07-.94,11.68,11.68,0,0,0-.43-3,.76.76,0,0,1,0-.47.25.25,0,0,0,0-.18,8.25,8.25,0,0,1-.44-1.76,6,6,0,0,1-.18-1,6.77,6.77,0,0,0-.35-1.34c-.15-.49-.08-1-.23-1.5,0-.12,0-.26-.11-.34-.51-.41-.4-1-.57-1.56a.31.31,0,0,1,.09-.34.46.46,0,0,0,.14-.59c-.06-.13,0-.26.12-.29s.4-.51.75-.17c.07.06.16-.09.23-.16.42-.43.72-.4,1.2,0A3.73,3.73,0,0,1,20.57,38a2.3,2.3,0,0,0,.32.78,1.18,1.18,0,0,1,.22.56c0,.64.31,1.22.33,1.86a2,2,0,0,0,.26,1,.75.75,0,0,1,.09.41,15.34,15.34,0,0,0,.43,2.7c.14.7.21,1.41.31,2.11.12.88.16,1.78.34,2.65.09.46.08.93.13,1.4a21.23,21.23,0,0,0,.37,3.08A1.59,1.59,0,0,1,23.39,54.81Z',
|
|
etc3:'M4,5.06a2.28,2.28,0,0,0-1-.55A7.91,7.91,0,0,1,.27,2.31,1.62,1.62,0,0,1,.53.24a1.84,1.84,0,0,1,2,.13A6.2,6.2,0,0,0,4.6,1.72a41.82,41.82,0,0,0,5.22,2c1.57.47,3.17.82,4.75,1.27s3.1.75,4.64,1.19c3.13.89,6.24,1.86,9.37,2.74,1.14.31,2.3.54,3.41.95a14.28,14.28,0,0,0,2.27.47c2.32.39,4.66.69,7,1,3.11.47,6.26.63,9.36,1.25a19.15,19.15,0,0,0,2.93.3c2.06.11,4.11.38,6.15.4,1.74,0,3.47.17,5.21.18.91,0,1.83.08,2.74.15a30.36,30.36,0,0,0,3.93-.22c1.79-.07,3.59-.09,5.37-.2a41.49,41.49,0,0,0,6.75-.74c1.82-.41,3.66-.76,5.49-1.15,1.41-.3,2.78-.77,4.18-1.13a52.85,52.85,0,0,0,7.69-3c1.82-.79,3.63-1.57,5.36-2.52a27.56,27.56,0,0,0,3.76-2.32c.89-.7,1.92-1.23,2.86-1.89.31-.22.71-.39,1,0,.61-.59.75.07.92.4s.52.37.34.75-.11,1.08-.58,1.44c-.26.21-.52.41-.79.6A62.38,62.38,0,0,1,107.18,8c-1.33.69-2.72,1.26-4.11,1.82s-2.51,1.38-3.95,1.7a12,12,0,0,0-2.25,1,25.67,25.67,0,0,1-4.54,1.33c-1,.27-2,.7-3.11.89-1.48.25-3,.54-4.45.86a28.26,28.26,0,0,1-5.34.74c-1,.07-2,.24-3,.22-2.29-.07-4.55.36-6.84.35-1.15,0-2.3.06-3.45,0-2-.12-4-.17-6-.32-1.08-.08-2.17.08-3.25-.1-1.47-.24-3,0-4.44-.31-.12,0-.25,0-.38.06a10,10,0,0,0-2.32-.38,19.25,19.25,0,0,0-3.2-.53,20.41,20.41,0,0,1-2.83-.3c-1.78-.39-3.59-.45-5.39-.67-1.33-.16-2.67-.37-4-.62-2.31-.44-4.58-1.11-6.87-1.69a10.15,10.15,0,0,0-2.38-.68.28.28,0,0,0-.37-.13l-.05,0c-1.51-.48-3-1-4.55-1.44A29.7,29.7,0,0,0,15.3,8.61h0a.6.6,0,0,0-.58-.19.1.1,0,0,0-.17,0,.59.59,0,0,0-.46-.12c-1.21-.53-2.53-.66-3.76-1.09-1.07-.37-2.19-.56-3.24-1A22.9,22.9,0,0,0,4,5.06Z'
|
|
+'M52.1,16.2c.13,0,.26-.09.38-.06,1.47.28,3,.07,4.44.31,1.08.18,2.17,0,3.25.1,2,.15,4,.2,6,.32,1.15.08,2.3,0,3.45,0,2.29,0,4.55-.42,6.84-.35,1,0,2-.15,3-.22l.15.32C79,18.21,78.51,19.82,78,21.4c-.85,2.56-2,5-2.9,7.54A37.57,37.57,0,0,1,73,33.5c-.68,1.3-1.12,2.73-1.87,4a7.91,7.91,0,0,1-2.76,3.26,1.75,1.75,0,0,1-2.19-.15,12.33,12.33,0,0,1-3-3.9c-1.13-2.29-2.29-4.57-3.6-6.77a52.16,52.16,0,0,1-2.48-4.59,50.7,50.7,0,0,0-3.38-6c-.39-.61-.73-1.25-1.09-1.88Z'
|
|
+'M52.1,16.2l.55,1.23c-.65,1.06-1.28,2.15-2,3.19a66.82,66.82,0,0,1-4.18,5.85,25.17,25.17,0,0,0-2.44,3.44c-.48.86-1.19,1.58-1.71,2.42a40.38,40.38,0,0,1-4.42,5.42,1.86,1.86,0,0,1-2.57.46,2,2,0,0,1-.72-.79,36.52,36.52,0,0,1-1.76-4.92c-.29-.88-.59-1.76-.83-2.64a49.49,49.49,0,0,1-1.33-5.13A25.65,25.65,0,0,0,30,21.78c-.48-1.67-.81-3.38-1.24-5.06-.36-1.47-.73-2.93-1.09-4.39L27.5,12c2.29.58,4.56,1.25,6.87,1.69,1.32.25,2.66.46,4,.62,1.8.22,3.61.28,5.39.67a20.41,20.41,0,0,0,2.83.3,19.25,19.25,0,0,1,3.2.53A10,10,0,0,1,52.1,16.2Z'
|
|
+'M27.5,12l.12.32a41.93,41.93,0,0,1-2.7,3.4c-1.46,1.95-3.23,3.64-4.8,5.5-1,1.12-2.06,2.12-3.12,3.15C15.4,26,14,27.65,12.46,29.32A9.93,9.93,0,0,1,10.4,31a1.65,1.65,0,0,1-1.8-.4A4.37,4.37,0,0,1,7.27,28.2c-.33-1.88-.63-3.76-.95-5.64-.38-2.32-.71-4.66-1.18-7-.25-1.26-.27-2.54-.51-3.81A52.49,52.49,0,0,1,4,6.32,2,2,0,0,1,4,5.06a22.9,22.9,0,0,1,3,1.12c1,.45,2.17.64,3.24,1,1.23.43,2.55.56,3.76,1.09a.34.34,0,0,0,.46.12.1.1,0,0,1,.17,0,.39.39,0,0,0,.58.19h0a6.25,6.25,0,0,0,1,.65,44.94,44.94,0,0,0,6.58,2.29,1.79,1.79,0,0,0,1.83-.37l.05,0a.4.4,0,0,0,.37.13A10.15,10.15,0,0,1,27.5,12Z'
|
|
+'M79.58,16.64l-.15-.32a28.26,28.26,0,0,0,5.34-.74c1.48-.32,3-.61,4.45-.86,1.08-.19,2.07-.62,3.11-.89a25.67,25.67,0,0,0,4.54-1.33,12,12,0,0,1,2.25-1c1.44-.32,2.57-1.28,3.95-1.7,0,.08-.06.23-.12.24-.6.14-.53.53-.56,1a42.21,42.21,0,0,1-.55,4.9c-.32,1.72-.62,3.44-.94,5.16-.44,2.4-.68,4.82-1.12,7.22a25.23,25.23,0,0,1-1.58,5.81,2.36,2.36,0,0,1-3.67,1.1,14.18,14.18,0,0,1-3.71-3.93c-1.22-1.63-2.37-3.32-3.74-4.85A46.46,46.46,0,0,1,83,20.94c-.91-1.37-2-2.65-3-4A.86.86,0,0,0,79.58,16.64Z',
|
|
etc4:'M96.78,28.77c0-5.13-1-10.19-1.17-15.3-.12-2.82-1.53-5.21-3.15-7.36S87.91,3,85.38,2.05C79.88,0,74.06-.26,68.27.17,65.18.4,62.12.39,59,.4A29.11,29.11,0,0,0,54.76.27c-4,.61-8.08.65-12.13.89s-8.24.53-12.37.71c-2.26.1-4.46.64-6.7.83A58.63,58.63,0,0,0,9.6,6a11.37,11.37,0,0,0-7.54,8C.59,19.1.43,24.37.05,29.6a34.24,34.24,0,0,0,1.07,9.62c.69,3.24,2.44,6,5.76,7.27a24.12,24.12,0,0,0,6.23,1.83,48.81,48.81,0,0,0,6.73.18c4.73-.15,9.47,0,14.2-.08,4.25,0,4.89.31,6.55,4.13q2.32,5.34,4.58,10.7a4.77,4.77,0,0,0,8,1.7,15.47,15.47,0,0,0,1.92-2.78C57.67,58.26,58,53.53,60,49.39c.61-1.3,1.14-2.06,2.68-2.21,2.62-.26,5.26-.06,7.88-.38A96.53,96.53,0,0,0,87.65,43a12.37,12.37,0,0,0,9.12-11.76C96.81,30.43,96.78,29.6,96.78,28.77ZM32.39,20.66c-.91,5.12-2.05,10.16-5.73,14.2-2.27,2.49-4.18,2.6-6.4.07a15.24,15.24,0,0,1-2.34-3.58,40.93,40.93,0,0,1-3.06-8.23A3.84,3.84,0,0,1,16,19.21c1.22-1.09,2.63-.72,4-.16a9.24,9.24,0,0,1,3.26,2.77,2.64,2.64,0,0,0,1.14-1.36,8.37,8.37,0,0,1,3-3,3.26,3.26,0,0,1,3.44-.09A3.05,3.05,0,0,1,32.39,20.66Zm16.5,5.65c0,2.9-.26,5.72-2.33,8a5.33,5.33,0,0,1-6.58,1c-1.18-.77-1.49-1.57-1-2.64s1.13-1.21,2.47-.88c2.14.54,2.72.19,3.31-2,.4-1.46.22-1.67-1.3-1.56a2.85,2.85,0,0,1-3.32-2.05,9,9,0,0,1-.54-3.77c.14-1.54.5-3.16,2.19-3.63,1.84-.52,3.77-.52,5.25,1.07a5.94,5.94,0,0,1,1.89,4.44C48.87,25,48.89,25.63,48.89,26.31Zm11.24,4.28a5.89,5.89,0,0,1-5.91,4.62,4.2,4.2,0,0,1-3.15-1.53,2.25,2.25,0,0,1-.2-2.91,2.06,2.06,0,0,1,2.68-.17c1.63.93,2.25.68,2.86-1.09a12.07,12.07,0,0,0,.24-1.78c.21-1.13-.15-1.54-1.34-1.73-3.28-.52-4.79-3.27-3.63-6.37a3.5,3.5,0,0,1,2.77-2.08,4.73,4.73,0,0,1,5.39,3c.7,1.66.53,3.4.81,5.8A15.39,15.39,0,0,1,60.13,30.59Zm9.14,1a4.61,4.61,0,0,1-3.69,3c-1.37.23-2.37-.23-2.67-1.33s0-1.74,1.4-2.35a4.85,4.85,0,0,0,2.57-4.69c-.12-.61-.56-.55-1-.6-2.68-.25-3.74-1.39-4.25-4.51a4.54,4.54,0,0,1,2.57-5c2.11-1.05,4.3-.23,5.43,2A17.82,17.82,0,0,1,71,24.85,18.39,18.39,0,0,1,69.27,31.58ZM87.7,30.44a1.81,1.81,0,0,1-2.24.55,12.08,12.08,0,0,1-1.58-.86,17.61,17.61,0,0,0-4.34-1.77c-.58.83-.05,1.68-.24,2.48-.26,1.17-.87,1.95-1.79,2S76,32.28,75.6,31s.14-2.53-.14-3.81c-.49-2.2-.85-4.42-1.28-6.64a11.88,11.88,0,0,1-.27-1.32,2.07,2.07,0,0,1,1.51-2.42c1-.16,1.57.34,2.07,1.67.43,1.13.34,2.39,1,3.62a12.83,12.83,0,0,0,3.7-3.41c1.23-1.4,2.33-1.82,3.21-1.09S86.13,20,85,21.27c-1,1.13-2,2.2-3.22,3.49A12.69,12.69,0,0,0,85,26.37a6.51,6.51,0,0,1,2.57,1.78A1.74,1.74,0,0,1,87.7,30.44Z',
|
|
etc5:'M11,40.48c1.86-.39,2.81,1.27,4.1,2.27,0,0,0,.12.09.15,2.13,1.38,3,3.94,5.33,5.27,1.25.73,2.35,1.78,3.81,2a13,13,0,0,0,6.54-.32c1.64-.57,3.14-.12,4.66.26,1.28.32,1.57,1.6,1.84,2.65a3.11,3.11,0,0,1-.65,3,18.13,18.13,0,0,0-3.42,5.38,19.76,19.76,0,0,1-1.8,3.59c-1.13,1.76-1,3.67-1,5.55a12.58,12.58,0,0,0,.7,4.32,7.56,7.56,0,0,1,.25,3.51,3.84,3.84,0,0,1-2.64,3,3.21,3.21,0,0,1-3.43-.85,19.27,19.27,0,0,1-2.64-3.52c-.95-1.26-1.78-2.73-3.07-3.57C17,71.55,14.37,69.91,11,70.6A35.11,35.11,0,0,1,5.24,71a3.22,3.22,0,0,1-2.69-1.84c-.56-.86-1.17-1.78-.41-3.11a7.11,7.11,0,0,1,2.4-2.7,14.8,14.8,0,0,0,3-2.51,4,4,0,0,0,1-2.47A35.31,35.31,0,0,0,7.28,46c-.46-1.52-.68-3.23.77-4.59,1-.93.95-1,2.9-.93'
|
|
+'M59.81,45.84c-1.8.24-2.9-1.11-3.92-2.59-.55-.79-.91-1.67-1.45-2.47-1.44-2.16-2.52-2.28-4.87-1.93-1.62.25-3.2.64-4.79-.17s-2.54-3.54-1.54-5.09c.79-1.22,1.78-2.32,2.68-3.47L46,30c1.39-1.57,1.46-1.75.42-3.5A19.36,19.36,0,0,1,45,23.8a8.16,8.16,0,0,1-.71-3.72c.14-1.7,1.43-2.34,2.57-2.88a3.19,3.19,0,0,1,3.61.75c1.34,1.31,2.72,2.57,3.94,4a4.17,4.17,0,0,0,3.78,1.44,23.57,23.57,0,0,1,4.89.2,3.75,3.75,0,0,1,3.06,2.6A3.69,3.69,0,0,1,65.34,30c-2.52,2.07-2.06,4.82-2,7.51,0,1.51.27,3,.3,4.53a4,4,0,0,1-3.85,3.83'
|
|
+'M14,14.72a5.66,5.66,0,0,1-.22,3.66,2.23,2.23,0,0,1-3.64.88,3.56,3.56,0,0,1-1.26-3.13c.09-2.65-.26-2.9-2.72-2A9,9,0,0,1,2,14.9,2.24,2.24,0,0,1,.19,11.77,3.36,3.36,0,0,1,2.45,9.86a6,6,0,0,0,1.76-.58,3.7,3.7,0,0,0-.9-1.42,3.43,3.43,0,0,1-.65-2.55c.06-1.24.95-1.48,1.84-1.93s1.38,0,2,.49c.34.29.64.64,1,.92.68.51,1.07.36,1.11-.47a13.28,13.28,0,0,1,.29-2.18A2.58,2.58,0,0,1,11.51,0a2.53,2.53,0,0,1,2.18,2,8.28,8.28,0,0,1,.15,2.53c-.05,1.1.15,1.21,1.12.76,1.13-.52,2.23-1.12,3.39-1.57,1.5-.57,2.19-.25,3.07,1.22a2.42,2.42,0,0,1-.59,2.93,11.08,11.08,0,0,1-2.52,1.68c-.84.42-.84.76-.12,1.34a6.84,6.84,0,0,0,.86.53,3.32,3.32,0,0,1,1.61,3.91,2.58,2.58,0,0,1-3.4,1.19c-1-.6-2-1.3-3-2l-.34.14',
|
|
etc7:'M31.76,0A37.8,37.8,0,0,1,44.85,2.25a22.58,22.58,0,0,1,4.09,2c1.89,1.17,3.91,2.13,5.77,3.36a26.82,26.82,0,0,1,6,5.78,14.64,14.64,0,0,1,2.81,5.75,15.26,15.26,0,0,1,.27,6.06,6.69,6.69,0,0,1-.72,2,25.75,25.75,0,0,1-5.33,7.58,29.4,29.4,0,0,1-8.26,5.6,51.07,51.07,0,0,1-5.1,2A24.06,24.06,0,0,1,38,43.46c-1.95.06-3.89.28-5.84.32A38.5,38.5,0,0,1,27,43.41c-2.59-.3-5.08-1-7.61-1.55a21.5,21.5,0,0,1-5.61-2.29c-1.4-.75-2.82-1.49-4.16-2.35a23.55,23.55,0,0,1-6.32-5.78A15.67,15.67,0,0,1,0,22.23a16.72,16.72,0,0,1,1.41-6.52,36.74,36.74,0,0,1,2.82-5.38A13.63,13.63,0,0,1,7.34,6.88C8.4,6,9.5,5.24,10.59,4.43a7,7,0,0,1,1.83-.87,48.05,48.05,0,0,1,7.49-2.5C22,.67,24.18.5,26.32.25c2-.24,4-.21,5.44-.25m-8.9,20,.26,0a4.24,4.24,0,0,1,.25.91,56.92,56.92,0,0,0,.75,6.64,1.57,1.57,0,0,0,1.07,1.3,1.35,1.35,0,0,0,1.41-.43,1.7,1.7,0,0,0,.29-1.69,61.85,61.85,0,0,1-1.15-9.59,8.08,8.08,0,0,0-.44-2.34A1.67,1.67,0,0,0,23,13.71c-.6.22-.79.78-1,1.27-.74,1.67-1.43,3.37-2.15,5.06-.38.89-.79,1.77-1.26,2.85a8.11,8.11,0,0,1-1.07-1.64c-.85-2-1.82-3.89-2.84-5.79a2.23,2.23,0,0,0-.75-.91A1.78,1.78,0,0,0,12,14.39a1.51,1.51,0,0,0-.64,1.55c0,1.08.11,2.15.17,3.23a23.21,23.21,0,0,1,0,3.82,22.53,22.53,0,0,0-.07,3.58A1.4,1.4,0,0,0,13,28a1.56,1.56,0,0,0,1.13-1.52c-.13-1.4.19-2.78.13-4.18,0-.25-.13-.57.25-.72.31.16.36.49.51.76a24.59,24.59,0,0,0,2.56,4.16A1.36,1.36,0,0,0,20,26.39a14.12,14.12,0,0,0,1.26-2.7c.51-1.24,1-2.47,1.58-3.7m28.87,3.07-.23,0c-.31-.42-.62-.83-.92-1.25a76.17,76.17,0,0,1-4.09-6.45,1.15,1.15,0,0,0-.57-.56c-1.18-.52-2.17.24-2,1.58.31,2.79,0,5.58.05,8.36,0,1.15.08,2.31.19,3.46a1.5,1.5,0,0,0,1.33,1.16,1.26,1.26,0,0,0,1.21-1.1,3.17,3.17,0,0,0,.12-1.18c-.24-1.66,0-3.34-.13-5,0-.21-.11-.49.17-.61a.47.47,0,0,1,.38.28c.89,1.32,1.77,2.64,2.68,3.95q.89,1.28,1.86,2.49a1.32,1.32,0,0,0,1.5.49,1.35,1.35,0,0,0,1-1.25,9.48,9.48,0,0,0,0-1.07A14.66,14.66,0,0,1,54.35,24a55.22,55.22,0,0,0,.24-7.16,3,3,0,0,0-.14-1.07,1.4,1.4,0,0,0-1.29-1,1.55,1.55,0,0,0-1.32,1.47c0,.95,0,1.91,0,2.86,0,1.34-.07,2.68-.1,4m-16,6a3.07,3.07,0,0,0,1.57-.22,8.31,8.31,0,0,0,4.45-5.87c.29-1.2-.41-2.15-.94-3.12A13.38,13.38,0,0,0,38.16,17a4.2,4.2,0,0,0-5-1,6.49,6.49,0,0,0-3.56,8.67c.61,2,2.26,2.92,3.92,3.81a3.27,3.27,0,0,0,2.2.62'
|
|
+'M35.89,26.31a5.58,5.58,0,0,1-3.65-2.48,4,4,0,0,1,.38-4.39,2.46,2.46,0,0,1,3.73-.4,9.81,9.81,0,0,1,2.38,2.63,1.47,1.47,0,0,1,.12,1.46A8,8,0,0,1,37,25.85a2,2,0,0,1-1.08.46',
|
|
etc8:'M29.85,0A38.5,38.5,0,0,1,44.49,2.11a26.65,26.65,0,0,1,4.43,2.08C51,5.4,53.13,6.45,55.11,7.81a28.11,28.11,0,0,1,5.24,5,14.52,14.52,0,0,1,2.79,5c1.14,3.57,1.35,7.07-.64,10.51a27.53,27.53,0,0,1-4.74,6.4,28.84,28.84,0,0,1-8.25,5.61,48.87,48.87,0,0,1-5.23,2,24.42,24.42,0,0,1-6.22,1.06l-5.49.28a35.74,35.74,0,0,1-5.37-.3,76.84,76.84,0,0,1-9-1.84,12.16,12.16,0,0,1-3.28-1.4A58.34,58.34,0,0,1,9.18,37a22.93,22.93,0,0,1-6.87-7A16,16,0,0,1,0,22.35a14.56,14.56,0,0,1,.76-4.83A31.6,31.6,0,0,1,4.43,10,12.12,12.12,0,0,1,7.16,7c1.15-.91,2.33-1.81,3.53-2.67A11.08,11.08,0,0,1,13.2,3.25c.67-.26,1.34-.5,2-.77A31.65,31.65,0,0,1,25,.37,43.75,43.75,0,0,1,29.85,0M32.2,23.1c1.07.61,2,1.11,2.85,1.65a3.87,3.87,0,0,1,1.21,1.14,12.09,12.09,0,0,0,1.44,1.59,6.9,6.9,0,0,0,2,1.47,1.19,1.19,0,0,0,1.48-.41,1.06,1.06,0,0,0-.2-1.41,10.17,10.17,0,0,0-1.29-1.07,4.49,4.49,0,0,1-1.18-1.16,7.55,7.55,0,0,0-2.76-2.41c-.36-.18-.84-.27-1-.84a7,7,0,0,0,2.08-1.78A4.37,4.37,0,0,0,36,13.54,6.23,6.23,0,0,0,29.55,13c-1.06.51-1.32.9-1.19,2.07s.3,2.2.47,3.3c.3,2,.73,3.92.88,5.91a40.3,40.3,0,0,0,.68,4.36,1.2,1.2,0,0,0,1.46,1.08A1.27,1.27,0,0,0,33,28.27,6.61,6.61,0,0,0,32.55,26a7.67,7.67,0,0,1-.35-2.94M17.73,17.38a36.83,36.83,0,0,1,3.75-.46,18.75,18.75,0,0,0,3.88-.58,2,2,0,0,0,.85-.41,1,1,0,0,0-.34-1.79,1.22,1.22,0,0,0-.82,0,30.26,30.26,0,0,1-5.68.81,12.93,12.93,0,0,1-2.83.23c-1.37-.13-1.91.42-1.55,1.75.44,1.66.79,3.33,1.19,5a49.16,49.16,0,0,1,1,6.38,2.08,2.08,0,0,0,.5,1.31,1.13,1.13,0,0,0,1.94-.31,1.87,1.87,0,0,0,0-1.05,43.43,43.43,0,0,0-.82-5.55c-.12-.46,0-.75.58-.81,2.07-.2,4.05-.88,6.09-1.2a4,4,0,0,0,1.15-.34c.4-.2.77-.54.67-1a1.15,1.15,0,0,0-.9-.87,2.8,2.8,0,0,0-.71-.05,8.17,8.17,0,0,0-2.35.41,35.33,35.33,0,0,1-4.08.9c-1,.19-1.18,0-1.37-1-.08-.39-.11-.79-.18-1.31M46.83,29.3a10.81,10.81,0,0,0,1.56-.25,1,1,0,0,0,.83-.91c0-.41.05-.81-.46-1s-.44-.6-.53-1c-.37-1.64-.2-3.34-.57-5-.34-1.48-.61-3-.9-4.45-.12-.63-.31-1.22.51-1.62a1,1,0,0,0,.41-1.25,1.16,1.16,0,0,0-1.1-.77,2.46,2.46,0,0,0-.71.08,9.41,9.41,0,0,1-2.23.4,1.16,1.16,0,0,0-1.16.87c-.12.33.36,1.08.85,1.15.82.12.88.66,1,1.27a58.16,58.16,0,0,1,1.3,9.1c0,.59,0,.91-.61,1s-.64.36-.7.82a1,1,0,0,0,.49,1c.62.5,1.39.29,2,.52'
|
|
+'M30.81,15.52c-.14-.46.11-.75.71-.84a4,4,0,0,1,3.15.74c1.37,1.12.61,3-.34,3.74A4.73,4.73,0,0,1,32,19.9c-.35.05-.49-.19-.55-.49,0-.08,0-.16,0-.23l-.56-3.66',
|
|
etc9:'M31.56,0a37.61,37.61,0,0,1,12,1.74,33.25,33.25,0,0,1,6.19,2.82c1.61.94,3.31,1.73,4.88,2.76a28.17,28.17,0,0,1,5.75,5.37,15.39,15.39,0,0,1,2.71,4.73,14.73,14.73,0,0,1,.64,7.89,5.56,5.56,0,0,1-.52,1.33,25,25,0,0,1-5.6,8.1,28.7,28.7,0,0,1-8,5.42c-1.64.71-3.25,1.47-5,2a23.68,23.68,0,0,1-6.45,1.18c-1.75.09-3.49.2-5.24.32a34.15,34.15,0,0,1-5.72-.25c-2.63-.27-5.17-1-7.75-1.48a21.35,21.35,0,0,1-5.61-2.23A38.4,38.4,0,0,1,9,37a23.11,23.11,0,0,1-6.59-6.66A16.33,16.33,0,0,1,0,22.91a14.19,14.19,0,0,1,.71-5.07,30.7,30.7,0,0,1,3.57-7.52,12.78,12.78,0,0,1,3-3.26c1-.82,2.06-1.64,3.13-2.41a17.35,17.35,0,0,1,3.26-1.46A29.49,29.49,0,0,1,21.55.82,70.36,70.36,0,0,1,30.72,0h.84M18.18,29.86a9.28,9.28,0,0,0,1.06-.1,8.85,8.85,0,0,0,1.15-.31,4.59,4.59,0,0,0,1.66-7.61A6.5,6.5,0,0,0,20.62,21a19,19,0,0,0-3.3-1.36c-.35-.11-.86-.21-.9-.69a7.16,7.16,0,0,1,.11-2.73c.24-.74.64-.93,1.46-.86a7.37,7.37,0,0,1,3.31,1.29,5,5,0,0,0,2,1c.9.11,1.39-.49,1.19-1.37a1.77,1.77,0,0,0-.92-1,15.89,15.89,0,0,0-4.26-2.13c-1.33-.37-2.7-.54-3.83.5a4.46,4.46,0,0,0-1.4,2.44,11.64,11.64,0,0,0-.16,2.5,2.92,2.92,0,0,0,2.36,3.25A20.84,20.84,0,0,1,20,23.42c1.07.63,1.3,2.62.38,3.3a3.65,3.65,0,0,1-2.36.69c-.74,0-1.08-.59-1.46-1.1a2.79,2.79,0,0,0-1.22-1.11,1.15,1.15,0,0,0-1.39.34,1,1,0,0,0,0,1.3A12,12,0,0,0,15.76,29a3,3,0,0,0,2.42.85m11.06-6.42a10.75,10.75,0,0,0,3.47-.73c1.67-.47,1.36-.37,1.84.93.12.34.19.69.28,1,.27,1,.5,2,.82,3a1.25,1.25,0,0,0,1.4.86c.63-.11.74-.68.94-1.13a1.26,1.26,0,0,0-.09-.7c-.15-.57-.32-1.15-.48-1.72a29.16,29.16,0,0,0-2.75-7.23,16.54,16.54,0,0,0-2.76-4,1.83,1.83,0,0,0-3,.36A15.94,15.94,0,0,0,27,19.24a31.67,31.67,0,0,0-.2,5.84,12.44,12.44,0,0,0,.15,2.5c.17.74.63.71,1.1.78s.78-.29.93-.74a3.26,3.26,0,0,0,.15-1.42,21.41,21.41,0,0,1,.08-2.76m12.61-4.31c-.05,2.48.32,4.86.39,7.25a8.56,8.56,0,0,0,.29,1.88,1.23,1.23,0,0,0,1.32,1,1.14,1.14,0,0,0,1-1.38c-.26-1.54-.24-3.1-.42-4.64-.27-2.38-.15-4.77-.25-7.16a1.66,1.66,0,0,1,1.34-1.82l.93-.24a2.93,2.93,0,0,0,.79-.26,1.14,1.14,0,0,0-.47-2.18,2.82,2.82,0,0,0-1.41.23,20.94,20.94,0,0,1-6.2,1.66c-.44.06-.85.2-1.28.3a.91.91,0,0,0-.72,1c0,.73.45,1.21,1.32,1.17a21.57,21.57,0,0,0,2.25-.27c1.11-.15,1.1-.16,1.15,1a21.83,21.83,0,0,0,0,2.54'
|
|
+'M30.59,15.92a19.83,19.83,0,0,1,2.57,4.15,21.81,21.81,0,0,1-3.11,1c-.7.14-.82,0-.77-.75A7.44,7.44,0,0,1,29.8,18c.26-.65.5-1.3.79-2.06',
|
|
etc10:'M10.69,12c1.86-2.12,2.72-4.77,3.75-7.32.41-1,.76-2.08,1.2-3.09A2.48,2.48,0,0,1,18.07,0,2.65,2.65,0,0,1,20,2.24a4.72,4.72,0,0,1-.27,2.35,39.33,39.33,0,0,1-3.17,7.25,1.75,1.75,0,0,0-.26,1.06A9.47,9.47,0,0,0,14,17.6a5.14,5.14,0,0,0-1.49,2.5A8.62,8.62,0,0,1,11,22.79c-1.86,2-3.74,1.57-4.87-.88a14.69,14.69,0,0,0-2.43-4.26,9.76,9.76,0,0,0-1.59-3.94.43.43,0,0,0-.28-.48A14.9,14.9,0,0,0,1,10.39a2.77,2.77,0,0,1,1.42-3A2.63,2.63,0,0,1,5.51,9a9.71,9.71,0,0,0,1.24,3.06c-.28,1.4,1,2.18,1.34,3.34.15.36.22.87.67.87s.39-.5.52-.81c.65-1.08,1.65-2,1.41-3.47'
|
|
+'M17.38,15.57a3.65,3.65,0,0,0-1.07-2.67A9.47,9.47,0,0,0,14,17.6c.46,3.29-.17,6.52-.52,9.77a.8.8,0,0,1-.9.74,4.25,4.25,0,0,1-1.47,0c-2-.73-4-.64-6-.82C4.26,27.19,3.73,27,3.74,26c0-2.77-.29-5.55-.09-8.33a9.76,9.76,0,0,0-1.59-3.94,1.38,1.38,0,0,1-1,.34h0a3.39,3.39,0,0,1-.25.78,3.39,3.39,0,0,0,.25-.78c-.8.21-.65.88-.72,1.45h0c0,.24,0,.48,0,.72.16.14.23.27.21.4,0-.13-.05-.26-.21-.4A.54.54,0,0,0,.25,17h0a3,3,0,0,0-.07,1.42.31.31,0,0,0-.1.49h0c0,.34.05.68.07,1a1.38,1.38,0,0,1,.17.25s0,.07,0,.11,0-.08,0-.11a1.38,1.38,0,0,0-.17-.25s-.09.11-.08.14.12.17.18.26h0c-.14,2.28.32,4.55,0,6.83s.63,3.19,2.57,3.39c2.21.22,4.48,0,6.64.64a10.38,10.38,0,0,0,4.57.1,2.82,2.82,0,0,0,2.67-3c0-.49.13-1,.2-1.46A36.31,36.31,0,0,0,17.38,15.57ZM.25,18.66h0Z'
|
|
+'M9.28,15.48c.65-1.08,1.65-2,1.41-3.47a.29.29,0,0,0-.3,0h0l-1.58-.12a1.37,1.37,0,0,0,.69.28,1.37,1.37,0,0,1-.69-.28.32.32,0,0,0-.35,0,1,1,0,0,1-1.1.18H6.75c-.28,1.4,1,2.18,1.34,3.34A2.1,2.1,0,0,1,9.28,15.48Zm.83-3.36a1.67,1.67,0,0,1-.53.08A1.67,1.67,0,0,0,10.11,12.12Z'
|
|
+'M1.78,13.23c-.18.31-.65.38-.69.82a1.38,1.38,0,0,0,1-.34A.43.43,0,0,0,1.78,13.23Z'
|
|
+'M117.79,30.58a2.44,2.44,0,0,1,2.6-2.46A2.84,2.84,0,0,1,123.11,31a2.68,2.68,0,0,1-2.88,2.65,2.77,2.77,0,0,1-2.44-3.07'
|
|
+'M104.44,23c2.14,1,3.72,2.39,5.55,3.41a1.92,1.92,0,0,1,.54,3.22,2.26,2.26,0,0,1-2.44.3,10,10,0,0,1-2.85-1.68,9.64,9.64,0,0,0-4.57-1.87c-.88-.17-1.21.09-1,.95a3.41,3.41,0,0,1-.43,2.43c-.42,1-1.17,1-2,.94A2,2,0,0,1,95.55,29c.12-3.21-1-6.33-.53-9.58.2-1.48-.32-3.06-.5-4.59q-.34-2.76-.68-5.51a3.69,3.69,0,0,1,.23-1.83,1.88,1.88,0,0,1,2-1.28A2,2,0,0,1,97.74,7.8c.12.67.17,1.35.24,2,.36,3.43,1.1,6.8,1.1,10.5a43.24,43.24,0,0,0,6.29-2.67,2.12,2.12,0,0,1,2.85.3c.82.95.5,2.28-.78,3.08a15.35,15.35,0,0,0-3,1.95'
|
|
+'M52.43,20.58c1.13-.31,1.69-1.06,2.5-1.37a5.2,5.2,0,0,1,5.9,1.92,8.57,8.57,0,0,1,1.64,5c0,1.16.2,2.33.19,3.49a2,2,0,0,1-2.79,1.92,2.4,2.4,0,0,1-1.3-2.09c-.09-.92-.11-1.85-.13-2.77a5.94,5.94,0,0,0-.6-2.51,1.3,1.3,0,0,0-2.51,0,11.4,11.4,0,0,0-1.66,5.05A4.74,4.74,0,0,1,53.18,31a2.07,2.07,0,0,1-2.31,1.4,2.36,2.36,0,0,1-1.63-2c-.05-1.79-.41-3.55-.5-5.33-.2-3.83-.81-7.61-1.07-11.43a8.18,8.18,0,0,1,0-1.85,2.22,2.22,0,0,1,1.94-1.93c1.21,0,1.83.8,2,2.18.25,2.81.55,5.61.85,8.58'
|
|
+'M39.67,33.71c-3.76-.08-5.69-2.35-7.3-5a14.1,14.1,0,0,1-1.25-2.87,7.23,7.23,0,0,1,1-6.37,9,9,0,0,1,6.52-4.41A6.1,6.1,0,0,1,44,16.91a2.56,2.56,0,0,1,.31,2.74,2.09,2.09,0,0,1-2.53.35c-1-.51-1.83-1.25-3.1-.8a6.43,6.43,0,0,0-3.45,2.94c-.87,1.47-.21,2.91.49,4.22,1.43,2.73,3,3.45,6.08,3.06a9.42,9.42,0,0,1,1.29-.14,1.92,1.92,0,0,1,.61,3.79,16.28,16.28,0,0,1-4.07.64'
|
|
+'M87.81,32.68c-3.42.37-5.45-1.42-7.22-3.58a13.46,13.46,0,0,1-1.47-2.42,6.37,6.37,0,0,1,.2-5.78,8.25,8.25,0,0,1,5.42-4.7,5.64,5.64,0,0,1,5.09,1,2.26,2.26,0,0,1,.6,2.4,2,2,0,0,1-2.26.61c-.94-.33-1.8-.89-2.91-.34a5.9,5.9,0,0,0-2.8,3c-.62,1.4.16,2.61.94,3.69,1.62,2.26,3.1,2.72,5.88,2a8.1,8.1,0,0,1,1.16-.27,1.72,1.72,0,0,1,1,3.3,15.74,15.74,0,0,1-3.62,1.05'
|
|
+'M72.55,34.4c-2.76.14-7.2-2.92-7.84-6-.73-3.54-.14-6.6,2.5-9.18,1.56-1.52,2.82-1.7,4.82-.85a7.69,7.69,0,0,1,2.37,1.72c1.81,1.82,1.5,4.18-.63,5.64A9.08,9.08,0,0,1,69.92,27c-.4.07-.94-.05-1.07.5a1.22,1.22,0,0,0,.5,1.14,4.53,4.53,0,0,0,3.55,1.66,3.58,3.58,0,0,1,.73,0,2.1,2.1,0,0,1,1.92,2.12,2.27,2.27,0,0,1-1.89,2,5.87,5.87,0,0,1-1.11,0m-3-11.47a.64.64,0,0,0,.68.05c.34-.1.76-.14.77-.61,0-.13-.18-.32-.32-.4-.41-.22-.67.1-.94.32a.56.56,0,0,0-.19.64'
|
|
+'M123.49,21.93a16.31,16.31,0,0,1-.13,2.45,1.68,1.68,0,0,1-1.64,1.48,1.85,1.85,0,0,1-2-1.07,2.49,2.49,0,0,1-.33-1c0-3.71-.83-7.31-1.31-11a2.36,2.36,0,0,1,.26-1.42,1.77,1.77,0,0,1,2.93-.35,3.48,3.48,0,0,1,.73,1.68,66.21,66.21,0,0,1,1.44,9.23',
|
|
etc11:'M40.55,40.11A22.23,22.23,0,1,0,15.36,41a28.84,28.84,0,1,0,25.19-.87ZM23.48,19.71c.63-.5,1.27-1,1.89-1.49a2.75,2.75,0,0,1,4.28.68,8,8,0,0,1,.64,1.47c.91,2.7-.75,3.92-3.09,3.95a18,18,0,0,1-3.2-.6A2.27,2.27,0,0,1,23.48,19.71Zm-5.82-.1a2.53,2.53,0,0,1-2.38-2.71A2.67,2.67,0,0,1,18,14.24,2.44,2.44,0,0,1,20.42,17,2.81,2.81,0,0,1,17.66,19.61ZM27.5,72.09a2.46,2.46,0,0,1-2.24-2.56c0-1.37,1.71-3.1,2.93-3a2.65,2.65,0,0,1,2.55,2.73A3.32,3.32,0,0,1,27.5,72.09ZM25.72,55.63a3,3,0,0,1,2.62-3.25A2.38,2.38,0,0,1,30.7,54.6c0,1.93-1.11,3.33-2.7,3.35A2.46,2.46,0,0,1,25.72,55.63ZM37.57,28a5.45,5.45,0,0,1-.67,1.23,10.69,10.69,0,0,1-4.67,3.68,10.21,10.21,0,0,1-4.42,1.23A13.38,13.38,0,0,1,21,31.35a2.19,2.19,0,0,1,0-3.81,1.46,1.46,0,0,1,1.84,0c1.11.62,2.19,1.28,3.34,1.84a4,4,0,0,0,4-.21A9.82,9.82,0,0,0,34,25.94a2.14,2.14,0,0,1,2.76-1A2.29,2.29,0,0,1,37.57,28ZM36.24,17.11a2.31,2.31,0,0,1-2.13-2.44A2.47,2.47,0,0,1,36.48,12a2.39,2.39,0,0,1,2.46,2.57A2.5,2.5,0,0,1,36.24,17.11Z',
|
|
etc12:'M56.26,21.13c.45-1.15.74-2,1.07-2.75a3.82,3.82,0,0,1,4.13-2.67c1.8.06,2.6.37,5.09,2a10.88,10.88,0,0,1,1.35-2.54,4.19,4.19,0,0,1,4.63-1.38,5.13,5.13,0,0,1,3.89,3.69A22.34,22.34,0,0,0,78.56,22c.88,1.51.72,3.23,1.12,4.83.17.64-.75,1.68-1.37,1.82a2.2,2.2,0,0,1-2.26-.93,4.83,4.83,0,0,1-.63-2.16,4.92,4.92,0,0,0-.52-1.85,46.14,46.14,0,0,1-2.21-4.86,2.22,2.22,0,0,0-.44-.67c-.65-.71-1.22-.58-1.51.35a19.75,19.75,0,0,0-.72,7,14,14,0,0,0,.21,1.94,3.87,3.87,0,0,1-.34,2.2,1.76,1.76,0,0,1-1.78,1.15,1.92,1.92,0,0,1-1.84-1.1,12.79,12.79,0,0,1-1-3.59A22.77,22.77,0,0,0,64.15,22a4.43,4.43,0,0,0-1.36-1.79,1.19,1.19,0,0,0-2,.55,22.37,22.37,0,0,0-1.6,9.8,5,5,0,0,1-.47,2.19,1.63,1.63,0,0,1-1.6.91,1.71,1.71,0,0,1-1.75-.94A16.14,16.14,0,0,1,54.09,29c-.29-1.76-.86-3.44-1.26-5.16a11.4,11.4,0,0,0-1.61-4.05,1.78,1.78,0,0,1,.22-2.11,1.58,1.58,0,0,1,1.9-.49,2.72,2.72,0,0,1,1.76,1.57c.35.71.7,1.42,1.16,2.37'
|
|
+'M49.32,31.51a6.82,6.82,0,0,1-1.06,3.69c-1.4,2.58-3.75,3.43-6.54,3.22a8.13,8.13,0,0,1-5.58-3,2.65,2.65,0,0,1-.34-2.76c.35-1,2-1.22,2.94-.43.36.32.63.74,1,1.09a4,4,0,0,0,3.7.87,2.86,2.86,0,0,0,1.17-4.55,7.24,7.24,0,0,0-2.39-1.9,15.71,15.71,0,0,0-1.92-.87c-1.78-.68-2.76-2.22-3.81-3.63A3.14,3.14,0,0,1,36,20.94c.46-3.05,2.34-6.28,6.42-6.27A5.17,5.17,0,0,1,46,15.92a1.92,1.92,0,0,1,.33,2.87,1.81,1.81,0,0,1-2.58.2,2.26,2.26,0,0,0-2.58,0,2.23,2.23,0,0,0-1,2.24,2.69,2.69,0,0,0,2,2.12,12.05,12.05,0,0,1,6.13,4.55,4.52,4.52,0,0,1,1.07,3.61'
|
|
+'M102.4,17.22a4.25,4.25,0,0,0,6.65,2.85c.77-.48,1.41-.84,2.35-.32,1.15.65,1.51,1.7.69,2.73a6.4,6.4,0,0,1-6.35,2.3,9.75,9.75,0,0,1-4.95-2.28,7,7,0,0,1-2.32-3.94,11.67,11.67,0,0,1,0-6A10.31,10.31,0,0,1,101,8.08c2.48-2.45,5.78-1.58,7.74.94a4.38,4.38,0,0,1-1.39,6.42A9.63,9.63,0,0,1,103,17a.72.72,0,0,0-.57.25m1.92-6.38a2.35,2.35,0,0,0-.6.24c-.51.35-1,.89-.73,1.47s.94.18,1.42,0a3.14,3.14,0,0,0,.58-.29c.28-.17.59-.35.47-.75s-.48-.7-1.14-.66'
|
|
+'M14.44,40.8a15.43,15.43,0,0,1-8.6-3.25,13.78,13.78,0,0,1-3.53-4.77,2.12,2.12,0,0,1-.19-1.72c.63-1.58,2.21-1.8,3.3-.41.59.77,1.14,1.58,1.66,2.4,2.14,3.37,8.53,5,12.11,2.07,1.72-1.4,3.48-2.67,4.32-4.86a2.33,2.33,0,0,1,1.76-1.52,1.69,1.69,0,0,1,2.21,1.45,2.63,2.63,0,0,1-.14,1.59c-1.13,2.3-2.38,4.48-4.78,5.73-.72.37-1.2,1.05-1.91,1.49a15.34,15.34,0,0,1-6.21,1.8'
|
|
+'M96.19,23.45a2.09,2.09,0,0,1-1.6,2.1,1.91,1.91,0,0,1-2.15-1.29,10.26,10.26,0,0,1-1-2.91,29,29,0,0,0-2-6.48,49.51,49.51,0,0,1-1.91-7.51c-.37-1.63-.65-3.29-.93-4.94A2.23,2.23,0,0,1,87.85.05a2.25,2.25,0,0,1,2.38,1.47,28.94,28.94,0,0,1,1.65,7.4,14.51,14.51,0,0,0,1,3.41c1.37,3.35,2.23,6.87,3.27,10.33a1.19,1.19,0,0,1,.07.79'
|
|
+'M86.9,25.84a1.94,1.94,0,0,1-1.22,2.05,1.92,1.92,0,0,1-2.31-1,4.43,4.43,0,0,1-.7-1.8,28.44,28.44,0,0,0-1.6-6.4c-.43-1.12-.89-2.36-.15-3.58.22-.38.25-1,1-.74s1.46-.63,2,.61,1.1,2.8,1.59,4.22a35.17,35.17,0,0,1,1.4,6.61'
|
|
+'M10.13,17a2.12,2.12,0,0,1,.36-1.68,1.74,1.74,0,0,1,3.1.37,15.37,15.37,0,0,1,1,5.53,1.77,1.77,0,0,1-1.35,1.73A1.76,1.76,0,0,1,11,21.74,16,16,0,0,1,10.13,17'
|
|
+'M5.71,17.75a3.12,3.12,0,0,1-2.83,3.33A2.35,2.35,0,0,1,.3,19.6a4.51,4.51,0,0,1,.09-3.46c.7-1.66,3.57-2,4.74-.36a2.94,2.94,0,0,1,.58,2'
|
|
+'M78.21,13.74c-.95.3-1.44-.54-2-1.15-.36-.39.23-2.09.85-2.35a11.35,11.35,0,0,1,4.62-1.3,1.87,1.87,0,0,1,1.91,1.41A1.6,1.6,0,0,1,83,12.22a22.38,22.38,0,0,1-4.83,1.52'
|
|
+'M21,15.25a2.21,2.21,0,0,1,2.35-2.47c1.79,0,3.07,1.07,3.06,2.47a3.34,3.34,0,0,1-2.9,3c-1.55,0-2.51-1.16-2.51-3',
|
|
etc13:'M30.69,4.1a22.06,22.06,0,0,1,2.47-1.72,1.65,1.65,0,0,1,.65-.32C37.09,1.57,40.26.15,43.68.88a11.43,11.43,0,0,1,6.68,4.43,9.42,9.42,0,0,1,1.69,3.54,1,1,0,0,0,1,.87,15.26,15.26,0,0,1,5.2,1.43,1.57,1.57,0,0,0,.69.2,8,8,0,0,1,4.86,2.15A14,14,0,0,1,67.48,18a11.67,11.67,0,0,1,1,6.82A5.35,5.35,0,0,1,67,27.45a27,27,0,0,1-5.72,4.66c-.54.36-.46.82-.36,1.28a10.53,10.53,0,0,1-3,10.28c-.65.66-1.15,1.44-1.83,2.09-1.8,1.72-4.07,2.12-6.38,2.34a15.41,15.41,0,0,1-5.48-.6,6.53,6.53,0,0,1-3-1.76c-.93-.93-.92-.84-1.87.12-2.8,2.84-6,4.63-10.23,4.38A12.37,12.37,0,0,1,22.83,48a7.14,7.14,0,0,1-2.25-2.6c-.34-.65-.7-.7-1.28-.39-3.23,1.74-6.56,1.31-9.91.42a7.43,7.43,0,0,1-3-1.52c-.57-.47-1.41-.54-1.89-1C2.31,40.9.31,38.72.07,35.42A24.29,24.29,0,0,1,.65,28a16.14,16.14,0,0,1,5.88-9.12,5.9,5.9,0,0,1,.58-.44,2.75,2.75,0,0,0,1.22-3.24,17.43,17.43,0,0,1-.1-5.81,9.38,9.38,0,0,1,2-4.3,12.77,12.77,0,0,1,2.38-2.89A10.2,10.2,0,0,1,15.7.47a10.15,10.15,0,0,1,6.85.27,8.18,8.18,0,0,0,3.14.62c1.33-.05,2.17.76,3.16,1.32A16.07,16.07,0,0,1,30.69,4.1'
|
|
+'M41.1,72.35a4.33,4.33,0,0,1-.42,1.83c-1.14,2.37-2.24,4.76-3.34,7.15a2.88,2.88,0,0,1-1.48,1.34,1.41,1.41,0,0,1-1.6-.37,2,2,0,0,1-.58-1.85c.45-1.82,1.52-3.36,2.23-5.06a33.12,33.12,0,0,0,1.49-3.33,2.19,2.19,0,0,1,1.21-1.4,1.66,1.66,0,0,1,2.49,1.69'
|
|
+'M25.87,68.73a1.66,1.66,0,0,1,.31-1.11c1.08-1.36,1.45-3.06,2.13-4.61a23.74,23.74,0,0,0,1.25-2.92A1.92,1.92,0,0,1,31.94,59a1.82,1.82,0,0,1,1.17,2.22,12.93,12.93,0,0,1-1.21,2.94,24.42,24.42,0,0,1-2.33,5.32,2.2,2.2,0,0,1-2.72.9,1.6,1.6,0,0,1-1-1.6'
|
|
+'M51.42,66.5a2.27,2.27,0,0,1,.22-1.35c.93-1.92,1.81-3.85,2.72-5.77a2.4,2.4,0,0,1,2.4-1.21,2,2,0,0,1,1,2.54c-.77,2.37-2.08,4.5-3,6.8a2.15,2.15,0,0,1-2.15.93,2,2,0,0,1-1.22-1.94'
|
|
+'M22.22,53.6a1.89,1.89,0,0,1-.33,1.65c-.9,1.5-1.17,3.29-2.15,4.76a2,2,0,0,1-2,1.07A1.78,1.78,0,0,1,16.3,59,7.8,7.8,0,0,1,17,56.65a22.85,22.85,0,0,0,1.41-3.2,2.75,2.75,0,0,1,.89-1.14,1.64,1.64,0,0,1,1.85-.47c.76.28,1,.8,1,1.76'
|
|
+'M8.19,58.1a19.55,19.55,0,0,1-1.51,4,14.66,14.66,0,0,0-.75,1.72,1.9,1.9,0,0,1-2.42,1.27,2,2,0,0,1-1.26-2.45,1.59,1.59,0,0,1,.16-.56c1-1.35,1.27-3,2.06-4.49.39-.71.79-1.44,1.84-1.43a1.72,1.72,0,0,1,1.88,2'
|
|
+'M48.67,54.91c0,.15-.07.34-.13.53A18.57,18.57,0,0,1,45.7,61a1.72,1.72,0,0,1-2,.78,1.81,1.81,0,0,1-1.17-2.55c.72-1.75,1.82-3.31,2.54-5.07.12-.29.45-.5.7-.73a1.8,1.8,0,0,1,2.07-.17c.59.25.77.95.85,1.64'
|
|
+'M15,70.27a2.75,2.75,0,0,1-.33,1.65c-.6,1.48-1.26,2.94-2,4.36a1.7,1.7,0,0,1-1.8.94,2.06,2.06,0,0,1-1.34-1.61,2.85,2.85,0,0,1,.13-1.56,32.51,32.51,0,0,1,1.83-4.45c.7-1.43,1.67-1.75,2.79-1,.62.41.68.56.69,1.68',
|
|
etc14:'M37.16,58.28c-4.17.43-8-2.14-11.67-5.11-.42-.33-.79-.72-1.2-1.06-2.69-2.27-3.55-5.39-3.88-8.68a28.17,28.17,0,0,1,.32-9.69,21.23,21.23,0,0,1,6-10.89c.59-.55,1.09-1.16,1.67-1.71a9.5,9.5,0,0,1,7.37-2.5,39,39,0,0,1,7.73,1.18A17.68,17.68,0,0,1,55.43,29.2a.64.64,0,0,0,.08.14c2.84,3.7,2.74,7.88,2.12,12.21a21.66,21.66,0,0,1-2.12,7,17.87,17.87,0,0,1-7.86,7.88c-3.06,1.6-6.29,1.86-10.49,1.87'
|
|
+'M66.4,63.68a5.18,5.18,0,0,1-2.3-1,34.45,34.45,0,0,1-2.92-2.48,14.74,14.74,0,0,0-2.87-2.29,1.92,1.92,0,0,1-1.05-1.15c-.14-.52-.61-1.06.1-1.57s.93-1.24,2-.77A8.78,8.78,0,0,1,62.25,56c1.21,1.22,2.66,2.13,3.9,3.3a9.25,9.25,0,0,0,1.47,1,1.89,1.89,0,0,1,.93,2,2.38,2.38,0,0,1-2.15,1.39'
|
|
+'M17.37,71a6.05,6.05,0,0,1,.49-2c1-2.12,1.75-4.3,2.59-6.47a5.34,5.34,0,0,1,.79-1.56,2.1,2.1,0,0,1,2.42-.73,2.29,2.29,0,0,1,.91,2.38A5.62,5.62,0,0,1,24,64.05a28.63,28.63,0,0,0-1.92,5.06,9.89,9.89,0,0,1-1.52,3c-.45.58-1.63,1-2.12.54S17,71.91,17.37,71'
|
|
+'M61.48,6.81a4.65,4.65,0,0,1-.2.93c-1.06,2.25-2.12,4.51-3.22,6.74a5.59,5.59,0,0,1-1.7,1.89,2,2,0,0,1-2.45.16,2,2,0,0,1-.21-2.59A26.69,26.69,0,0,0,56,9.74c.55-1,1-2.12,1.55-3.14C58.33,5.16,59,5,60.37,5.31a1.33,1.33,0,0,1,1.11,1.5'
|
|
+'M68.06,35c-.73,0-1.48-.12-1.85-.93-.54-1.18-.46-2,1-2.64a18.9,18.9,0,0,1,3-1,36.65,36.65,0,0,0,4.54-1.52,2.71,2.71,0,0,1,2-.27A1.91,1.91,0,0,1,77.3,32a6.65,6.65,0,0,1-2.15,1c-1.91.65-3.9,1-5.79,1.78a5.22,5.22,0,0,1-1.3.19'
|
|
+'M30.62,3.51a5.47,5.47,0,0,1,.27-2A1.76,1.76,0,0,1,32.71,0a2.31,2.31,0,0,1,1.64,1.53,11.9,11.9,0,0,1,.29,2.53,26.84,26.84,0,0,0,.57,4.09,5.38,5.38,0,0,1,.06,2.36,2.32,2.32,0,0,1-1.82,1.74,2.46,2.46,0,0,1-2-1.65,1.66,1.66,0,0,1,0-.32c-.28-2.26-.56-4.51-.85-6.77'
|
|
+'M9.74,43.16a1.82,1.82,0,0,1,2.08,1.33,2.18,2.18,0,0,1-1,2.15A4.3,4.3,0,0,1,9,47.45c-1.81.42-3.63.81-5.44,1.25a4.67,4.67,0,0,1-2.2-.15C.4,48.36.19,47.64,0,46.82s.44-1.13.94-1.49a6.14,6.14,0,0,1,2.91-.71,28.91,28.91,0,0,0,4.77-1.27,3.13,3.13,0,0,1,1.09-.19'
|
|
+'M11.09,20.81a2.06,2.06,0,0,1-.64-.13,21.4,21.4,0,0,1-6.15-3.9A2.08,2.08,0,0,1,4,13.92c.89-1,1.67-1.06,2.73-.07a14.69,14.69,0,0,0,3.7,2.45c.57.27,1.17.49,1.77.71,1.23.45,1.72,1.06,1.62,2S13,20.61,11.7,20.74l-.61.07'
|
|
+'M41.29,67c0-1.69.57-2.4,1.69-2.46a2.51,2.51,0,0,1,2.23,2.16c.17,1.37.3,2.75.48,4.12.12.9.33,1.78.43,2.68.14,1.3-.27,2-1.27,2.25s-1.92-.24-2.47-1.42a10.39,10.39,0,0,1-.65-3.27c-.2-1.47-.18-3-.44-4.06',
|
|
etc15:'M56.74,18.07c.32,1.36.25,2.73.68,4a7,7,0,0,1,.33,1.42,1.79,1.79,0,0,1-1.14,2.11,2,2,0,0,1-2.33-1.5c-.36-1.47-.7-2.94-.94-4.42-.43-2.6-.77-5.2-1.17-7.8a6.27,6.27,0,0,0-.37-1.26,3.65,3.65,0,0,1-.14-1.88,1.62,1.62,0,0,1,1.08-1.27,2,2,0,0,1,1.94.63c2.59,2.75,4.23,6.15,6.38,9.2.1.15.16.36.52.42a6.32,6.32,0,0,0,.2-1.6A51.7,51.7,0,0,0,61,9.49a6.19,6.19,0,0,1-.15-.86c-.15-1.22.35-2.15,1.24-2.34A2,2,0,0,1,64.37,8c.12,1.17.54,2.27.6,3.44.14,3,.62,5.92.25,8.91a21.56,21.56,0,0,0,0,2.78,1.86,1.86,0,0,1-1,1.95,2.16,2.16,0,0,1-2.3-.56,16.12,16.12,0,0,1-2.57-3c-.65-1-1.26-2.09-1.88-3.13a.64.64,0,0,0-.76-.39'
|
|
+'M77.22,15.73c1.68,1.12,3.34,1.74,4.86,2.6.85.48,1.73.91,2.55,1.42a4.54,4.54,0,0,1,1.53,1.55,1.87,1.87,0,0,1-.23,2.52,1.57,1.57,0,0,1-2.35-.17c-1.49-1.71-3.58-2.29-5.47-3.26a36.69,36.69,0,0,0-4-2.09c-.4.29-.26.63-.23,1,.11,1.36.24,2.72.34,4.08a2.82,2.82,0,0,1,0,.87,1.93,1.93,0,0,1-1.58,1.52,2,2,0,0,1-1.72-1.32,7.58,7.58,0,0,1-.3-1.27c-.19-1.3-.15-2.62-.3-3.93-.42-3.68-1-7.35-1-11.06a3.77,3.77,0,0,1,.15-1.3A1.64,1.64,0,0,1,71,5.55,1.75,1.75,0,0,1,72.65,7c.16,1,.21,1.94.29,2.91s.17,2.14.25,3.2c0,.52.27.78.73.43,1.89-1.44,4.18-2.35,5.71-4.25a10.1,10.1,0,0,1,2.18-2.15,2,2,0,0,1,2.55.11.81.81,0,0,1,.27.79,3.51,3.51,0,0,1-1,2.18,51,51,0,0,1-6.4,5.54'
|
|
+'M32.11,13c.07,3.33.41,6.62.77,9.92a6.81,6.81,0,0,1,.25,2.16,1.81,1.81,0,0,1-1.75,1.61,1.78,1.78,0,0,1-1.62-1.45A28.61,28.61,0,0,1,29,20.38C28.94,19,28.89,19,27.53,19.2c-1.06.13-2.12.37-3.18.45-.85.06-1,.52-.85,1.18a8,8,0,0,0,.73,2.37c.51,1-.11,1.8-.62,2.56a1.56,1.56,0,0,1-1.82.58,1.51,1.51,0,0,1-1.38-1.63,32.24,32.24,0,0,0-.66-4.9,39.11,39.11,0,0,1-.54-8.3,6.9,6.9,0,0,1,.18-2.6c.27-.56.47-1.08,1.36-1a1.51,1.51,0,0,1,1.56.92c.55,1,.32,2.09.39,3.14s0,2.34,0,3.51c0,.61.36.69.85.72a22.28,22.28,0,0,0,3.62-.54c1.47-.16,1.47-.23,1.49-1.78s0-2.93,0-4.39a2,2,0,0,1,1.7-2A2,2,0,0,1,32.1,9.38c0,1.22,0,2.44,0,3.65'
|
|
+'M138.25,10.5a10,10,0,0,1-1.59,6A9.16,9.16,0,0,1,131,20.18c-1.82.41-3.13-.56-4.22-1.8a6.28,6.28,0,0,1-1.56-3.09c-.36-2-1.26-3.89-1.79-5.86a26.57,26.57,0,0,1-.65-4.77,1.61,1.61,0,0,1,1.12-1.81,1.58,1.58,0,0,1,1.94.55,1.84,1.84,0,0,1,.34,1.1,51.51,51.51,0,0,0,2.46,9.78c.79,2.61,1.86,2.9,4,1.27a4.51,4.51,0,0,0,1.77-3.08,13.38,13.38,0,0,0-.37-6.22,29.65,29.65,0,0,1-.67-3,2,2,0,0,1,.34-1.53,1.64,1.64,0,0,1,2.61-.18,2,2,0,0,1,.51.88c.51,2.75,1.72,5.39,1.36,8.08'
|
|
+'M48.77,22.63a2.18,2.18,0,0,1-1.46,2.07,1.77,1.77,0,0,1-1.84-1.17A4.37,4.37,0,0,1,45,21.7c0-.63-.36-.78-1-.78a19.46,19.46,0,0,1-3.5.17c-.45-.08-.7.28-.8.7s-.09.67-.16,1a6.26,6.26,0,0,1-.25,1.14,2.09,2.09,0,0,1-1.93,1.32,2,2,0,0,1-1.58-1.7,3.41,3.41,0,0,1,.2-1.87,29.78,29.78,0,0,0,1.5-7.25c.21-1.93.55-3.86.91-5.77s1.72-2.29,3.24-1.14a22,22,0,0,1,2.88,3.29A17.28,17.28,0,0,1,48.34,20a16.47,16.47,0,0,0,.43,2.62m-7.25-9.9A5,5,0,0,0,41,15.36c0,.71-.74,1.66.06,2.1.58.32,1.5,0,2.28,0l.14,0c.43-.1.53-.38.4-.76a13.45,13.45,0,0,0-2.34-3.93'
|
|
+'M109.33,11.34c-.21-1.84.75-3.95,2-6,.35-.58.73-1.15,1.09-1.74A2.7,2.7,0,0,1,116,2.35c2.59.95,4.61,2.48,5.22,5.37a2.44,2.44,0,0,0,.28.67c1.39,2.58.63,4.89-.86,7.11a18.13,18.13,0,0,1-1.32,1.92,5.17,5.17,0,0,1-7.76.35c-1.74-1.56-2.18-3.59-2.23-6.43m3.56.23a5,5,0,0,0,.65,3.09c1,1.36,2.35,1.39,3.32.28a18.69,18.69,0,0,0,1.44-2.53,2.08,2.08,0,0,0,.24-1.69A11,11,0,0,0,116.9,7c-.79-1.1-1.62-1-2.46.1a6.83,6.83,0,0,0-1.55,4.48'
|
|
+'M8.3,24.75A70.15,70.15,0,0,0,7.2,12.22c-.09-.58-.3-.69-.84-.71A14.23,14.23,0,0,0,2.75,12,2.08,2.08,0,0,1,.6,11.58,1.5,1.5,0,0,1,.69,9.12a3.76,3.76,0,0,1,1.77-.66c3-.38,5.88-1.11,8.88-.55a2.42,2.42,0,0,0,1.14-.17,10.08,10.08,0,0,1,3-.46,2,2,0,0,1,2,1.35,1.61,1.61,0,0,1-1.37,1.94c-1.53.28-3,.95-4.58.88-.68,0-.85.22-.72.87.95,4.91.93,9.91,1.14,14.88,0,.39-.07.78-.08,1.17,0,.83-.59,1.2-1.24,1.46A1.48,1.48,0,0,1,9,29.25a2.26,2.26,0,0,1-.67-1.73c0-.92,0-1.85,0-2.77'
|
|
+'M108.65,1.49a6.53,6.53,0,0,1-.71,2.44c-1,1.74-2,3.46-2.86,5.27a4.46,4.46,0,0,0-.42,3.23c.63,2.25.68,4.62,1.21,6.9a2.21,2.21,0,0,1-.19,1.83c-.34.52-.59,1-1.31.93a1.85,1.85,0,0,1-1.71-.92,5.91,5.91,0,0,1-.5-1.68c-.23-1.44-.47-2.89-.62-4.34a44,44,0,0,0-1-4.42,4.71,4.71,0,0,0-1.39-2C98,7.3,96.68,5.9,95.38,4.53a2.27,2.27,0,0,1-.58-1.89,1.51,1.51,0,0,1,2.28-1.1,16.84,16.84,0,0,1,3.64,3.56c1.41,1.76,1.4,1.8,2.52-.06.68-1.12,1.25-2.31,1.88-3.46A2.76,2.76,0,0,1,106.47.1a1.63,1.63,0,0,1,2.18,1.39',
|
|
etc16:'M0,35.88c.1-1.23.41-3.39.76-5.56a45.93,45.93,0,0,1,2.67-8.93,27.23,27.23,0,0,1,5.74-8.93c.9-1,1.78-1.94,2.59-3a18.33,18.33,0,0,1,5.28-4.34A29.44,29.44,0,0,1,28.1,1.06c1.68-.21,3.3-.82,5-1a11.18,11.18,0,0,1,6.54,1A2.21,2.21,0,0,0,41,1.47a5.53,5.53,0,0,1,2,.24c2.61.57,5.11,1.48,7.69,2.17l.41.14a2.32,2.32,0,0,1,1.61,1.74,2.53,2.53,0,0,1-1.66,2.38,11,11,0,0,1-1.73.31c-2.47.36-4.94.7-7,2.26a5.31,5.31,0,0,1-1.18.56,11.42,11.42,0,0,0-3.89,2.55c-1.47,1.56-3,3-4.52,4.56a19.61,19.61,0,0,0-4.4,7.53,25.77,25.77,0,0,0-1.55,10.66,40.43,40.43,0,0,0,2.7,11.35,29.48,29.48,0,0,0,3,6.34A31,31,0,0,0,45.27,64.93a32.42,32.42,0,0,0,7,2.13A5,5,0,0,0,55,67a3.76,3.76,0,0,1,1.6-.1,5.45,5.45,0,0,0,2.88-.31,1.48,1.48,0,0,1,1.84.49,1.6,1.6,0,0,1,0,2c-1.25,1.54-2.28,3.29-4.32,4a18.41,18.41,0,0,0-2.37,1.4,24.45,24.45,0,0,1-6.13,2.27c-1.27.34-2.51.74-3.81,1a28.2,28.2,0,0,1-10.32-.3c-2.84-.48-5.69-.86-8.51-1.5a20,20,0,0,1-5.95-2.4c-.58-.36-1.19-.68-1.79-1a24.42,24.42,0,0,1-9.46-8.72,46.77,46.77,0,0,1-3.85-6.73,36.12,36.12,0,0,1-2.17-5.57A50,50,0,0,1,1.11,46c-.42-3-1.22-6-1.1-10.1'
|
|
+'M90.84,51.62c-.81.11-1.7-.25-2.33.18s-.5,1.33-.78,2a27.68,27.68,0,0,1-1.47,3.66c-1.06,1.76-2.56,2-4.13.72a10.86,10.86,0,0,1-3.65-5c-.38-1.24-.8-1-1.64-.85a11.9,11.9,0,0,1-6.48-.55C68.09,51,67.51,49.42,69,47.48a14.07,14.07,0,0,1,3.19-2.77,5.14,5.14,0,0,1,.85-.55,1,1,0,0,0,.47-1.54,9.21,9.21,0,0,1-1-3.34c-.16-1.6.63-2.6,2.24-2.47A26.38,26.38,0,0,1,81.25,38a2,2,0,0,0,2-.31c1.28-.89,2.58-1.76,3.85-2.66a8,8,0,0,1,1.83-.9,2,2,0,0,1,2.67,2.2c-.37,2-.43,4.09-1,6.07a1.76,1.76,0,0,0,.67,2.16c1.16.87,2,2.07,3.43,2.7A2,2,0,0,1,96,49.46a2.54,2.54,0,0,1-1.89,1.85,7.4,7.4,0,0,1-3.3.31'
|
|
+'M57.12,17.07c.75-.19,1.43.37,2.09.84a1,1,0,0,0,1.6-.2,5.47,5.47,0,0,1,.86-.8,2.44,2.44,0,0,1,4,1.55,6.84,6.84,0,0,1-.09,1.75c-.07.72,0,1.36.85,1.62a2.36,2.36,0,0,1,.59.42,2.2,2.2,0,0,1,1.14,2.21,2.1,2.1,0,0,1-1.81,1.69,1.81,1.81,0,0,0-1.61,1.77,8.37,8.37,0,0,1-.39,1.7c-.26.86-.55,1.71-1.54,2a2.54,2.54,0,0,1-2.63-.9,7.67,7.67,0,0,1-1.55-2.11,1.07,1.07,0,0,0-1.42-.66,5.56,5.56,0,0,1-2.33.13,1.83,1.83,0,0,1-1.44-2.72,4.37,4.37,0,0,1,1.42-1.63,1.38,1.38,0,0,0,.56-1.87A5.22,5.22,0,0,1,55,19.12a2.08,2.08,0,0,1,2.17-2.05',
|
|
etc17:'M0,24.8a2.54,2.54,0,0,1,1.47-2.57,20.64,20.64,0,0,1,3.92-1.86c4-1.4,5.45-4.52,5.94-8.35a19.93,19.93,0,0,0-.08-5.72,10.33,10.33,0,0,1,0-2.72A3.93,3.93,0,0,1,14.44,0c2-.16,3.29.76,3.63,3.18a22,22,0,0,0,2,6.73c2.47,5,6.17,8.28,12,8.5a5.44,5.44,0,0,1,3.26,1.15,3.16,3.16,0,0,1-.18,5.12c-1.29.85-2.66,1.57-3.88,2.54a17.75,17.75,0,0,0-6.3,10.51,50.64,50.64,0,0,0-1,5.08c-.3,2.58-1.71,4-3.69,4.06-1.78.1-3.38-1.44-3.94-3.83-.38-1.6-.74-3.2-1.06-4.8a27.9,27.9,0,0,0-.95-3.11c-1.29-3.91-4.41-5.3-8-6C5.19,29,4.07,29,3,28.76a3.75,3.75,0,0,1-3-4m19.84,6.43A37.94,37.94,0,0,1,23.79,25c.69-.89.57-1.39-.32-1.94a24.84,24.84,0,0,1-5.4-4.12c-.6-.66-1.26-.78-1.71.18a34.83,34.83,0,0,1-3.3,5.07c2.79,1.82,5.37,3.65,6.8,7.09',
|
|
etc18:'M15.7,7.09c0-.91-.07-1.83,0-2.73a4.47,4.47,0,0,1,2.76-4,3.08,3.08,0,0,1,4.18,1.35,7.55,7.55,0,0,1,.85,2c1.18,5.07,4.53,8.79,7.81,12.55a6.46,6.46,0,0,0,4.56,2.18c.36,0,.72.1,1.08.16a3.69,3.69,0,0,1,3,2.77A3.27,3.27,0,0,1,38.13,25a24.35,24.35,0,0,0-4.92,3.77A19.93,19.93,0,0,0,26.93,39.3c-.49,1.93-1.19,3.81-1.84,5.7a4.76,4.76,0,0,1-.83,1.4A3.12,3.12,0,0,1,19,46.32a7,7,0,0,1-1.32-3.8A18.49,18.49,0,0,0,12.86,32c-2.08-2.45-5.19-3.24-8.29-3.68a17.3,17.3,0,0,1-1.85-.29A3.77,3.77,0,0,1,0,24.92c-.26-1.08,1.29-3.15,2.56-3.54a31.85,31.85,0,0,1,4.18-1.24c3.26-.55,5.59-2.65,7.49-5.11,1.18-1.52,1.17-3.59,1.37-5.49.08-.81,0-1.63,0-2.45h.06M14.17,24.4a22.71,22.71,0,0,1,7.49,8.88,29.66,29.66,0,0,1,7.59-10.12c-3.43-2-5.13-5.3-7.93-8-.91,4.49-4.19,6.59-7.15,9.28',
|
|
etc19:'M21.76,47.64c-2.31.13-2.87-1.51-3.55-2.82-.54-1-.46-2.31-.73-3.45-1.22-5.09-3.3-9.61-8.46-11.93a22,22,0,0,0-4.21-1.07c-.52-.13-1.09-.09-1.6-.24C1.46,27.64,0,26.12,0,24.82S1.24,22,2.93,21.26A26.11,26.11,0,0,1,7.1,20a10.73,10.73,0,0,0,8.38-9.49,28.72,28.72,0,0,0,.22-5.17c-.16-2.64.78-4.09,2.89-5a3.14,3.14,0,0,1,4.33,1.6,6.59,6.59,0,0,1,.48,1.28c1.22,5.15,4.5,9,7.88,12.87a6.81,6.81,0,0,0,4.28,2.18c.53.09,1.06.24,1.6.31a3.56,3.56,0,0,1,3,2.86,3.41,3.41,0,0,1-2,3.55c-2.84,1.12-4.52,3.56-6.64,5.49s-3.3,4.71-4.16,7.5c-.69,2.26-1.35,4.53-2.11,6.76s-1.85,3-3.45,2.91m-7.68-23.3a22.63,22.63,0,0,1,4.58,3.95,18.57,18.57,0,0,1,2.15,3.47c.43.7,1.06,1.18,1.58.09A26.16,26.16,0,0,1,29,23.3a37.73,37.73,0,0,1-4.86-4.95c-.47-.66-.93-1.34-1.46-2-.88-1-1.51-1-1.86.31a9,9,0,0,1-2.09,3.41,31.6,31.6,0,0,1-4.69,4.23',
|
|
etc20:'M26.51,17.35c1-1.83,1.1-3.8,1.76-5.6,1.31-3.57,3.1-6.76,6.23-9,7-5.11,13.36-2.63,16.73,4.55,2.5,5.34,2.33,11.06,1.14,16.71C50.5,32.82,46.81,41,42.75,49a25.63,25.63,0,0,1-3.2,4.58c-1.43,1.75-3.14,2-5.23,1.3A60.19,60.19,0,0,1,25,50.23a46.37,46.37,0,0,0-6.52-3.4c-3.39-1.23-5.88-3.72-8.07-6.41a94.19,94.19,0,0,1-9-13.52C-1.8,21.08.59,12.76,6.78,9.3,8.93,8.1,11,8.42,13.18,9a24.67,24.67,0,0,1,9.44,5.33,22.59,22.59,0,0,0,3.89,3',
|
|
etc21:'M33.23,4.32C35.18,3,37,1.47,39.49,1.78a2.41,2.41,0,0,0,1-.25,11.9,11.9,0,0,1,12.08,2,11,11,0,0,1,3.9,5.69,1.14,1.14,0,0,0,1.23,1,13.43,13.43,0,0,1,3.81,1,26.74,26.74,0,0,0,3.19,1,10.77,10.77,0,0,1,6.17,3.91,15.37,15.37,0,0,1,2,2.37,12.45,12.45,0,0,1,1.33,6.49,6.45,6.45,0,0,1-2,4.17,27.43,27.43,0,0,1-5.93,4.6c-.54.34-.36.89-.19,1.31a9.51,9.51,0,0,1,.32,3.27A8.61,8.61,0,0,1,64.76,43a16.55,16.55,0,0,1-5.51,5.68,10.65,10.65,0,0,1-5.65,1.43,20.55,20.55,0,0,1-5.17-.52,8.24,8.24,0,0,1-3.81-2c-.8-.78-1.08-.79-1.79,0a14.62,14.62,0,0,1-9.12,4.75A12.49,12.49,0,0,1,26.48,51a10.17,10.17,0,0,1-4.17-3.84c-.38-.59-.77-.7-1.32-.34-2.78,1.84-5.81,1.45-8.84,1a10.82,10.82,0,0,1-5.57-2.37c-.52-.44-1.22-.3-1.7-.75C3,42.92,1,41.14.43,38.42a13.63,13.63,0,0,1-.1-6.32,3.86,3.86,0,0,0,.12-.57,27.52,27.52,0,0,1,1.09-4.29,13,13,0,0,1,2.3-4.16,15.26,15.26,0,0,1,3.53-3.46c.16-.1.3-.25.46-.36a2.78,2.78,0,0,0,1.34-3.05,17.83,17.83,0,0,1-.16-6,8.11,8.11,0,0,1,.92-2.88A18,18,0,0,1,14.21,2,9.07,9.07,0,0,1,16.75.6,11.12,11.12,0,0,1,23.5.45,42.14,42.14,0,0,0,29,1.57a5.68,5.68,0,0,1,2.29,1.26,9,9,0,0,1,1.9,1.49',
|
|
etc22:'M31.62,43.79A63.61,63.61,0,0,1,19.5,41.92c-3.27-.75-6-2.53-8.84-4.06A23.62,23.62,0,0,1,4.2,32.6a16.44,16.44,0,0,1-4-8.37,15.82,15.82,0,0,1,1.27-8.64,35.33,35.33,0,0,1,2.64-5.07,14.12,14.12,0,0,1,3.43-3.8c1-.77,2-1.49,3-2.22a11.44,11.44,0,0,1,2.71-1.24c.63-.26,1.27-.48,1.89-.73A28.36,28.36,0,0,1,22.72.62,74.52,74.52,0,0,1,31.42,0,38.37,38.37,0,0,1,43.55,1.81a38.74,38.74,0,0,1,7,3.32C51.7,5.77,52.92,6.31,54,7a26.11,26.11,0,0,1,4.59,3.81,19.73,19.73,0,0,1,4.59,7,15.38,15.38,0,0,1,.5,7.79A6.12,6.12,0,0,1,63,27.23a25.11,25.11,0,0,1-5.59,7.82,28.54,28.54,0,0,1-7.91,5.29,52.36,52.36,0,0,1-5,2,23.92,23.92,0,0,1-6.22,1.12c-2.26.1-4.53.23-6.71.34M48.81,24.63a6.47,6.47,0,0,1-1-1.15,18.76,18.76,0,0,0-2-2.55,14.07,14.07,0,0,1-2.32-3.29c-.31-.72-2.06-.65-2.46.06-.14.23-.28.56-.11.79a3.82,3.82,0,0,1,.43,2.08c.24,2.25.85,4.45,1,6.73a14,14,0,0,0,.37,2.23c.21.95.85,1.41,1.59,1.21s1.16-.92.81-1.92a8.8,8.8,0,0,1-.37-1.75,17.46,17.46,0,0,0-.58-3.65,1.17,1.17,0,0,1,0-.88c.14.06.23.07.27.12a10.77,10.77,0,0,1,.65.86,27.2,27.2,0,0,0,4.47,4.63,1.38,1.38,0,0,0,1.57.19A1.16,1.16,0,0,0,51.75,27c-.12-1.38-.17-2.78-.32-4.16-.18-1.74-.55-3.46-.87-5.18a6,6,0,0,0-.44-1.36,1.16,1.16,0,0,0-1.53-.57c-.52.16-.73.52-.64,1.24a13.33,13.33,0,0,0,.28,1.4,18.52,18.52,0,0,1,.58,6.24M20.51,16h-.84a9.48,9.48,0,0,0-3.47.82c-2,.86-2.77,4.07-.46,5.4a18.41,18.41,0,0,0,5,2.11,5.64,5.64,0,0,1,2.81,1.53,2.59,2.59,0,0,1,.73,2.52c-.24.87-1.14,1-1.94,1.15a15.25,15.25,0,0,1-2,.07,2.4,2.4,0,0,1-2.5-1.46,1.34,1.34,0,0,0-1.8-.66.9.9,0,0,0-.51,1.35,4.88,4.88,0,0,0,3.23,2.46,9.9,9.9,0,0,0,3,.19A9.08,9.08,0,0,0,25,30.72a2.78,2.78,0,0,0,1.82-2.07,4.69,4.69,0,0,0-1.73-4.36,8.81,8.81,0,0,0-4-1.83,9.14,9.14,0,0,1-3.77-1.72,1.09,1.09,0,0,1-.46-1.52,1.6,1.6,0,0,1,1-1,8,8,0,0,1,5.05-.1,1.65,1.65,0,0,1,1,.78,1.59,1.59,0,0,0,.57.61A1.28,1.28,0,0,0,26,19.46a1.16,1.16,0,0,0,.11-1.35,2.33,2.33,0,0,0-.86-1A8.25,8.25,0,0,0,20.51,16m18.71,6.33c.18-1.23-.16-2.45,0-3.69a1,1,0,0,0-.67-1c-1-.43-1.72.11-1.73,1.35,0,2.22,0,4.45-.11,6.67a6.82,6.82,0,0,1-1,3,1.53,1.53,0,0,1-2.37.31,3.15,3.15,0,0,1-.59-.74,13.82,13.82,0,0,1-1.37-3.8A37.43,37.43,0,0,1,31,18.85a1,1,0,0,0-.68-1.14,1.18,1.18,0,0,0-1.24.19,1.67,1.67,0,0,0-.42,1.33c0,1.11,0,2.22.09,3.33a14,14,0,0,0,2.22,7,4.24,4.24,0,0,0,5.72,1.14,5.88,5.88,0,0,0,2.17-3.6c.45-1.56.16-3.17.38-4.75',
|
|
etc23:'M31.38,0A38,38,0,0,1,44.54,2.1a27,27,0,0,1,4.33,2A57.14,57.14,0,0,1,56.05,8.4a32.36,32.36,0,0,1,4.22,4.22,15.3,15.3,0,0,1,2.89,5.06,14.53,14.53,0,0,1,.51,7.79,6.35,6.35,0,0,1-.49,1.22,25.41,25.41,0,0,1-5.62,8.1,29,29,0,0,1-7.86,5.37,47.31,47.31,0,0,1-5.32,2.15,23.47,23.47,0,0,1-6.21,1.09c-1.36,0-2.71.14-4.05.27a37.65,37.65,0,0,1-7-.21c-2.92-.25-5.71-1.12-8.57-1.64a11.2,11.2,0,0,1-3.2-1.29,66.15,66.15,0,0,1-6.17-3.41,21.77,21.77,0,0,1-7.21-7.51A14.7,14.7,0,0,1,.76,17.69a34.68,34.68,0,0,1,3.55-7.42A11.71,11.71,0,0,1,7.12,7.2c1.07-.84,2.14-1.67,3.22-2.49a10.06,10.06,0,0,1,2.26-1.1c1-.43,2-.76,3-1.16a32.55,32.55,0,0,1,9.2-2C27,.25,29.18,0,31.38,0M26.77,16.72c.22,1.47.43,3,.69,4.45.35,2.08.79,4.14,1,6.24a5.75,5.75,0,0,0,.27,1.16,1.19,1.19,0,0,0,1.31.8,1.06,1.06,0,0,0,1-1.05,4.27,4.27,0,0,0-.08-.94c-.16-.95-.34-1.89-.52-2.82-.1-.48.06-.66.55-.64a19.86,19.86,0,0,0,3.68-.42c.63-.1.86.1,1,.68a15.88,15.88,0,0,0,1.18,3.75,1.24,1.24,0,0,0,1.63.76c.54-.2.76-.73.58-1.52-.13-.54-.36-1.05-.53-1.58-.91-2.9-1.13-5.93-1.7-8.89-.16-.86-.21-1.74-.4-2.6a1.13,1.13,0,0,0-2.22.38c0,.71.11,1.43.22,2.13.17,1.15.38,2.28.56,3.42.13.83,0,.95-.8,1.12a16.35,16.35,0,0,1-3.2.37c-1,0-1.07-.09-1.23-1.07q-.3-1.89-.57-3.78a2,2,0,0,0-.46-1.2,1.13,1.13,0,0,0-1.81.28,4.08,4.08,0,0,0-.12,1m24.07,5a27.12,27.12,0,0,0-.89-6,2.05,2.05,0,0,0-.49-.81A1.34,1.34,0,0,0,48,14.42c-.51.21-.73.69-.54,1.42.3,1.15.55,2.32.79,3.49a11.44,11.44,0,0,1-1.11,7.09c-.43.94-1.14,1-1.82.15A6.83,6.83,0,0,1,44,24.21c-.46-1.57-.91-3.13-1.36-4.71a9.56,9.56,0,0,1-.53-3.28A1.14,1.14,0,0,0,41,14.9a1.25,1.25,0,0,0-1.23,1.21,5.38,5.38,0,0,0,0,1.79A48.85,48.85,0,0,0,42.14,26,7,7,0,0,0,44,28.68c1.24,1.09,3.81,1.61,5-.59a15.38,15.38,0,0,0,1.85-6.38m-31.1-6a.76.76,0,0,0-.77.17c-.65.77-1.58.66-2.4.8-1.3.23-2.58.55-3.85.87a1.12,1.12,0,0,0-.86,1.62,1.23,1.23,0,0,0,1.43.6c1.33-.26,2.66-.5,4-.74,1-.17,1-.12,1.14.82.21,1.62.41,3.24.65,4.85.35,2.32,1,4.59,1.18,6.94a2,2,0,0,0,.55,1.29,1.09,1.09,0,0,0,1.74-.08,1.44,1.44,0,0,0,.25-1.22c-.67-3.76-1.35-7.52-1.9-11.3-.32-2.24-.49-2,1.71-2.47.39-.07.79-.1,1.18-.18a8.22,8.22,0,0,0,1.5-.37A1.18,1.18,0,0,0,26,15.72,1.27,1.27,0,0,0,24.54,15c-1.06.2-2.11.44-3.17.64-.53.1-1.07.36-1.63,0',
|
|
etc24:'M31.73,0A37.62,37.62,0,0,1,44.55,2.11a28.48,28.48,0,0,1,4.54,2.14c2.34,1.36,4.87,2.42,7,4.17,3,2.52,5.72,5.34,7.06,9.17a14.55,14.55,0,0,1,.54,7.9,6.75,6.75,0,0,1-.59,1.43,25.06,25.06,0,0,1-5.6,8,29.17,29.17,0,0,1-7.89,5.33,53.73,53.73,0,0,1-5.1,2.05,21.47,21.47,0,0,1-6.09,1.12c-2,0-4,.32-6,.41a30.51,30.51,0,0,1-4.77-.25c-2.74-.3-5.41-.95-8.1-1.52a22,22,0,0,1-5.64-2.23A43.42,43.42,0,0,1,9,37.05,21.66,21.66,0,0,1,1.92,29.6,14.73,14.73,0,0,1,.76,17.68a35.08,35.08,0,0,1,3.55-7.41A11.58,11.58,0,0,1,7.12,7.19c1.06-.84,2.14-1.66,3.22-2.48A9.61,9.61,0,0,1,12.6,3.62c1.13-.49,2.31-.88,3.45-1.35A23.4,23.4,0,0,1,21.85.81,72.89,72.89,0,0,1,31.73,0M41.86,19.86c-.49.06-.92.1-1.35.18s-.71,0-.8-.46c-.05-.27-.18-.53-.23-.8-.27-1.52-.27-1.56,1.26-1.49a14.13,14.13,0,0,0,3.31-.38c1.07-.21,1.43-1,.93-1.85s-1-.52-1.6-.42a32.17,32.17,0,0,1-4.16.39,4.11,4.11,0,0,0-1.39.29c-.43.18-1,.46-.89,1a14.29,14.29,0,0,0,.28,3.06,10.33,10.33,0,0,1,.46,2.82,12.59,12.59,0,0,0,.77,4.33,2.12,2.12,0,0,0,2.28,1.54A7.17,7.17,0,0,0,42,28c1.37-.22,2.74-.47,4.11-.7a2.41,2.41,0,0,0,1-.4,1,1,0,0,0,.41-1.26A1.38,1.38,0,0,0,46,24.8c-1.21.25-2.41.54-3.64.69-1.85.24-1.93.2-2.18-1.63,0-.16,0-.32,0-.47-.07-.89.06-1,1-1.1.48,0,1,0,1.44,0,1.07-.1,2.14-.18,3.2-.34A1.33,1.33,0,0,0,47,20.33c-.12-.64-.68-.91-1.6-.8a12.74,12.74,0,0,1-3.51.33m-8.71-1.61A18.09,18.09,0,0,1,32,24.68a4.84,4.84,0,0,1-.28.66c-.32.59-.86.61-1.45.61a.93.93,0,0,1-1-.85c-.17-.83-.58-1.57-.71-2.41a37.86,37.86,0,0,1-.38-4.76,5,5,0,0,0-.09-.94,1,1,0,0,0-.89-.84,1,1,0,0,0-1.13.69,3.9,3.9,0,0,0-.25,1.4A25,25,0,0,0,26.64,25a4.82,4.82,0,0,0,1.76,2.9,3.78,3.78,0,0,0,5.52-1.69,21.69,21.69,0,0,0,1.63-6.46,8.71,8.71,0,0,0,0-3c-.24-1-.58-1.26-1.35-1.17s-1.08.62-1.07,1.47c0,.4,0,.8.06,1.2m-8.68-1.78a1.28,1.28,0,0,0-1.61-1,42.63,42.63,0,0,1-4.65.37,34.52,34.52,0,0,0-5,.75,1.19,1.19,0,0,0-1.06,1.46c.15.6.67.84,1.55.73s1.51-.16,2.26-.27c.41-.06.59.08.61.49a12.35,12.35,0,0,0,.2,2,29.21,29.21,0,0,1,.71,5.81A6.73,6.73,0,0,0,18,29.3a1.18,1.18,0,0,0,2.23-.77c-.38-1.89-.26-3.83-.56-5.72-.19-1.14-.55-2.24-.63-3.41s-.09-1.22,1.1-1.23a13.66,13.66,0,0,0,3.53-.54c.65-.18.73-.65.85-1.16',
|
|
etc25:'M48.4,18.73a1.89,1.89,0,0,1-.08-.58,14.65,14.65,0,0,0-1.13-4.77,18.28,18.28,0,0,0-6.55-8.75,20.07,20.07,0,0,0-4-2.07A34.16,34.16,0,0,0,31.16.87,22,22,0,0,0,23,.13c-.8.11-1.59.26-2.39.41a29.18,29.18,0,0,0-4.11.87A20.19,20.19,0,0,0,9.59,5,8.13,8.13,0,0,0,7.91,6.42c-.86,1.31-2,2.39-2.83,3.73a3.73,3.73,0,0,1-1.16,1.31c-.36.94-.9,1.8-1.32,2.71A30.2,30.2,0,0,0,.15,22a15.61,15.61,0,0,0,.93,7.56,18.46,18.46,0,0,1,1,3.35,2.92,2.92,0,0,0,.32.88C3.18,35.39,4,37,4.79,38.55a3.24,3.24,0,0,1,.36,1.58h0c.26-.24.42-.48.8,0a22.44,22.44,0,0,0,3.43,3.53c.49.39,1.06.62,1.52,1.06a12.83,12.83,0,0,0,6.21,3.12c.57.13,1.12.3,1.68.47a32.56,32.56,0,0,0,3.64.85A15.24,15.24,0,0,0,26,49.3,41.35,41.35,0,0,0,33,48.16,14,14,0,0,0,35.74,47a11.62,11.62,0,0,0,3-1.8c.83-.76,1.68-1.52,2.53-2.26a20.81,20.81,0,0,0,4.67-5.73,18.65,18.65,0,0,0,1.28-3.38c.35-1.06.72-2.14,1-3.21A13.75,13.75,0,0,0,48.62,27a42,42,0,0,1,.11-5A7.59,7.59,0,0,0,48.4,18.73Zm-24.84-1c.05-.66.05-1.25.15-1.83a1.4,1.4,0,0,1,2-1.24.77.77,0,0,1,.62.73,16,16,0,0,1,.07,4.32A1.53,1.53,0,0,1,25,21a1.43,1.43,0,0,1-1.33-1.25,7.46,7.46,0,0,1-.1-1.05C23.55,18.39,23.56,18,23.56,17.76Zm-7.37-2.44a1.78,1.78,0,0,1,1.65-1.78,2.19,2.19,0,0,1,1.79,2,2.15,2.15,0,0,1-1.82,1.84A1.83,1.83,0,0,1,16.19,15.32Zm15,10.32a8.11,8.11,0,0,1-4.62,3.23,7.52,7.52,0,0,1-2.44.46,7.75,7.75,0,0,1-5.89-2.39,1.39,1.39,0,0,1-.19-1.64,1.28,1.28,0,0,1,1.81-.44,4.63,4.63,0,0,1,.8.49c2.2,1.82,5.09,1.18,7-.21a9.83,9.83,0,0,0,1.27-1.23c.55-.6,1.35-.84,1.79-.52A1.56,1.56,0,0,1,31.2,25.64Zm.22-7.87a1.78,1.78,0,0,1-1.84-1.86A2,2,0,0,1,31.4,14a2.27,2.27,0,0,1,1.84,2A1.94,1.94,0,0,1,31.42,17.77Z',
|
|
etc26:'M47.41,10.93C47.16,8.8,47,6.61,45.9,4.59S43.69,1.08,41.37.73a3.2,3.2,0,0,1-.68-.16c-.95-.36-1.87-.89-2.92-.32a.43.43,0,0,1-.35,0,2.2,2.2,0,0,0-1.59.19A9.21,9.21,0,0,0,33,2.07a11.41,11.41,0,0,0-2,1.54c-1,1.24-2.36,2.21-3.22,3.68a14.58,14.58,0,0,0-2.06,4.39c-.11.53-.31,1-.53,1.8-.76-1.15-1.86-1.69-2.52-2.68a3.32,3.32,0,0,0-.91-.92c-2.14-1.46-4.1-3.2-6.61-4.1A13.25,13.25,0,0,0,9,4.94a16.17,16.17,0,0,0-2.16.52A6.25,6.25,0,0,0,3.57,7.24,11.12,11.12,0,0,0,.86,12.07c-.2.92-.64,1.75-.78,2.69a12.57,12.57,0,0,0,.41,4.53,15,15,0,0,0,2.65,6.25c.57.74,1.24,1.42,1.74,2.19A26.14,26.14,0,0,0,7.71,31c1.56,1.7,3.33,3.17,5,4.73,1.43,1.32,2.84,2.67,4.36,3.88a60.64,60.64,0,0,0,5.36,3.25c1.66,1.07,3.25,2.25,4.89,3.36a7,7,0,0,0,3,1.5c1.81.2,2.92-.36,3.41-2.19A6.65,6.65,0,0,1,35,43.05a4,4,0,0,0,.87-1.62,3.35,3.35,0,0,1,.4-.83c.8-1.43,1.63-2.84,2.46-4.25,1.37-2.32,2.65-4.69,4-7,.3-.51.77-.81,1.06-1.34,1.05-1.83,1.4-3.89,2.12-5.83a13.23,13.23,0,0,0,.63-2c.26-1.3.48-2.61.76-3.88A15.86,15.86,0,0,0,47.41,10.93ZM16.83,22.84a2.54,2.54,0,1,1-.17-5.07,2.61,2.61,0,0,1,2.5,2.35A2.5,2.5,0,0,1,16.83,22.84Zm6.47-2.45a5.27,5.27,0,0,1,1.19-.92c.51-.26,2,.56,2.17,1.22.27.86.52,1.73.71,2.6a2.34,2.34,0,0,1-1,2.38,2.45,2.45,0,0,1-2.62-1.3,12.08,12.08,0,0,1-.58-2.86C23.14,21.13,23,20.69,23.3,20.39Zm7.91,10.68a3.62,3.62,0,0,1-.83,1A10.51,10.51,0,0,1,25.43,34a6.82,6.82,0,0,1-2.27-.57c-.57-.28-.71-.82-1.08-1.19-.57-.57-.07-1,.11-1.46.35-.89.56-1,1.47-1a1.81,1.81,0,0,1,.81.09c1.16.59,2.12.06,3.07-.51.3-.18.56-.43.86-.61a2.05,2.05,0,0,1,2.6.17A2.1,2.1,0,0,1,31.21,31.07Zm1-11.39a2.09,2.09,0,0,1-2.64-2.23,3.25,3.25,0,0,1,3-2.92,2.24,2.24,0,0,1,2,2.08A3.2,3.2,0,0,1,32.21,19.68Z',
|
|
etc27:'M63.9,29.32a12.69,12.69,0,0,0-4.94-5c-1.13-.72-2.35-1.23-3.54-1.84A26.9,26.9,0,0,0,52.79,21c-1.62-.6-3.08-1.53-4.7-2.11a1.25,1.25,0,0,1-.93-1c-.12-.86-.53-1.63-.62-2.5a33.8,33.8,0,0,0-.65-3.45c-.35-1.68-.65-3.37-1.12-5A13.65,13.65,0,0,0,42,1.52,4,4,0,0,0,39.84.12a6.77,6.77,0,0,0-5.32,1.25,39.06,39.06,0,0,0-3.69,3.24,38.16,38.16,0,0,0-6.43,8.33.84.84,0,0,1-1,.5,53.26,53.26,0,0,0-5.88-.81,51.41,51.41,0,0,0-11.23-.32A7.59,7.59,0,0,0,1.6,14.22a6.91,6.91,0,0,0-1.16,2,3.63,3.63,0,0,0,.09,3.6A22.84,22.84,0,0,0,4,24.67a6.58,6.58,0,0,1,1.36,1.6,15.55,15.55,0,0,0,2.55,3.3c1.09,1.36,2.28,2.68,3.47,4a1.17,1.17,0,0,1,.21,1.54,22.94,22.94,0,0,0-1,2.2c-.75,2.21-1.48,4.42-2.14,6.65-.4,1.35-.93,2.66-1.36,4a18,18,0,0,0-1,3.37,4.4,4.4,0,0,0,.52,3.27c1.53,2.18,3.86,2.16,6.11,2.18A7.9,7.9,0,0,0,15.66,56c2-.8,4.12-1.16,6.13-1.9.58-.22,1.25-.17,1.83-.39,1-.35,1.94-.8,2.89-1.25a1.7,1.7,0,0,1,2.37.55,3.32,3.32,0,0,0,.94.89c1.36.81,2.38,2,3.65,2.94a24.74,24.74,0,0,0,5,3.06,37.86,37.86,0,0,1,3.8,2A8.82,8.82,0,0,0,46.62,63a1.1,1.1,0,0,0,.44,0c.89-.23,1.94-.25,2.48-1.11a10.89,10.89,0,0,0,1.68-4.34,32.87,32.87,0,0,0,.29-5.16c-.1-2.63-.75-5.19-1-7.8-.15-1.39-.22-1.43,1.18-2.13.93-.47,2-.75,2.88-1.24,2.17-1.15,4.28-2.4,6.46-3.54A11.61,11.61,0,0,0,63.22,36a4.12,4.12,0,0,0,1.24-1.95A6.49,6.49,0,0,0,63.9,29.32ZM33,29a3.94,3.94,0,0,1,1.73-2,1.78,1.78,0,0,1,2.42,1.76,4.37,4.37,0,0,1-1.75,2.94A1.77,1.77,0,0,1,33,30.9,2,2,0,0,1,33,29Zm-2.47-7.75a2.31,2.31,0,0,1,2.11,2c.08.78-.54,1.18-.84,1.73a1.42,1.42,0,0,1-1.64.62A2.06,2.06,0,0,1,28,23.73,2.36,2.36,0,0,1,30.51,21.27ZM36.7,39.91a6.09,6.09,0,0,1-3.16,1.58,18.19,18.19,0,0,1-2.56.25,2.37,2.37,0,0,1-.91-.14,15.65,15.65,0,0,1-4.47-2.48,5,5,0,0,1-1.68-3,11.3,11.3,0,0,1-.2-1.75A3,3,0,0,1,25,32.1a.81.81,0,0,1,.79-.06c1.48.44,1.48.44,1.73,2,.06.35.07.7.13,1.05a1.81,1.81,0,0,0,1,1.47,4,4,0,0,1,.78.5c1.44,1.11,3,.8,4.45.2a3.52,3.52,0,0,1,1.43-.44,1.79,1.79,0,0,1,1.39,3.09Zm5.69-7.53a2.23,2.23,0,0,1-2.29-2.29,2.39,2.39,0,1,1,4.78.11A2.17,2.17,0,0,1,42.39,32.38Z',
|
|
etc28:'M64,31.41a29.9,29.9,0,0,0-1.63-6.1,9.86,9.86,0,0,0-4.78-4.93,13.8,13.8,0,0,0-4.38-1.61c-.57-.09-.75-.37-.59-1a21.42,21.42,0,0,0,.64-5.63A6.54,6.54,0,0,0,53,10.08a15.83,15.83,0,0,0-3.26-6A10.62,10.62,0,0,0,45.24.78,13.76,13.76,0,0,0,40.51,0,21.55,21.55,0,0,0,38,.28a15.25,15.25,0,0,0-7.19,2.56c-.19.14-.41.24-.59.39-.4.32-.7.24-1.15,0A10.44,10.44,0,0,0,24.18,2,17.38,17.38,0,0,0,20,2.35a14.14,14.14,0,0,0-9.94,7.14A18.76,18.76,0,0,0,7.79,16a12.23,12.23,0,0,0,0,5.58c.16.5-.13.6-.45.79a8,8,0,0,0-2.79,2.46,29.15,29.15,0,0,0-3.28,5.51A17.07,17.07,0,0,0,.09,38.38a25,25,0,0,0,.77,3.43A11.51,11.51,0,0,0,3.63,47a11.85,11.85,0,0,0,6.61,3.3,29.13,29.13,0,0,0,4,.26c1,.06,1,0,1.11,1.08a12.17,12.17,0,0,0,.52,3A28.92,28.92,0,0,0,17.06,58c.39.73,1.06,1.12,1.48,1.78a9.93,9.93,0,0,0,3.58,3,15.82,15.82,0,0,0,6,1.85,10.91,10.91,0,0,0,5.22-.44,34.29,34.29,0,0,0,4.88-2,1.13,1.13,0,0,1,1.38.13,25.68,25.68,0,0,0,4.89,3.22,5.49,5.49,0,0,0,2.59.64A16.11,16.11,0,0,0,58.35,61a11.85,11.85,0,0,0,3.35-8.52c0-1,0-2,0-2.94A17.68,17.68,0,0,0,61,43.65,1.72,1.72,0,0,1,61.16,42a24,24,0,0,0,2-3.8A7.65,7.65,0,0,0,64,35.87,14.81,14.81,0,0,0,64,31.41Zm-36.89,10a6.15,6.15,0,0,1-.45.68,1.48,1.48,0,0,1-1.55.42c-.73-.45-.94-.91-.61-1.65a6.84,6.84,0,0,0,.85-2.52,21.18,21.18,0,0,0-.08-4,8.06,8.06,0,0,0-2-3.79,1.26,1.26,0,0,1,.12-1.74,1.29,1.29,0,0,1,1.71,0,9.41,9.41,0,0,1,2.65,4.61A13.92,13.92,0,0,1,27.94,37,7.07,7.07,0,0,1,27.06,41.43Zm2.56-19A2.51,2.51,0,0,1,27.46,20,2,2,0,0,1,29.53,18a2.22,2.22,0,0,1,2.17,2.27A2,2,0,0,1,29.62,22.4Zm11.55-12c1.45.07,2.36.91,2.3,2.13a2.05,2.05,0,0,1-2.08,2.08,2.72,2.72,0,0,1-2.28-2.57A2,2,0,0,1,41.17,10.43Zm-6.05,5.89c.11-.48,0-1,.66-1.25s1.14-.47,1.68.07c.22.22.53.4.65.67a21.41,21.41,0,0,0,1.81,2.72,1.91,1.91,0,0,1,.34,1.66,1.28,1.28,0,0,1-2,.88,4.27,4.27,0,0,1-1.58-1.55c-.47-.71-.93-1.44-1.34-2.19A3.81,3.81,0,0,1,35.12,16.32ZM45.68,42.94c-.74,0-1.47.07-2.21.13a2.79,2.79,0,0,0-2.11.82c-1.13,1-2.3,1.93-2.34,3.63a1.82,1.82,0,0,1-.63,1.1,1.08,1.08,0,0,1-1.72-.39,3.86,3.86,0,0,1,.23-2.95A6.94,6.94,0,0,1,39.59,42c.83-.58.81-.64.48-1.72s-.55-2.11-.91-3.14c-.28-.78.31-1.06.71-1.44a1.31,1.31,0,0,1,1.43-.15.49.49,0,0,1,.31.46,13.1,13.1,0,0,0,.53,2.16,3.88,3.88,0,0,0,.65,1.49,1.18,1.18,0,0,0,1.46.67,3.44,3.44,0,0,1,1.6.12,1.29,1.29,0,0,1,1,1.19A1.42,1.42,0,0,1,45.68,42.94Zm1.24-19.53c-.63,2.56-1.84,4.71-4.5,5.67a3.07,3.07,0,0,1-1.8.41,4.1,4.1,0,0,1-2.76-1.11,1.42,1.42,0,0,1-.32-1.8,1.33,1.33,0,0,1,1.68-.65c.65.18,1.23.63,2,.27a4.36,4.36,0,0,0,2-1.87,14.51,14.51,0,0,0,.8-1.69,1.48,1.48,0,0,1,1.87-.94A1.35,1.35,0,0,1,46.92,23.41Z',
|
|
etc29:'M68.64,12a10.86,10.86,0,0,0-1-3.94,15.82,15.82,0,0,0-4.75-5.68,9.88,9.88,0,0,0-7-2.31,18,18,0,0,0-5.39,1.39C49.11,2,47.76,2.63,46.41,3.2,43.87,4.27,42.22,6.39,40.17,8a11.87,11.87,0,0,0-1.63,2,50.93,50.93,0,0,0-3.94,5.5,2.49,2.49,0,0,1-.92,1.14,1.24,1.24,0,0,1-.37-.46c-1.1-1.74-1.89-3.63-3.1-5.31a24.09,24.09,0,0,0-2.87-3.25A35.68,35.68,0,0,0,21.5,3.18,19.27,19.27,0,0,0,16.38.79a1.73,1.73,0,0,1-.46-.12,6.9,6.9,0,0,0-4.43-.5A8.92,8.92,0,0,0,5.66,3.49a22,22,0,0,0-3.55,6C1.55,11,1.1,12.49.59,14A14.44,14.44,0,0,0,.2,20.6c.29,2,.9,4,1.36,6a26.37,26.37,0,0,0,1.89,4.85,32.22,32.22,0,0,1,1.39,3.07,35,35,0,0,0,1.93,4.11,34.42,34.42,0,0,0,3,5.36c1.24,1.77,2.3,3.67,3.61,5.41a15.28,15.28,0,0,1,1.2,1.53,22.73,22.73,0,0,0,2.49,3.89c.73.85,1.36,1.8,2,2.71.35,1,1.57,1.32,1.87,2.37,1.05.78,1.63,2,2.54,2.89a33,33,0,0,0,4.12,3.8,6.64,6.64,0,0,1,1.78,1.62,6.37,6.37,0,0,0,2.76,2.14,1.81,1.81,0,0,0,1.37.14c1.11-.39,1.93-1.44,3.22-1.47.11,0,.23-.2.32-.33a1.3,1.3,0,0,1,.73-.55,2.83,2.83,0,0,0,1.24-.87c1.79-1.8,3.55-3.63,5.34-5.43.36-.37.48-.87.85-1.25a30.85,30.85,0,0,0,4-4.73,13.35,13.35,0,0,1,1.56-2c1.56-1.61,2.62-3.58,4.05-5.27a19.27,19.27,0,0,1,1.52-1.93,6.56,6.56,0,0,0,1.82-2.41,15.38,15.38,0,0,1,2-3.29,26,26,0,0,0,2.81-5c.66-1.58,1.34-3.15,1.91-4.78s1-3.2,1.42-4.79c.4-1.42.74-2.87,1.21-4.25a34,34,0,0,0,1.27-5.94A19.32,19.32,0,0,0,68.64,12ZM24.12,30.07c-.48.52-.95,1.14-1.72,1.05a3.39,3.39,0,0,1-2.71-1.58,2.18,2.18,0,0,1-.08-1.24c-.24-.95.53-1.56,1-2.27a.88.88,0,0,1,.72-.31c.39,0,.78,0,1.17,0A2.24,2.24,0,0,1,24.75,28,3.06,3.06,0,0,1,24.12,30.07Zm9.58-2.89c1.19-.2,1.73.75,2.11,1.69a11.94,11.94,0,0,1,.73,3.55,2.21,2.21,0,0,1-2,2.3,2.14,2.14,0,0,1-2.14-1.64,22.58,22.58,0,0,0-.87-3.72C31.23,28.52,32.57,27.14,33.7,27.18ZM41.15,42a29.93,29.93,0,0,1-3.46,2.16,11.1,11.1,0,0,1-4.43.86A9.13,9.13,0,0,1,28,43.63a3.85,3.85,0,0,1-2.14-3.52c0-.48.13-.85.61-1a.71.71,0,0,0,.28-.21c.27-.27.5-.71.95-.57s1.17.15,1.59.66c1.22,1.49,2.89,1.69,4.68,1.67a5.84,5.84,0,0,0,2.72-1c.58-.31,1.12-.72,1.7-1a2.58,2.58,0,0,1,2.34-.37A2.17,2.17,0,0,1,41.15,42Zm2.38-14.19A2.57,2.57,0,0,1,41.33,25c0-1.12,1.38-2.74,2.81-2.38,1.49.05,2.4.89,2.37,2.15A2.91,2.91,0,0,1,43.53,27.79Z',
|
|
etc30:'M75.33,35.62a11,11,0,0,0-6.48-4.38c-1-.25-2-.49-2.95-.8a2.53,2.53,0,0,1-1.85-1.31,14.6,14.6,0,0,1-.71-2.36c-.34-1.69-.67-3.39-.87-5.1a12.16,12.16,0,0,1,0-4.54,22.52,22.52,0,0,0,.9-6.27c-.08-2.64-.31-5.25-2.09-7.42A7.08,7.08,0,0,0,56.72.54,8.5,8.5,0,0,0,52,1.29a7.81,7.81,0,0,0-3.9,3.26c-.64,1.12-1.28,2.24-2,3.34A4,4,0,0,1,42.7,10a21.67,21.67,0,0,1-3.51.17,25.82,25.82,0,0,0-3.51-.39c-1,0-1.15-.24-1.35-1.15a20.12,20.12,0,0,0-1.65-4.75C30.79.09,26.25-.89,22.68.79a10.43,10.43,0,0,0-3.05,2.72,7.38,7.38,0,0,0-1.67,3,21.57,21.57,0,0,0-.46,9.08,1.84,1.84,0,0,1,0,.93,4.64,4.64,0,0,0-.19,1.74,18.49,18.49,0,0,1-.12,2.47c-.51,2.85-.92,5.72-1.51,8.56A2.21,2.21,0,0,1,14.29,31c-1.18.41-2.32.93-3.51,1.3A32.37,32.37,0,0,0,2.32,36a4.78,4.78,0,0,0-2,2.29,6.65,6.65,0,0,0,.26,4.9,8.58,8.58,0,0,0,6,5.63c1.77.49,3.51,1.1,5.26,1.65.39.12.77.21,1,.6a18.42,18.42,0,0,1,1,1.74,16.41,16.41,0,0,1,1,4.7c.14,2.27.48,4.52.44,6.8a33.11,33.11,0,0,0,.85,8.18,7.84,7.84,0,0,0,3,4.26,9.72,9.72,0,0,0,5.32,1.94,30,30,0,0,0,5.28-.09A15,15,0,0,0,33.52,78a18.06,18.06,0,0,1,4.36-.77,8.47,8.47,0,0,0,1.72-.35,9.21,9.21,0,0,1,6-.14,22.08,22.08,0,0,0,3.63,1,22.4,22.4,0,0,0,4.08.41A16.92,16.92,0,0,0,58,77.44c2.6-.74,4.73-2.1,5.74-4.78.55-1.47,1-3,1.44-4.47a7.9,7.9,0,0,0,.29-3.61,7.45,7.45,0,0,1-.14-2,31.65,31.65,0,0,0-.72-8.29,3,3,0,0,1,1.69-3.71,7.21,7.21,0,0,1,.74-.36c2.49-1.18,4.94-2.36,6.79-4.55a10.13,10.13,0,0,0,2.58-7.11A5.4,5.4,0,0,0,75.33,35.62ZM9.91,43.53A2.72,2.72,0,0,1,7.45,44.9a3.38,3.38,0,0,1-2.7-2,3.44,3.44,0,0,1,.33-3.45,3.5,3.5,0,0,1,3.34-2A2.75,2.75,0,0,1,11,40.3,7.45,7.45,0,0,1,9.91,43.53ZM31.66,17a1.66,1.66,0,0,1,1.44,1.47,2.37,2.37,0,0,1-2,2.5,1.82,1.82,0,0,1-1.65-1.68A2.88,2.88,0,0,1,31.66,17Zm-8-10.92c.72-.18,1.41-.45,2.13-.65a2.17,2.17,0,0,1,2.77,1.78,3.28,3.28,0,0,1-.73,2.41c-.52.53-1,1.13-1.49,1.65A4.06,4.06,0,0,1,23,12.41a2.64,2.64,0,0,1-2.14-2.79A3.47,3.47,0,0,1,23.67,6.06ZM32.6,71.4a6,6,0,0,1-6.24,2.26c-1.83-.33-2.89-1.58-3.94-2.94a6,6,0,0,1-1.2-4,6.25,6.25,0,0,1,1.71-4.14A8.56,8.56,0,0,1,27.24,60a4.71,4.71,0,0,1,4.52,1.56,5.75,5.75,0,0,0,.44.54,5.18,5.18,0,0,1,1.67,4.22c0,.2,0,.4,0,.59A6.5,6.5,0,0,1,32.6,71.4ZM36,20.08a1.44,1.44,0,0,1,1.28-1,2,2,0,0,1,1.19,1.16c.07.46.09.93.16,1.6a4.47,4.47,0,0,1-.13,1,1.2,1.2,0,0,1-1.08.94,1.22,1.22,0,0,1-1.28-.84A5.16,5.16,0,0,1,36,20.08Zm2.2,8.36a2.21,2.21,0,0,0-1.93-.07c-1,.44-1.73-.43-1.48-1.51a2.38,2.38,0,0,1,2.77-1.74,4.17,4.17,0,0,1,2.06,1.47.91.91,0,0,1,.15.67A1.16,1.16,0,0,1,38.24,28.44Zm14-22.28a3.12,3.12,0,0,1,2.81-1.27A4.81,4.81,0,0,1,59,7.63a1,1,0,0,1-.21,1.27,5.25,5.25,0,0,0-.53.62,2.12,2.12,0,0,1-2.75.86,6.3,6.3,0,0,1-3.19-1.82A1.69,1.69,0,0,1,52.28,6.16ZM45.87,20.39a1.7,1.7,0,0,1-1.8-1.74,1.78,1.78,0,0,1,2-1.87,1.7,1.7,0,0,1,1.67,1.63A2.12,2.12,0,0,1,45.87,20.39ZM60.29,70.64a5.14,5.14,0,0,1-6,3.3c-1-.17-2-.14-3-.39a3.38,3.38,0,0,1-2.52-2.37,10.31,10.31,0,0,1-.44-5.64,4.25,4.25,0,0,1,1.4-2.25,6.5,6.5,0,0,1,5.06-1.76c.84.1,1.7.17,2.55.33a4.1,4.1,0,0,1,3.12,3,5.16,5.16,0,0,1,.33,2.46A7.68,7.68,0,0,1,60.29,70.64Zm12-30a7.08,7.08,0,0,1-1.55,2.73,3.13,3.13,0,0,1-4,0,3.85,3.85,0,0,1-1.33-3.25,7.89,7.89,0,0,1,1.34-4.41,1.87,1.87,0,0,1,2-.78,5.45,5.45,0,0,1,3.06,2.24A4,4,0,0,1,72.32,40.63Z',
|
|
etc31:'M75.24,35.48a10.19,10.19,0,0,0-5.18-3.85c-1.34-.43-2.68-.87-4.06-1.18a2.39,2.39,0,0,1-1.94-1.37,17.57,17.57,0,0,1-.62-1.9c-.45-2.26-.87-4.54-1.11-6.84a9,9,0,0,1,.16-3.27,22.46,22.46,0,0,0,.75-8.36,9.87,9.87,0,0,0-2-5.32,7.17,7.17,0,0,0-3.4-2.6c-3-.9-5.56,0-7.94,1.75A8.69,8.69,0,0,0,47.5,5.67,18.66,18.66,0,0,1,45.24,9.1c-.26.3-.5.64-.93.67-1.75.12-3.47.7-5.26.37a19.92,19.92,0,0,0-3.27-.33c-1,0-1.29-.28-1.47-1.31a13.89,13.89,0,0,0-.85-2.93,10.2,10.2,0,0,0-2-3.45C29.22-.09,26.53-.37,23.61.36a5.44,5.44,0,0,0-1,.43,8.13,8.13,0,0,0-2.41,2,9.78,9.78,0,0,0-2.36,4,24.36,24.36,0,0,0-.64,4.89c-.16,2,.6,4,.08,6,0,0,0,.08,0,.12a25.83,25.83,0,0,1-.5,5.26c-.2.92-.32,1.86-.5,2.78a34.07,34.07,0,0,1-.67,3.46A2.22,2.22,0,0,1,14.26,31c-1.08.37-2.11.86-3.19,1.2A31.33,31.33,0,0,0,2.39,36a5,5,0,0,0-2.2,2.92c-.6,2.35.34,4.34,1.4,6.24a7.27,7.27,0,0,0,3.78,3.21,48.64,48.64,0,0,0,4.79,1.56c2.47.7,3.1,1.18,3.89,3.4a11,11,0,0,1,.33,1.25,50.2,50.2,0,0,1,.92,9.7A45.84,45.84,0,0,0,16,72.13a7.86,7.86,0,0,0,2.75,4.4,9.63,9.63,0,0,0,5.6,2.18,25.75,25.75,0,0,0,4.81-.06A17.74,17.74,0,0,0,33.49,78a21.93,21.93,0,0,1,3.66-.72,13.14,13.14,0,0,0,2.32-.35,9.27,9.27,0,0,1,6.89.08,3.38,3.38,0,0,0,.57.12,26.61,26.61,0,0,0,4.61.79,15.69,15.69,0,0,0,8.59-1.35A6.56,6.56,0,0,0,63.54,73,45.24,45.24,0,0,0,65,68.67a7.91,7.91,0,0,0,.48-3.6,22.64,22.64,0,0,1-.15-4.28,29.35,29.35,0,0,0-.83-6.57,3,3,0,0,1,1.29-3.35,18.83,18.83,0,0,1,2.72-1.39c3.87-1.88,6.88-4.47,7.72-9A6.17,6.17,0,0,0,75.24,35.48Zm-66,8.79c-.75.85-3,.57-3.75-.32-1.57-1.79-1.37-4,.75-5.81a2.74,2.74,0,0,1,4.11.35c.44.54.5.8.5,2A5.51,5.51,0,0,1,9.26,44.27Zm20.47-25.8a3,3,0,0,1,1.08-1.21,1.26,1.26,0,0,1,1.43-.09,1.53,1.53,0,0,1,.82,1.57,2.23,2.23,0,0,1-.91,1.78,1.65,1.65,0,0,1-2.15,0A1.82,1.82,0,0,1,29.73,18.47ZM21,9.41a8.8,8.8,0,0,1,.26-1.26,2.91,2.91,0,0,1,2.55-2.1,16.55,16.55,0,0,0,1.91-.55,2.13,2.13,0,0,1,2.79,2.66,2.62,2.62,0,0,1-.88,1.6,3.1,3.1,0,0,0-.74.9,3.83,3.83,0,0,1-3.37,1.77A2.51,2.51,0,0,1,21,9.41ZM33.82,68a14.43,14.43,0,0,1-.51,2.16c-.8,2.19-3.45,3.84-5.18,3.65-2.6-.09-4.36-1-5.57-3A7.66,7.66,0,0,1,21.23,67a6.12,6.12,0,0,1,1.67-4.25c.36-.41.76-.79,1.16-1.17a5.57,5.57,0,0,1,6.26-1.27,6,6,0,0,1,2.44,2.3A6.59,6.59,0,0,1,33.82,68Zm2.33-48.19a1.28,1.28,0,0,1,1.1-.76,1.3,1.3,0,0,1,1.16.85,5.78,5.78,0,0,1,.23,2.55,1.36,1.36,0,0,1-1.21,1.23c-.71,0-1.16-.4-1.33-1.22a4.11,4.11,0,0,1-.17-1.4A2.27,2.27,0,0,1,36.15,19.81ZM38,28.36c-.52-.24-.92-.46-1.48-.05a1.22,1.22,0,0,1-1.41-.21,1.16,1.16,0,0,1-.25-1.4,2.32,2.32,0,0,1,3.7-1.11l.83.65a1.11,1.11,0,0,1,.44,1A1.24,1.24,0,0,1,38,28.36ZM52.35,6.09A3.88,3.88,0,0,1,55.23,4.9a5.43,5.43,0,0,1,3.56,2.29,1,1,0,0,1,.19.54c.17,1.39-1.72,3.18-3,2.75a8.16,8.16,0,0,1-2.79-1.09,4.14,4.14,0,0,1-.48-.34C51.87,8.23,51.34,7.22,52.35,6.09ZM45.9,20.36a1.65,1.65,0,0,1-1.79-1.73A1.71,1.71,0,0,1,46,16.77a1.67,1.67,0,0,1,1.67,1.61A2.1,2.1,0,0,1,45.9,20.36ZM60.27,70.67A5,5,0,0,1,55.48,74c-1.21,0-2.41-.23-3.61-.36a3.89,3.89,0,0,1-3.47-3.81c-.09-.74-.14-1.48-.24-2.21a5.36,5.36,0,0,1,3.17-5.4,6.06,6.06,0,0,1,4.44-.5,1,1,0,0,0,.35,0A4.16,4.16,0,0,1,60,63.87a5.37,5.37,0,0,1,.85,3.24A10.27,10.27,0,0,1,60.27,70.67ZM70.38,43.59A2.84,2.84,0,0,1,67,43.44a4.2,4.2,0,0,1-1.46-4,9.78,9.78,0,0,1,.91-3.25,2.11,2.11,0,0,1,3.12-1.06,6,6,0,0,1,2,1.56,3.17,3.17,0,0,1,.82,2.64C72.6,41.26,71.61,42.5,70.38,43.59Z',
|
|
etc32:'M75.7,35.16a9.21,9.21,0,0,0-6.56-5.36,37.79,37.79,0,0,0-4.6-.91,2,2,0,0,1-1.76-1c-.25-.62-.6-1.18-.8-1.82q-1-3.32-1.76-6.7A8.12,8.12,0,0,1,60,16.2a24.76,24.76,0,0,0,.31-6.43c-.25-2.69-.85-5.25-2.79-7.31A6.56,6.56,0,0,0,51.44.1a9,9,0,0,0-7.4,6,19.12,19.12,0,0,1-1.92,3.63,1.43,1.43,0,0,1-.86.73,20,20,0,0,1-5.31.9,32.83,32.83,0,0,0-3.29,0c-1,.05-1.16-.14-1.44-1a21.93,21.93,0,0,0-2-4.47c-2.27-3.82-7.26-4.24-10.51-2.11a9,9,0,0,0-2,2.1,9.66,9.66,0,0,0-2,4.32,30.36,30.36,0,0,0-.15,4.57c-.06,2,1,3.87.61,5.9.52,2.86,0,5.71-.16,8.56a27.6,27.6,0,0,1-.33,3.51,2.41,2.41,0,0,1-1.22,1.77c-1,.57-2.1,1-3.18,1.51A34.13,34.13,0,0,0,2,40.54,5,5,0,0,0,.07,43.68C-.29,46,.78,47.82,2,49.56a8,8,0,0,0,5,3.25,48.17,48.17,0,0,0,5.16,1.06,3.37,3.37,0,0,1,2.67,2,9.58,9.58,0,0,1,.68,1.49,18.25,18.25,0,0,1,1.16,4.54c.23,1.75.77,3.45.88,5.22a35.74,35.74,0,0,0,1.52,8.19,8.08,8.08,0,0,0,3.12,4,8.4,8.4,0,0,0,4.61,1.57A28.31,28.31,0,0,0,35,80c2-.44,3.86-1.46,5.93-1.74a11.69,11.69,0,0,0,2.35-.69A9.56,9.56,0,0,1,49.05,77a14.8,14.8,0,0,0,5.7.59c2.18.39,4.31-.34,6.42-1.07a7.72,7.72,0,0,0,5.48-5.78c.23-1,.46-2.06.7-3.1a9.72,9.72,0,0,0,.06-4.88A6.84,6.84,0,0,1,67.16,61a30.79,30.79,0,0,0-1.53-8.17,3,3,0,0,1,1.07-3.63,7.92,7.92,0,0,1,1-.65c2.17-1.33,4.34-2.59,6-4.69A11.06,11.06,0,0,0,76,36.65,4.07,4.07,0,0,0,75.7,35.16Zm-67.62,12c-.7.9-2.93.76-3.76-.08-1.69-1.69-1.63-4,.37-5.85a2.75,2.75,0,0,1,4.13.09c.47.51.55.76.62,2A5.49,5.49,0,0,1,8.08,47.15ZM34,21.53a1.53,1.53,0,0,1,1.13-1.21,1.65,1.65,0,0,1,1.39,1.2c.11.42.23.83.32,1.25a1.83,1.83,0,0,1-.2,1.48,1.2,1.2,0,0,1-1.12.72,1.25,1.25,0,0,1-1.09-.8,5.85,5.85,0,0,1-.47-2.3A2.45,2.45,0,0,1,34,21.53Zm-6.52-.85a3.28,3.28,0,0,1,.9-1.36c.45-.4.9-.74,1.57-.41a1.55,1.55,0,0,1,1,1.54,2.42,2.42,0,0,1-1.19,2.13A1.78,1.78,0,0,1,28,22.47,2,2,0,0,1,27.45,20.68Zm-7.22-6.21a2.5,2.5,0,0,1-2.7-2.86,7.93,7.93,0,0,1,.18-1.27,2.91,2.91,0,0,1,2.4-2.26A15.08,15.08,0,0,0,22,7.41a2.13,2.13,0,0,1,3,2.48,2.7,2.7,0,0,1-.77,1.66,3.09,3.09,0,0,0-.69.94A3.81,3.81,0,0,1,20.23,14.47ZM34.1,69.27a13.75,13.75,0,0,1-.38,2.19c-.65,2.23-3.19,4.05-4.92,4-2.61.08-4.42-.7-5.76-2.62a7.73,7.73,0,0,1-1.57-3.7,6.15,6.15,0,0,1,1.4-4.35A15.85,15.85,0,0,1,24,63.52a5.56,5.56,0,0,1,6.16-1.67A6.11,6.11,0,0,1,32.7,64,6.56,6.56,0,0,1,34.1,69.27Zm4.32-40.41a1.37,1.37,0,0,1-1.35.72,2.78,2.78,0,0,1-.56-.16,1,1,0,0,0-1.08.09,1.42,1.42,0,0,1-1.72-.05,1.46,1.46,0,0,1,0-1.75c.79-1.5,2.21-1.9,3.48-.93a10.78,10.78,0,0,1,1,.67A1.33,1.33,0,0,1,38.42,28.86Zm5.14-8c-1.07,0-1.62-.67-1.7-1.81a1.83,1.83,0,0,1,1.92-1.78c.94,0,1.53.54,1.63,1.63A1.86,1.86,0,0,1,43.56,20.81ZM48.65,6.3a3.88,3.88,0,0,1,2.79-1.37A5.48,5.48,0,0,1,55.15,7a1.09,1.09,0,0,1,.22.53c.26,1.38-1.51,3.28-2.85,2.94a8.3,8.3,0,0,1-2.87-.91,4.07,4.07,0,0,1-.49-.31C48.31,8.47,47.71,7.5,48.65,6.3Zm12,64a5,5,0,0,1-4.57,3.62c-1.2,0-2.41-.08-3.62-.13a3.9,3.9,0,0,1-3.71-3.59c-.13-.73-.23-1.46-.38-2.19a5.36,5.36,0,0,1,2.82-5.59,6.08,6.08,0,0,1,4.41-.78,1,1,0,0,0,.35,0,4.15,4.15,0,0,1,4,1.89A5.33,5.33,0,0,1,61,66.66,10.07,10.07,0,0,1,60.66,70.25ZM69,42.58a2.85,2.85,0,0,1-3.39.07,4.2,4.2,0,0,1-1.71-3.86,9.64,9.64,0,0,1,.7-3.3,2.12,2.12,0,0,1,3.05-1.26,6,6,0,0,1,2.13,1.43,3.15,3.15,0,0,1,1,2.58A4.82,4.82,0,0,1,69,42.58Z',
|
|
};
|
|
|
|
var pathColor = {
|
|
arrow:'#ffffff',
|
|
cancel:'#ffffff',
|
|
clock:'#ffffff',
|
|
idea:'#ffffff',
|
|
phone:'#ffffff',
|
|
1:'#ffffff',
|
|
2:'#ffffff',
|
|
arrow1:'#ffffff',
|
|
arrow2:'#ffffff',
|
|
arrow9:'#ffffff',
|
|
arrow10:'#ffffff',
|
|
arrow11:'#ffffff',
|
|
arrow12:'#ffffff',
|
|
arrow13:'#ffffff',
|
|
arrow14:'#ffffff',
|
|
arrow15:'#ffffff',
|
|
arrow16:'#ffffff',
|
|
arrow17:'#ffffff',
|
|
arrow18:'#ffffff',
|
|
arrow19:'#ffffff',
|
|
arrow20:'#ffffff',
|
|
arrow21:'#ffffff',
|
|
figure1:'#ffffff',
|
|
figure2:'#ffffff',
|
|
figure3:'#ffffff',
|
|
figure4:'#ffffff',
|
|
figure5:'#ffffff',
|
|
figure6:'#ffffff',
|
|
figure7:'#ffffff',
|
|
label1:'#ffffff',
|
|
label2:'#ffffff',
|
|
label3:'#ffffff',
|
|
label4:'#ffffff',
|
|
label5:'#ffffff',
|
|
label6:'#ffffff',
|
|
label7:'#ffffff',
|
|
label8:'#ffffff',
|
|
label9:'#ffffff',
|
|
label10:'#ffffff',
|
|
label11:'#ffffff',
|
|
label12:'#ffffff',
|
|
label13:'#ffffff',
|
|
label14:'#ffffff',
|
|
etc1:'#ffb100',
|
|
etc2:'#007998',
|
|
etc3:'#008945',
|
|
etc4:'#da0043',
|
|
etc5:'#fabe31',
|
|
etc7:'#c51f21',
|
|
etc8:'#007998',
|
|
etc9:'#342288',
|
|
etc10:'#0c0b0b',
|
|
etc11:'#f1f1f1',
|
|
etc12:'#ffb100',
|
|
etc13:'#007998',
|
|
etc14:'#c51f21',
|
|
etc15:'#007e9c',
|
|
etc16:'#ffb100',
|
|
etc17:'#007e9c',
|
|
etc18:'#e75a27',
|
|
etc19:'#ffb100',
|
|
etc20:'#c51f21',
|
|
etc21:'#369cb8',
|
|
etc22:'#823183',
|
|
etc23:'#539850',
|
|
etc24:'#e75a27',
|
|
etc25:'#ffa600',
|
|
etc26:'#50974e',
|
|
etc27:'#fbc44f',
|
|
etc28:'#953f95',
|
|
etc29:'#c30a3f',
|
|
etc30:'#369cb9',
|
|
etc31:'#fcbe2f',
|
|
etc32:'#c30a3f',
|
|
};
|
|
/**
|
|
* 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, _consts.componentNames.ICON, graphics));
|
|
_this._oColor = pathColor;
|
|
|
|
/**
|
|
* Path value of each icon type
|
|
* @type {Object}
|
|
*/
|
|
_this._pathMap = pathMap;
|
|
|
|
/**
|
|
* Type of the drawing icon
|
|
* @type {string}
|
|
* @private
|
|
*/
|
|
_this._type = null;
|
|
|
|
/**
|
|
* Color of the drawing icon
|
|
* @type {string}
|
|
* @private
|
|
*/
|
|
_this._iconColor = null;
|
|
|
|
/**
|
|
* Event handler list
|
|
* @type {Object}
|
|
* @private
|
|
*/
|
|
_this._handlers = {
|
|
mousedown: _this._onFabricMouseDown.bind(_this),
|
|
mousemove: _this._onFabricMouseMove.bind(_this),
|
|
mouseup: _this._onFabricMouseUp.bind(_this)
|
|
};
|
|
return _this;
|
|
}
|
|
|
|
/**
|
|
* Set states of the current drawing shape
|
|
* @ignore
|
|
* @param {string} type - Icon type ('arrow', 'cancel', custom icon name)
|
|
* @param {string} iconColor - Icon foreground color
|
|
*/
|
|
|
|
|
|
_createClass(Icon, [{
|
|
key: 'setStates',
|
|
value: function setStates(type, iconColor) {
|
|
this._type = type;
|
|
this._iconColor = iconColor;
|
|
}
|
|
|
|
/**
|
|
* Start to draw the icon on canvas
|
|
* @ignore
|
|
*/
|
|
|
|
}, {
|
|
key: 'start',
|
|
value: function start() {
|
|
var canvas = this.getCanvas();
|
|
canvas.selection = false;
|
|
canvas.on('mouse:down', this._handlers.mousedown);
|
|
}
|
|
|
|
/**
|
|
* End to draw the icon on canvas
|
|
* @ignore
|
|
*/
|
|
|
|
}, {
|
|
key: 'end',
|
|
value: function end() {
|
|
var canvas = this.getCanvas();
|
|
|
|
canvas.selection = true;
|
|
canvas.off({
|
|
'mouse:down': this._handlers.mousedown
|
|
});
|
|
}
|
|
|
|
/**
|
|
* 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}
|
|
*/
|
|
|
|
}, {
|
|
key: 'add',
|
|
value: function add(type, options) {
|
|
var _this2 = this;
|
|
|
|
return new _util.Promise(function (resolve, reject) {
|
|
var canvas = _this2.getCanvas();
|
|
var path = _this2._pathMap[type];
|
|
var selectionStyle = _consts.fObjectOptions.SELECTION_STYLE;
|
|
var icon = path ? _this2._createIcon(path) : null;
|
|
_this2._icon = icon;
|
|
|
|
if (!icon) {
|
|
reject(_consts.rejectMessages.invalidParameters);
|
|
}
|
|
|
|
icon.set(_tuiCodeSnippet2.default.extend({
|
|
type: 'icon',
|
|
fill: _this2._oColor[type]
|
|
}, selectionStyle, options, _this2.graphics.controlStyle));
|
|
|
|
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.set({ fill: 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 _fabric2.default.Path(path);
|
|
}
|
|
|
|
/**
|
|
* MouseDown event handler on canvas
|
|
* @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event object
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onFabricMouseDown',
|
|
value: function _onFabricMouseDown(fEvent) {
|
|
var _this4 = this;
|
|
|
|
var canvas = this.getCanvas();
|
|
|
|
this._startPoint = canvas.getPointer(fEvent.e);
|
|
var _startPoint = this._startPoint,
|
|
left = _startPoint.x,
|
|
top = _startPoint.y;
|
|
|
|
|
|
this.add(this._type, {
|
|
left: left,
|
|
top: top,
|
|
fill: this._iconColor
|
|
}).then(function () {
|
|
_this4.fire(_consts.eventNames.ADD_OBJECT, _this4.graphics.createObjectProperties(_this4._icon));
|
|
canvas.on('mouse:move', _this4._handlers.mousemove);
|
|
canvas.on('mouse:up', _this4._handlers.mouseup);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* MouseMove event handler on canvas
|
|
* @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event object
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onFabricMouseMove',
|
|
value: function _onFabricMouseMove(fEvent) {
|
|
var canvas = this.getCanvas();
|
|
|
|
if (!this._icon) {
|
|
return;
|
|
}
|
|
var moveOriginPointer = canvas.getPointer(fEvent.e);
|
|
|
|
var scaleX = (moveOriginPointer.x - this._startPoint.x) / this._icon.width;
|
|
var scaleY = (moveOriginPointer.y - this._startPoint.y) / this._icon.height;
|
|
|
|
this._icon.set({
|
|
scaleX: Math.abs(scaleX * 2),
|
|
scaleY: Math.abs(scaleY * 2)
|
|
});
|
|
|
|
this._icon.setCoords();
|
|
canvas.renderAll();
|
|
}
|
|
|
|
/**
|
|
* MouseUp event handler on canvas
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onFabricMouseUp',
|
|
value: function _onFabricMouseUp() {
|
|
var canvas = this.getCanvas();
|
|
|
|
this.fire(_consts.eventNames.OBJECT_ADDED, this.graphics.createObjectProperties(this._icon));
|
|
|
|
this._icon = null;
|
|
|
|
canvas.off('mouse:down', this._handlers.mousedown);
|
|
canvas.off('mouse:move', this._handlers.mousemove);
|
|
canvas.off('mouse:up', this._handlers.mouseup);
|
|
}
|
|
}]);
|
|
|
|
return Icon;
|
|
}(_component2.default);
|
|
|
|
exports.default = Icon;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/component/imageLoader.js":
|
|
/*!*****************************************!*\
|
|
!*** ./src/js/component/imageLoader.js ***!
|
|
\*****************************************/
|
|
/*! no static exports found */
|
|
/***/ (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 _component = __webpack_require__(/*! @/interface/component */ "./src/js/interface/component.js");
|
|
|
|
var _component2 = _interopRequireDefault(_component);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Image loader
|
|
*/
|
|
|
|
|
|
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, _consts.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 {Promise}
|
|
*/
|
|
|
|
|
|
_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 _util.Promise(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 {Promise}
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_setBackgroundImage',
|
|
value: function _setBackgroundImage(img) {
|
|
var _this3 = this;
|
|
|
|
if (!img) {
|
|
return _util.Promise.reject(_consts.rejectMessages.loadImage);
|
|
}
|
|
|
|
return new _util.Promise(function (resolve, reject) {
|
|
var canvas = _this3.getCanvas();
|
|
|
|
canvas.setBackgroundImage(img, function () {
|
|
var oImage = canvas.backgroundImage;
|
|
|
|
if (oImage && oImage.getElement()) {
|
|
resolve(oImage);
|
|
} else {
|
|
reject(_consts.rejectMessages.loadingImageFailed);
|
|
}
|
|
}, imageOption);
|
|
});
|
|
}
|
|
}]);
|
|
|
|
return ImageLoader;
|
|
}(_component2.default);
|
|
|
|
exports.default = ImageLoader;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/component/line.js":
|
|
/*!**********************************!*\
|
|
!*** ./src/js/component/line.js ***!
|
|
\**********************************/
|
|
/*! no static exports found */
|
|
/***/ (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__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _fabric = __webpack_require__(/*! fabric */ "fabric");
|
|
|
|
var _fabric2 = _interopRequireDefault(_fabric);
|
|
|
|
var _component = __webpack_require__(/*! @/interface/component */ "./src/js/interface/component.js");
|
|
|
|
var _component2 = _interopRequireDefault(_component);
|
|
|
|
var _arrowLine = __webpack_require__(/*! @/extension/arrowLine */ "./src/js/extension/arrowLine.js");
|
|
|
|
var _arrowLine2 = _interopRequireDefault(_arrowLine);
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Free drawing module, Set brush
|
|
*/
|
|
|
|
|
|
/**
|
|
* 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, _consts.componentNames.LINE, graphics));
|
|
|
|
_this._width = 12;
|
|
|
|
/**
|
|
* fabric.Color instance for brush color
|
|
* @type {fabric.Color}
|
|
* @private
|
|
*/
|
|
_this._oColor = new _fabric2.default.Color('rgba(0, 0, 0, 0.5)');
|
|
|
|
/**
|
|
* Listeners
|
|
* @type {object.<string, function>}
|
|
* @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: 'setHeadOption',
|
|
value: function setHeadOption(setting) {
|
|
var _setting$arrowType = setting.arrowType,
|
|
arrowType = _setting$arrowType === undefined ? {
|
|
head: null,
|
|
tail: null
|
|
} : _setting$arrowType;
|
|
|
|
|
|
this._arrowType = arrowType;
|
|
}
|
|
|
|
/**
|
|
* Start drawing line mode
|
|
* @param {{width: ?number, color: ?string}} [setting] - Brush width & color
|
|
*/
|
|
|
|
}, {
|
|
key: 'start',
|
|
value: function start() {
|
|
var setting = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
|
|
var canvas = this.getCanvas();
|
|
|
|
canvas.defaultCursor = 'crosshair';
|
|
canvas.selection = false;
|
|
|
|
this.setHeadOption(setting);
|
|
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 _fabric2.default.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 _canvas$getPointer = canvas.getPointer(fEvent.e),
|
|
x = _canvas$getPointer.x,
|
|
y = _canvas$getPointer.y;
|
|
|
|
var points = [x, y, x, y];
|
|
|
|
this._line = new _arrowLine2.default(points, {
|
|
stroke: this._oColor.toRgba(),
|
|
strokeWidth: this._width,
|
|
arrowType: this._arrowType,
|
|
evented: false
|
|
});
|
|
|
|
this._line.set(_consts.fObjectOptions.SELECTION_STYLE);
|
|
|
|
canvas.add(this._line);
|
|
|
|
canvas.on({
|
|
'mouse:move': this._listeners.mousemove,
|
|
'mouse:up': this._listeners.mouseup
|
|
});
|
|
|
|
this.fire(_consts.eventNames.ADD_OBJECT, this._createLineEventObjectProperties());
|
|
}
|
|
|
|
/**
|
|
* 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
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onFabricMouseUp',
|
|
value: function _onFabricMouseUp() {
|
|
var canvas = this.getCanvas();
|
|
|
|
this.fire(_consts.eventNames.OBJECT_ADDED, this._createLineEventObjectProperties());
|
|
|
|
this._line = null;
|
|
|
|
canvas.off({
|
|
'mouse:move': this._listeners.mousemove,
|
|
'mouse:up': this._listeners.mouseup
|
|
});
|
|
}
|
|
|
|
/**
|
|
* create line event object properties
|
|
* @returns {Object} properties line object
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_createLineEventObjectProperties',
|
|
value: function _createLineEventObjectProperties() {
|
|
var params = this.graphics.createObjectProperties(this._line);
|
|
var _line = this._line,
|
|
x1 = _line.x1,
|
|
x2 = _line.x2,
|
|
y1 = _line.y1,
|
|
y2 = _line.y2;
|
|
|
|
|
|
return _tuiCodeSnippet2.default.extend({}, params, {
|
|
startPosition: {
|
|
x: x1,
|
|
y: y1
|
|
},
|
|
endPosition: {
|
|
x: x2,
|
|
y: y2
|
|
}
|
|
});
|
|
}
|
|
}]);
|
|
|
|
return Line;
|
|
}(_component2.default);
|
|
|
|
exports.default = Line;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/component/rotation.js":
|
|
/*!**************************************!*\
|
|
!*** ./src/js/component/rotation.js ***!
|
|
\**************************************/
|
|
/*! no static exports found */
|
|
/***/ (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 _fabric = __webpack_require__(/*! fabric */ "fabric");
|
|
|
|
var _fabric2 = _interopRequireDefault(_fabric);
|
|
|
|
var _component = __webpack_require__(/*! @/interface/component */ "./src/js/interface/component.js");
|
|
|
|
var _component2 = _interopRequireDefault(_component);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Image rotation module
|
|
*/
|
|
|
|
|
|
/**
|
|
* 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, _consts.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 {Promise}
|
|
*/
|
|
|
|
}, {
|
|
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.set({ angle: angle }).setCoords();
|
|
this.adjustCanvasDimension();
|
|
var newImageCenter = canvasImage.getCenterPoint();
|
|
this._rotateForEachObject(oldImageCenter, newImageCenter, angle - oldAngle);
|
|
|
|
return _util.Promise.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 = _fabric2.default.util.degreesToRadians(angleDiff);
|
|
var newObjCenter = _fabric2.default.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 {Promise}
|
|
*/
|
|
|
|
}, {
|
|
key: 'rotate',
|
|
value: function rotate(additionalAngle) {
|
|
var current = this.getCurrentAngle();
|
|
|
|
return this.setAngle(current + additionalAngle);
|
|
}
|
|
}]);
|
|
|
|
return Rotation;
|
|
}(_component2.default);
|
|
|
|
exports.default = Rotation;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/component/shape.js":
|
|
/*!***********************************!*\
|
|
!*** ./src/js/component/shape.js ***!
|
|
\***********************************/
|
|
/*! no static exports found */
|
|
/***/ (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__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _fabric = __webpack_require__(/*! fabric */ "fabric");
|
|
|
|
var _fabric2 = _interopRequireDefault(_fabric);
|
|
|
|
var _component = __webpack_require__(/*! @/interface/component */ "./src/js/interface/component.js");
|
|
|
|
var _component2 = _interopRequireDefault(_component);
|
|
|
|
var _shapeResizeHelper = __webpack_require__(/*! @/helper/shapeResizeHelper */ "./src/js/helper/shapeResizeHelper.js");
|
|
|
|
var _shapeResizeHelper2 = _interopRequireDefault(_shapeResizeHelper);
|
|
|
|
var _shapeFilterFillHelper = __webpack_require__(/*! @/helper/shapeFilterFillHelper */ "./src/js/helper/shapeFilterFillHelper.js");
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Shape component
|
|
*/
|
|
|
|
|
|
var SHAPE_INIT_OPTIONS = (0, _tuiCodeSnippet.extend)({
|
|
strokeWidth: 1,
|
|
stroke: '#000000',
|
|
fill: '#ffffff',
|
|
width: 1,
|
|
height: 1,
|
|
rx: 0,
|
|
ry: 0
|
|
}, _consts.SHAPE_DEFAULT_OPTIONS);
|
|
var DEFAULT_TYPE = 'rect';
|
|
var DEFAULT_WIDTH = 20;
|
|
var DEFAULT_HEIGHT = 20;
|
|
|
|
/**
|
|
* Make fill option
|
|
* @param {Object} options - Options to create the shape
|
|
* @param {Object.Image} canvasImage - canvas background image
|
|
* @param {Function} createStaticCanvas - static canvas creater
|
|
* @returns {Object} - shape option
|
|
* @private
|
|
*/
|
|
function makeFabricFillOption(options, canvasImage, createStaticCanvas) {
|
|
var fillOption = options.fill;
|
|
var fillType = (0, _util.getFillTypeFromOption)(options.fill);
|
|
var fill = fillOption;
|
|
|
|
if (fillOption.color) {
|
|
fill = fillOption.color;
|
|
}
|
|
|
|
var extOption = null;
|
|
if (fillType === 'filter') {
|
|
var newStaticCanvas = createStaticCanvas();
|
|
extOption = (0, _shapeFilterFillHelper.makeFillPatternForFilter)(canvasImage, fillOption.filter, newStaticCanvas);
|
|
} else {
|
|
extOption = { fill: fill };
|
|
}
|
|
|
|
return (0, _tuiCodeSnippet.extend)({}, options, extOption);
|
|
}
|
|
|
|
/**
|
|
* 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, _consts.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)({}, SHAPE_INIT_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.uniformScaling = true;
|
|
canvas.on({
|
|
'mouse:down': this._handlers.mousedown
|
|
});
|
|
|
|
_fabric2.default.util.addListener(document, 'keydown', this._handlers.keydown);
|
|
_fabric2.default.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.uniformScaling = false;
|
|
canvas.off({
|
|
'mouse:down': this._handlers.mousedown
|
|
});
|
|
|
|
_fabric2.default.util.removeListener(document, 'keydown', this._handlers.keydown);
|
|
_fabric2.default.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 {(ShapeFillOption | string)} [options.fill] - {@link ShapeFillOption} or
|
|
* 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 {(ShapeFillOption | string)} [options.fill] - ShapeFillOption or Shape foreground color (ex: '#fff', 'transparent') or ShapeFillOption object
|
|
* @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 _util.Promise(function (resolve) {
|
|
var canvas = _this2.getCanvas();
|
|
var extendOption = _this2._extendOptions(options);
|
|
|
|
var shapeObj = _this2._createInstance(type, extendOption);
|
|
var objectProperties = _this2.graphics.createObjectProperties(shapeObj);
|
|
|
|
_this2._bindEventOnShape(shapeObj);
|
|
|
|
canvas.add(shapeObj).setActiveObject(shapeObj);
|
|
|
|
_this2._resetPositionFillFilter(shapeObj);
|
|
|
|
resolve(objectProperties);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Change the shape
|
|
* @ignore
|
|
* @param {fabric.Object} shapeObj - Selected shape object on canvas
|
|
* @param {Object} options - Shape options
|
|
* @param {(ShapeFillOption | string)} [options.fill] - {@link ShapeFillOption} or
|
|
* 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 _util.Promise(function (resolve, reject) {
|
|
if (!(0, _util.isShape)(shapeObj)) {
|
|
reject(_consts.rejectMessages.unsupportedType);
|
|
}
|
|
var hasFillOption = (0, _util.getFillTypeFromOption)(options.fill) === 'filter';
|
|
var _graphics = _this3.graphics,
|
|
canvasImage = _graphics.canvasImage,
|
|
createStaticCanvas = _graphics.createStaticCanvas;
|
|
|
|
|
|
shapeObj.set(hasFillOption ? makeFabricFillOption(options, canvasImage, createStaticCanvas) : options);
|
|
|
|
if (hasFillOption) {
|
|
_this3._resetPositionFillFilter(shapeObj);
|
|
}
|
|
|
|
_this3.getCanvas().renderAll();
|
|
resolve();
|
|
});
|
|
}
|
|
|
|
/**
|
|
* make fill property for user event
|
|
* @param {fabric.Object} shapeObj - fabric object
|
|
* @returns {Object}
|
|
*/
|
|
|
|
}, {
|
|
key: 'makeFillPropertyForUserEvent',
|
|
value: function makeFillPropertyForUserEvent(shapeObj) {
|
|
var fillType = (0, _util.getFillTypeFromObject)(shapeObj);
|
|
var fillProp = {};
|
|
|
|
if (fillType === _consts.SHAPE_FILL_TYPE.FILTER) {
|
|
var fillImage = (0, _shapeFilterFillHelper.getFillImageFromShape)(shapeObj);
|
|
var filterOption = (0, _shapeFilterFillHelper.makeFilterOptionFromFabricImage)(fillImage);
|
|
|
|
fillProp.type = fillType;
|
|
fillProp.filter = filterOption;
|
|
} else {
|
|
fillProp.type = _consts.SHAPE_FILL_TYPE.COLOR;
|
|
fillProp.color = shapeObj.fill || 'transparent';
|
|
}
|
|
|
|
return fillProp;
|
|
}
|
|
|
|
/**
|
|
* Copy object handling.
|
|
* @param {fabric.Object} shapeObj - Shape object
|
|
* @param {fabric.Object} originalShapeObj - Shape object
|
|
*/
|
|
|
|
}, {
|
|
key: 'processForCopiedObject',
|
|
value: function processForCopiedObject(shapeObj, originalShapeObj) {
|
|
this._bindEventOnShape(shapeObj);
|
|
|
|
if ((0, _util.getFillTypeFromObject)(shapeObj) === 'filter') {
|
|
var fillImage = (0, _shapeFilterFillHelper.getFillImageFromShape)(originalShapeObj);
|
|
var filterOption = (0, _shapeFilterFillHelper.makeFilterOptionFromFabricImage)(fillImage);
|
|
var newStaticCanvas = this.graphics.createStaticCanvas();
|
|
|
|
shapeObj.set((0, _shapeFilterFillHelper.makeFillPatternForFilter)(this.graphics.canvasImage, filterOption, newStaticCanvas));
|
|
this._resetPositionFillFilter(shapeObj);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 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 _fabric2.default.Rect(options);
|
|
break;
|
|
case 'circle':
|
|
instance = new _fabric2.default.Ellipse((0, _tuiCodeSnippet.extend)({
|
|
type: 'circle'
|
|
}, options));
|
|
break;
|
|
case 'triangle':
|
|
instance = new _fabric2.default.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: '_extendOptions',
|
|
value: function _extendOptions(options) {
|
|
var selectionStyles = _consts.fObjectOptions.SELECTION_STYLE;
|
|
var _graphics2 = this.graphics,
|
|
canvasImage = _graphics2.canvasImage,
|
|
createStaticCanvas = _graphics2.createStaticCanvas;
|
|
|
|
|
|
options = (0, _tuiCodeSnippet.extend)({}, SHAPE_INIT_OPTIONS, this._options, selectionStyles, options);
|
|
|
|
return makeFabricFillOption(options, canvasImage, createStaticCanvas);
|
|
}
|
|
|
|
/**
|
|
* 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.uniformScaling = true;
|
|
canvas.defaultCursor = 'default';
|
|
_shapeResizeHelper2.default.setOrigins(self._shapeObj);
|
|
},
|
|
deselected: function deselected() {
|
|
self._isSelected = false;
|
|
self._shapeObj = null;
|
|
canvas.defaultCursor = 'crosshair';
|
|
canvas.uniformScaling = false;
|
|
},
|
|
modified: function modified() {
|
|
var currentObj = self._shapeObj;
|
|
|
|
_shapeResizeHelper2.default.adjustOriginToCenter(currentObj);
|
|
_shapeResizeHelper2.default.setOrigins(currentObj);
|
|
},
|
|
modifiedInGroup: function modifiedInGroup(activeSelection) {
|
|
self._fillFilterRePositionInGroupSelection(shapeObj, activeSelection);
|
|
},
|
|
moving: function moving() {
|
|
self._resetPositionFillFilter(this);
|
|
},
|
|
rotating: function rotating() {
|
|
self._resetPositionFillFilter(this);
|
|
},
|
|
scaling: function scaling(fEvent) {
|
|
var pointer = canvas.getPointer(fEvent.e);
|
|
var currentObj = self._shapeObj;
|
|
|
|
canvas.setCursor('crosshair');
|
|
_shapeResizeHelper2.default.resize(currentObj, pointer, true);
|
|
|
|
self._resetPositionFillFilter(this);
|
|
}
|
|
});
|
|
}
|
|
|
|
/**
|
|
* MouseDown event handler on canvas
|
|
* @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event object
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
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);
|
|
|
|
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(_consts.eventNames.ADD_OBJECT, objectProps);
|
|
});
|
|
} else {
|
|
this._shapeObj.set({
|
|
isRegular: this._withShiftKey
|
|
});
|
|
|
|
_shapeResizeHelper2.default.resize(shape, pointer);
|
|
canvas.renderAll();
|
|
|
|
this._resetPositionFillFilter(shape);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* MouseUp event handler on canvas
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onFabricMouseUp',
|
|
value: function _onFabricMouseUp() {
|
|
var _this5 = this;
|
|
|
|
var canvas = this.getCanvas();
|
|
var startPointX = this._startPoint.x;
|
|
var startPointY = this._startPoint.y;
|
|
var shape = this._shapeObj;
|
|
|
|
if (!shape) {
|
|
this.add(this._type, {
|
|
left: startPointX,
|
|
top: startPointY,
|
|
width: DEFAULT_WIDTH,
|
|
height: DEFAULT_HEIGHT
|
|
}).then(function (objectProps) {
|
|
_this5.fire(_consts.eventNames.ADD_OBJECT, objectProps);
|
|
});
|
|
} else if (shape) {
|
|
_shapeResizeHelper2.default.adjustOriginToCenter(shape);
|
|
this.fire(_consts.eventNames.OBJECT_ADDED, this.graphics.createObjectProperties(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 === _consts.keyCodes.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 === _consts.keyCodes.SHIFT) {
|
|
this._withShiftKey = false;
|
|
|
|
if (this._shapeObj) {
|
|
this._shapeObj.isRegular = false;
|
|
}
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Reset shape position and internal proportions in the filter type fill area.
|
|
* @param {fabric.Object} shapeObj - Shape object
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_resetPositionFillFilter',
|
|
value: function _resetPositionFillFilter(shapeObj) {
|
|
if ((0, _util.getFillTypeFromObject)(shapeObj) !== 'filter') {
|
|
return;
|
|
}
|
|
|
|
var _getCustomProperty = (0, _util.getCustomProperty)(shapeObj, 'patternSourceCanvas'),
|
|
patternSourceCanvas = _getCustomProperty.patternSourceCanvas;
|
|
|
|
var fillImage = (0, _shapeFilterFillHelper.getFillImageFromShape)(shapeObj);
|
|
|
|
var _getCustomProperty2 = (0, _util.getCustomProperty)(fillImage, 'originalAngle'),
|
|
originalAngle = _getCustomProperty2.originalAngle;
|
|
|
|
if (this.graphics.canvasImage.angle !== originalAngle) {
|
|
(0, _shapeFilterFillHelper.reMakePatternImageSource)(shapeObj, this.graphics.canvasImage);
|
|
}
|
|
var originX = shapeObj.originX,
|
|
originY = shapeObj.originY;
|
|
|
|
|
|
_shapeResizeHelper2.default.adjustOriginToCenter(shapeObj);
|
|
|
|
shapeObj.width *= shapeObj.scaleX;
|
|
shapeObj.height *= shapeObj.scaleY;
|
|
shapeObj.rx *= shapeObj.scaleX;
|
|
shapeObj.ry *= shapeObj.scaleY;
|
|
shapeObj.scaleX = 1;
|
|
shapeObj.scaleY = 1;
|
|
|
|
(0, _shapeFilterFillHelper.rePositionFilterTypeFillImage)(shapeObj);
|
|
|
|
(0, _util.changeOrigin)(shapeObj, {
|
|
originX: originX,
|
|
originY: originY
|
|
});
|
|
|
|
(0, _shapeFilterFillHelper.resetFillPatternCanvas)(patternSourceCanvas);
|
|
}
|
|
|
|
/**
|
|
* Reset filter area position within group selection.
|
|
* @param {fabric.Object} shapeObj - Shape object
|
|
* @param {fabric.ActiveSelection} activeSelection - Shape object
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_fillFilterRePositionInGroupSelection',
|
|
value: function _fillFilterRePositionInGroupSelection(shapeObj, activeSelection) {
|
|
if (activeSelection.scaleX !== 1 || activeSelection.scaleY !== 1) {
|
|
// This is necessary because the group's scale transition state affects the relative size of the fill area.
|
|
// The only way to reset the object transformation scale state to neutral.
|
|
// {@link https://github.com/fabricjs/fabric.js/issues/5372}
|
|
activeSelection.addWithUpdate();
|
|
}
|
|
|
|
var angle = shapeObj.angle,
|
|
left = shapeObj.left,
|
|
top = shapeObj.top;
|
|
|
|
|
|
activeSelection.realizeTransform(shapeObj);
|
|
this._resetPositionFillFilter(shapeObj);
|
|
|
|
shapeObj.set({
|
|
angle: angle,
|
|
left: left,
|
|
top: top
|
|
});
|
|
}
|
|
}]);
|
|
|
|
return Shape;
|
|
}(_component2.default);
|
|
|
|
exports.default = Shape;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/component/text.js":
|
|
/*!**********************************!*\
|
|
!*** ./src/js/component/text.js ***!
|
|
\**********************************/
|
|
/*! no static exports found */
|
|
/***/ (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__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _fabric = __webpack_require__(/*! fabric */ "fabric");
|
|
|
|
var _fabric2 = _interopRequireDefault(_fabric);
|
|
|
|
var _component = __webpack_require__(/*! @/interface/component */ "./src/js/interface/component.js");
|
|
|
|
var _component2 = _interopRequireDefault(_component);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Text module
|
|
*/
|
|
|
|
|
|
var defaultStyles = {
|
|
fill: '#000000',
|
|
left: 0,
|
|
top: 0
|
|
};
|
|
var resetStyles = {
|
|
fill: '#000000',
|
|
fontStyle: 'normal',
|
|
fontWeight: 'normal',
|
|
textAlign: 'left',
|
|
underline: false
|
|
};
|
|
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, _consts.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),
|
|
textChanged: _this._onFabricTextChanged.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 _this2 = this;
|
|
|
|
var canvas = this.getCanvas();
|
|
|
|
canvas.selection = false;
|
|
canvas.defaultCursor = 'text';
|
|
canvas.on({
|
|
'mouse:down': this._listeners.mousedown,
|
|
'selection:created': this._listeners.select,
|
|
'selection:updated': this._listeners.select,
|
|
'before:selection:cleared': this._listeners.selectClear,
|
|
'object:scaling': this._listeners.scaling,
|
|
'text:changed': this._listeners.textChanged
|
|
});
|
|
|
|
canvas.forEachObject(function (obj) {
|
|
if (obj.type === 'i-text') {
|
|
_this2.adjustOriginPosition(obj, 'start');
|
|
}
|
|
});
|
|
|
|
this.setCanvasRatio();
|
|
}
|
|
|
|
/**
|
|
* End input text mode
|
|
*/
|
|
|
|
}, {
|
|
key: 'end',
|
|
value: function end() {
|
|
var _this3 = this;
|
|
|
|
var canvas = this.getCanvas();
|
|
|
|
canvas.selection = true;
|
|
canvas.defaultCursor = 'default';
|
|
|
|
canvas.forEachObject(function (obj) {
|
|
if (obj.type === 'i-text') {
|
|
if (obj.text === '') {
|
|
canvas.remove(obj);
|
|
} else {
|
|
_this3.adjustOriginPosition(obj, 'end');
|
|
}
|
|
}
|
|
});
|
|
|
|
canvas.off({
|
|
'mouse:down': this._listeners.mousedown,
|
|
'selection:created': this._listeners.select,
|
|
'selection:updated': this._listeners.select,
|
|
'before:selection:cleared': this._listeners.selectClear,
|
|
'object:selected': this._listeners.select,
|
|
'object:scaling': this._listeners.scaling,
|
|
'text:changed': this._listeners.textChanged
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Adjust the origin position
|
|
* @param {fabric.Object} text - text object
|
|
* @param {string} editStatus - 'start' or 'end'
|
|
*/
|
|
|
|
}, {
|
|
key: 'adjustOriginPosition',
|
|
value: function adjustOriginPosition(text, editStatus) {
|
|
var originX = 'center',
|
|
originY = 'center';
|
|
|
|
if (editStatus === 'start') {
|
|
originX = 'left';
|
|
originY = 'top';
|
|
}
|
|
|
|
var _text$getPointByOrigi = text.getPointByOrigin(originX, originY),
|
|
left = _text$getPointByOrigi.x,
|
|
top = _text$getPointByOrigi.y;
|
|
|
|
text.set({
|
|
left: left,
|
|
top: top,
|
|
originX: originX,
|
|
originY: originY
|
|
});
|
|
text.setCoords();
|
|
}
|
|
|
|
/**
|
|
* 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.textDecoration] Type of line (underline / line-through / overline)
|
|
* @param {{x: number, y: number}} [options.position] - Initial position
|
|
* @returns {Promise}
|
|
*/
|
|
|
|
}, {
|
|
key: 'add',
|
|
value: function add(text, options) {
|
|
var _this4 = this;
|
|
|
|
return new _util.Promise(function (resolve) {
|
|
var canvas = _this4.getCanvas();
|
|
var newText = null;
|
|
var selectionStyle = _consts.fObjectOptions.SELECTION_STYLE;
|
|
var styles = _this4._defaultStyles;
|
|
|
|
_this4._setInitPos(options.position);
|
|
|
|
if (options.styles) {
|
|
styles = _tuiCodeSnippet2.default.extend(styles, options.styles);
|
|
}
|
|
|
|
if (!_tuiCodeSnippet2.default.isExisty(options.autofocus)) {
|
|
options.autofocus = true;
|
|
}
|
|
|
|
newText = new _fabric2.default.IText(text, styles);
|
|
selectionStyle = _tuiCodeSnippet2.default.extend({}, selectionStyle, {
|
|
originX: 'left',
|
|
originY: 'top'
|
|
});
|
|
|
|
newText.set(selectionStyle);
|
|
newText.on({
|
|
mouseup: _this4._onFabricMouseUp.bind(_this4)
|
|
});
|
|
|
|
canvas.add(newText);
|
|
|
|
if (options.autofocus) {
|
|
newText.enterEditing();
|
|
newText.selectAll();
|
|
}
|
|
|
|
if (!canvas.getActiveObject()) {
|
|
canvas.setActiveObject(newText);
|
|
}
|
|
|
|
_this4.isPrevEditing = true;
|
|
resolve(_this4.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 _this5 = this;
|
|
|
|
return new _util.Promise(function (resolve) {
|
|
activeObj.set('text', text);
|
|
|
|
_this5.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.textDecoration] Type of line (underline / line-through / overline)
|
|
* @returns {Promise}
|
|
*/
|
|
|
|
}, {
|
|
key: 'setStyle',
|
|
value: function setStyle(activeObj, styleObj) {
|
|
var _this6 = this;
|
|
|
|
return new _util.Promise(function (resolve) {
|
|
_tuiCodeSnippet2.default.forEach(styleObj, function (val, key) {
|
|
if (activeObj[key] === val && key !== 'fontSize') {
|
|
styleObj[key] = resetStyles[key] || '';
|
|
}
|
|
}, _this6);
|
|
|
|
if ('textDecoration' in styleObj) {
|
|
_tuiCodeSnippet2.default.extend(styleObj, _this6._getTextDecorationAdaptObject(styleObj.textDecoration));
|
|
}
|
|
|
|
activeObj.set(styleObj);
|
|
|
|
_this6.getCanvas().renderAll();
|
|
resolve();
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Get the text
|
|
* @param {Object} activeObj - Current selected text object
|
|
* @returns {String} text
|
|
*/
|
|
|
|
}, {
|
|
key: 'getText',
|
|
value: function getText(activeObj) {
|
|
return activeObj.text;
|
|
}
|
|
|
|
/**
|
|
* 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;
|
|
|
|
this._ratio = originWidth / cssWidth;
|
|
}
|
|
|
|
/**
|
|
* Get ratio value of canvas
|
|
* @returns {number} Ratio value
|
|
*/
|
|
|
|
}, {
|
|
key: 'getCanvasRatio',
|
|
value: function getCanvasRatio() {
|
|
return this._ratio;
|
|
}
|
|
|
|
/**
|
|
* Get text decoration adapt object
|
|
* @param {string} textDecoration - text decoration option string
|
|
* @returns {object} adapt object for override
|
|
*/
|
|
|
|
}, {
|
|
key: '_getTextDecorationAdaptObject',
|
|
value: function _getTextDecorationAdaptObject(textDecoration) {
|
|
return {
|
|
underline: textDecoration === 'underline',
|
|
linethrough: textDecoration === 'line-through',
|
|
overline: textDecoration === 'overline'
|
|
};
|
|
}
|
|
|
|
/**
|
|
* 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;
|
|
}
|
|
|
|
/**
|
|
* 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.width / ratio) + 'px';
|
|
textareaStyle.height = Math.ceil(obj.height / ratio) + 'px';
|
|
}
|
|
|
|
/**
|
|
* Keydown event handler
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onKeyDown',
|
|
value: function _onKeyDown() {
|
|
var _this7 = this;
|
|
|
|
var ratio = this.getCanvasRatio();
|
|
var obj = this._editingObj;
|
|
var textareaStyle = this._textarea.style;
|
|
|
|
setTimeout(function () {
|
|
obj.text(_this7._textarea.value);
|
|
|
|
textareaStyle.width = Math.ceil(obj.width / ratio) + 'px';
|
|
textareaStyle.height = Math.ceil(obj.height / 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.width / ratio - editingObjInfos.width / ratio;
|
|
var transHeight = editingObj.height / 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(_consts.eventNames.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;
|
|
|
|
obj.fontSize = obj.fontSize * obj.scaleY;
|
|
obj.scaleX = 1;
|
|
obj.scaleY = 1;
|
|
}
|
|
|
|
/**
|
|
* textChanged event handler
|
|
* @param {{target: fabric.Object}} props - changed text object
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onFabricTextChanged',
|
|
value: function _onFabricTextChanged(props) {
|
|
this.fire(_consts.eventNames.TEXT_CHANGED, props.target);
|
|
}
|
|
|
|
/**
|
|
* 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 === '') {
|
|
this.getCanvas().remove(obj);
|
|
}
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 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(_consts.eventNames.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 target = fEvent.target;
|
|
|
|
var newClickTime = new Date().getTime();
|
|
|
|
if (this._isDoubleClick(newClickTime) && !target.isEditing) {
|
|
target.enterEditing();
|
|
}
|
|
|
|
if (target.isEditing) {
|
|
this.fire(_consts.eventNames.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;
|
|
}
|
|
}]);
|
|
|
|
return Text;
|
|
}(_component2.default);
|
|
|
|
exports.default = Text;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/component/zoom.js":
|
|
/*!**********************************!*\
|
|
!*** ./src/js/component/zoom.js ***!
|
|
\**********************************/
|
|
/*! no static exports found */
|
|
/***/ (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 _fabric = __webpack_require__(/*! fabric */ "fabric");
|
|
|
|
var _fabric2 = _interopRequireDefault(_fabric);
|
|
|
|
var _component = __webpack_require__(/*! @/interface/component */ "./src/js/interface/component.js");
|
|
|
|
var _component2 = _interopRequireDefault(_component);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Image zoom module (start zoom, end zoom)
|
|
*/
|
|
|
|
|
|
var MOUSE_MOVE_THRESHOLD = 10;
|
|
var DEFAULT_SCROLL_OPTION = {
|
|
left: 0,
|
|
top: 0,
|
|
width: 0,
|
|
height: 0,
|
|
stroke: '#000000',
|
|
strokeWidth: 0,
|
|
fill: '#000000',
|
|
opacity: 0.4,
|
|
evented: false,
|
|
selectable: false,
|
|
hoverCursor: 'auto'
|
|
};
|
|
var DEFAULT_VERTICAL_SCROLL_RATIO = {
|
|
SIZE: 0.0045,
|
|
MARGIN: 0.003,
|
|
BORDER_RADIUS: 0.003
|
|
};
|
|
var DEFAULT_HORIZONTAL_SCROLL_RATIO = {
|
|
SIZE: 0.0066,
|
|
MARGIN: 0.0044,
|
|
BORDER_RADIUS: 0.003
|
|
};
|
|
var DEFAULT_ZOOM_LEVEL = 1.0;
|
|
var ZOOM_CHANGED = _consts.eventNames.ZOOM_CHANGED,
|
|
ADD_TEXT = _consts.eventNames.ADD_TEXT,
|
|
TEXT_EDITING = _consts.eventNames.TEXT_EDITING,
|
|
OBJECT_MODIFIED = _consts.eventNames.OBJECT_MODIFIED,
|
|
KEY_DOWN = _consts.eventNames.KEY_DOWN,
|
|
KEY_UP = _consts.eventNames.KEY_UP,
|
|
HAND_STARTED = _consts.eventNames.HAND_STARTED,
|
|
HAND_STOPPED = _consts.eventNames.HAND_STOPPED;
|
|
|
|
/**
|
|
* Zoom components
|
|
* @param {Graphics} graphics - Graphics instance
|
|
* @extends {Component}
|
|
* @class Zoom
|
|
* @ignore
|
|
*/
|
|
|
|
var Zoom = function (_Component) {
|
|
_inherits(Zoom, _Component);
|
|
|
|
function Zoom(graphics) {
|
|
_classCallCheck(this, Zoom);
|
|
|
|
/**
|
|
* zoomArea
|
|
* @type {?fabric.Rect}
|
|
* @private
|
|
*/
|
|
var _this = _possibleConstructorReturn(this, (Zoom.__proto__ || Object.getPrototypeOf(Zoom)).call(this, _consts.componentNames.ZOOM, graphics));
|
|
|
|
_this.zoomArea = null;
|
|
|
|
/**
|
|
* Start point of zoom area
|
|
* @type {?{x: number, y: number}}
|
|
*/
|
|
_this._startPoint = null;
|
|
|
|
/**
|
|
* Center point of every zoom
|
|
* @type {Array.<{prevZoomLevel: number, zoomLevel: number, x: number, y: number}>}
|
|
*/
|
|
_this._centerPoints = [];
|
|
|
|
/**
|
|
* Zoom level (default: 100%(1.0), max: 400%(4.0))
|
|
* @type {number}
|
|
*/
|
|
_this.zoomLevel = DEFAULT_ZOOM_LEVEL;
|
|
|
|
/**
|
|
* Zoom mode ('normal', 'zoom', 'hand')
|
|
* @type {string}
|
|
*/
|
|
_this.zoomMode = _consts.zoomModes.DEFAULT;
|
|
|
|
/**
|
|
* Listeners
|
|
* @type {Object.<string, Function>}
|
|
* @private
|
|
*/
|
|
_this._listeners = {
|
|
startZoom: _this._onMouseDownWithZoomMode.bind(_this),
|
|
moveZoom: _this._onMouseMoveWithZoomMode.bind(_this),
|
|
stopZoom: _this._onMouseUpWithZoomMode.bind(_this),
|
|
startHand: _this._onMouseDownWithHandMode.bind(_this),
|
|
moveHand: _this._onMouseMoveWithHandMode.bind(_this),
|
|
stopHand: _this._onMouseUpWithHandMode.bind(_this),
|
|
zoomChanged: _this._changeScrollState.bind(_this),
|
|
keydown: _this._startHandModeWithSpaceBar.bind(_this),
|
|
keyup: _this._endHandModeWithSpaceBar.bind(_this)
|
|
};
|
|
|
|
var canvas = _this.getCanvas();
|
|
|
|
/**
|
|
* Width:Height ratio (ex. width=1.5, height=1 -> aspectRatio=1.5)
|
|
* @private
|
|
*/
|
|
_this.aspectRatio = canvas.width / canvas.height;
|
|
|
|
/**
|
|
* vertical scroll bar
|
|
* @type {fabric.Rect}
|
|
* @private
|
|
*/
|
|
_this._verticalScroll = new _fabric2.default.Rect(DEFAULT_SCROLL_OPTION);
|
|
|
|
/**
|
|
* horizontal scroll bar
|
|
* @type {fabric.Rect}
|
|
* @private
|
|
*/
|
|
_this._horizontalScroll = new _fabric2.default.Rect(DEFAULT_SCROLL_OPTION);
|
|
|
|
canvas.on(ZOOM_CHANGED, _this._listeners.zoomChanged);
|
|
|
|
_this.graphics.on(ADD_TEXT, _this._startTextEditingHandler.bind(_this));
|
|
_this.graphics.on(TEXT_EDITING, _this._startTextEditingHandler.bind(_this));
|
|
_this.graphics.on(OBJECT_MODIFIED, _this._stopTextEditingHandler.bind(_this));
|
|
return _this;
|
|
}
|
|
|
|
/**
|
|
* Attach zoom keyboard events
|
|
*/
|
|
|
|
|
|
_createClass(Zoom, [{
|
|
key: 'attachKeyboardZoomEvents',
|
|
value: function attachKeyboardZoomEvents() {
|
|
_fabric2.default.util.addListener(document, KEY_DOWN, this._listeners.keydown);
|
|
_fabric2.default.util.addListener(document, KEY_UP, this._listeners.keyup);
|
|
}
|
|
|
|
/**
|
|
* Detach zoom keyboard events
|
|
*/
|
|
|
|
}, {
|
|
key: 'detachKeyboardZoomEvents',
|
|
value: function detachKeyboardZoomEvents() {
|
|
_fabric2.default.util.removeListener(document, KEY_DOWN, this._listeners.keydown);
|
|
_fabric2.default.util.removeListener(document, KEY_UP, this._listeners.keyup);
|
|
}
|
|
|
|
/**
|
|
* Handler when you started editing text
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_startTextEditingHandler',
|
|
value: function _startTextEditingHandler() {
|
|
this.isTextEditing = true;
|
|
}
|
|
|
|
/**
|
|
* Handler when you stopped editing text
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_stopTextEditingHandler',
|
|
value: function _stopTextEditingHandler() {
|
|
this.isTextEditing = false;
|
|
}
|
|
|
|
/**
|
|
* Handler who turns on hand mode when the space bar is down
|
|
* @param {KeyboardEvent} e - Event object
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_startHandModeWithSpaceBar',
|
|
value: function _startHandModeWithSpaceBar(e) {
|
|
if (this.withSpace || this.isTextEditing) {
|
|
return;
|
|
}
|
|
|
|
if (e.keyCode === _consts.keyCodes.SPACE) {
|
|
this.withSpace = true;
|
|
this.startHandMode();
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Handler who turns off hand mode when space bar is up
|
|
* @param {KeyboardEvent} e - Event object
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_endHandModeWithSpaceBar',
|
|
value: function _endHandModeWithSpaceBar(e) {
|
|
if (e.keyCode === _consts.keyCodes.SPACE) {
|
|
this.withSpace = false;
|
|
this.endHandMode();
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Start zoom-in mode
|
|
*/
|
|
|
|
}, {
|
|
key: 'startZoomInMode',
|
|
value: function startZoomInMode() {
|
|
if (this.zoomArea) {
|
|
return;
|
|
}
|
|
this.endHandMode();
|
|
this.zoomMode = _consts.zoomModes.ZOOM;
|
|
|
|
var canvas = this.getCanvas();
|
|
|
|
this._changeObjectsEventedState(false);
|
|
|
|
this.zoomArea = new _fabric2.default.Rect({
|
|
left: 0,
|
|
top: 0,
|
|
width: 0.5,
|
|
height: 0.5,
|
|
stroke: 'black',
|
|
strokeWidth: 1,
|
|
fill: 'transparent',
|
|
hoverCursor: 'zoom-in'
|
|
});
|
|
|
|
canvas.discardActiveObject();
|
|
canvas.add(this.zoomArea);
|
|
canvas.on('mouse:down', this._listeners.startZoom);
|
|
canvas.selection = false;
|
|
canvas.defaultCursor = 'zoom-in';
|
|
}
|
|
|
|
/**
|
|
* End zoom-in mode
|
|
*/
|
|
|
|
}, {
|
|
key: 'endZoomInMode',
|
|
value: function endZoomInMode() {
|
|
this.zoomMode = _consts.zoomModes.DEFAULT;
|
|
|
|
var canvas = this.getCanvas();
|
|
var _listeners = this._listeners,
|
|
startZoom = _listeners.startZoom,
|
|
moveZoom = _listeners.moveZoom,
|
|
stopZoom = _listeners.stopZoom;
|
|
|
|
|
|
canvas.selection = true;
|
|
canvas.defaultCursor = 'auto';
|
|
canvas.off({
|
|
'mouse:down': startZoom,
|
|
'mouse:move': moveZoom,
|
|
'mouse:up': stopZoom
|
|
});
|
|
|
|
this._changeObjectsEventedState(true);
|
|
|
|
canvas.remove(this.zoomArea);
|
|
this.zoomArea = null;
|
|
}
|
|
|
|
/**
|
|
* Start zoom drawing mode
|
|
*/
|
|
|
|
}, {
|
|
key: 'start',
|
|
value: function start() {
|
|
this.zoomArea = null;
|
|
this._startPoint = null;
|
|
this._startHandPoint = null;
|
|
}
|
|
|
|
/**
|
|
* Stop zoom drawing mode
|
|
*/
|
|
|
|
}, {
|
|
key: 'end',
|
|
value: function end() {
|
|
this.endZoomInMode();
|
|
this.endHandMode();
|
|
}
|
|
|
|
/**
|
|
* Start hand mode
|
|
*/
|
|
|
|
}, {
|
|
key: 'startHandMode',
|
|
value: function startHandMode() {
|
|
this.endZoomInMode();
|
|
this.zoomMode = _consts.zoomModes.HAND;
|
|
|
|
var canvas = this.getCanvas();
|
|
|
|
this._changeObjectsEventedState(false);
|
|
|
|
canvas.discardActiveObject();
|
|
canvas.off('mouse:down', this._listeners.startHand);
|
|
canvas.on('mouse:down', this._listeners.startHand);
|
|
canvas.selection = false;
|
|
canvas.defaultCursor = 'grab';
|
|
|
|
canvas.fire(HAND_STARTED);
|
|
}
|
|
|
|
/**
|
|
* Stop hand mode
|
|
*/
|
|
|
|
}, {
|
|
key: 'endHandMode',
|
|
value: function endHandMode() {
|
|
this.zoomMode = _consts.zoomModes.DEFAULT;
|
|
var canvas = this.getCanvas();
|
|
|
|
this._changeObjectsEventedState(true);
|
|
|
|
canvas.off('mouse:down', this._listeners.startHand);
|
|
canvas.selection = true;
|
|
canvas.defaultCursor = 'auto';
|
|
|
|
this._startHandPoint = null;
|
|
|
|
canvas.fire(HAND_STOPPED);
|
|
}
|
|
|
|
/**
|
|
* onMousedown handler in fabric canvas
|
|
* @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onMouseDownWithZoomMode',
|
|
value: function _onMouseDownWithZoomMode(_ref) {
|
|
var target = _ref.target,
|
|
e = _ref.e;
|
|
|
|
if (target) {
|
|
return;
|
|
}
|
|
|
|
var canvas = this.getCanvas();
|
|
|
|
canvas.selection = false;
|
|
|
|
this._startPoint = canvas.getPointer(e);
|
|
this.zoomArea.set({ width: 0, height: 0 });
|
|
|
|
var _listeners2 = this._listeners,
|
|
moveZoom = _listeners2.moveZoom,
|
|
stopZoom = _listeners2.stopZoom;
|
|
|
|
canvas.on({
|
|
'mouse:move': moveZoom,
|
|
'mouse:up': stopZoom
|
|
});
|
|
}
|
|
|
|
/**
|
|
* onMousemove handler in fabric canvas
|
|
* @param {{e: MouseEvent}} fEvent - Fabric event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onMouseMoveWithZoomMode',
|
|
value: function _onMouseMoveWithZoomMode(_ref2) {
|
|
var e = _ref2.e;
|
|
|
|
var canvas = this.getCanvas();
|
|
var pointer = canvas.getPointer(e);
|
|
var x = pointer.x,
|
|
y = pointer.y;
|
|
var zoomArea = this.zoomArea,
|
|
_startPoint = this._startPoint;
|
|
|
|
var deltaX = Math.abs(x - _startPoint.x);
|
|
var deltaY = Math.abs(y - _startPoint.y);
|
|
|
|
if (deltaX + deltaY > MOUSE_MOVE_THRESHOLD) {
|
|
canvas.remove(zoomArea);
|
|
zoomArea.set(this._calcRectDimensionFromPoint(x, y));
|
|
canvas.add(zoomArea);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 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 _startPoint2 = this._startPoint,
|
|
startX = _startPoint2.x,
|
|
startY = _startPoint2.y;
|
|
var min = Math.min;
|
|
|
|
|
|
var left = min(startX, x);
|
|
var top = min(startY, y);
|
|
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
|
|
|
|
return { left: left, top: top, width: width, height: height };
|
|
}
|
|
|
|
/**
|
|
* onMouseup handler in fabric canvas
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onMouseUpWithZoomMode',
|
|
value: function _onMouseUpWithZoomMode() {
|
|
var zoomLevel = this.zoomLevel;
|
|
var zoomArea = this.zoomArea;
|
|
var _listeners3 = this._listeners,
|
|
moveZoom = _listeners3.moveZoom,
|
|
stopZoom = _listeners3.stopZoom;
|
|
|
|
var canvas = this.getCanvas();
|
|
var center = this._getCenterPoint();
|
|
var x = center.x,
|
|
y = center.y;
|
|
|
|
|
|
if (!this._isMaxZoomLevel()) {
|
|
this._centerPoints.push({
|
|
x: x,
|
|
y: y,
|
|
prevZoomLevel: zoomLevel,
|
|
zoomLevel: zoomLevel + 1
|
|
});
|
|
zoomLevel += 1;
|
|
canvas.zoomToPoint({ x: x, y: y }, zoomLevel);
|
|
|
|
this._fireZoomChanged(canvas, zoomLevel);
|
|
|
|
this.zoomLevel = zoomLevel;
|
|
}
|
|
|
|
canvas.off({
|
|
'mouse:move': moveZoom,
|
|
'mouse:up': stopZoom
|
|
});
|
|
|
|
canvas.remove(zoomArea);
|
|
this._startPoint = null;
|
|
}
|
|
|
|
/**
|
|
* Get center point
|
|
* @returns {{x: number, y: number}}
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_getCenterPoint',
|
|
value: function _getCenterPoint() {
|
|
var _zoomArea = this.zoomArea,
|
|
left = _zoomArea.left,
|
|
top = _zoomArea.top,
|
|
width = _zoomArea.width,
|
|
height = _zoomArea.height;
|
|
var _startPoint3 = this._startPoint,
|
|
x = _startPoint3.x,
|
|
y = _startPoint3.y;
|
|
var aspectRatio = this.aspectRatio;
|
|
|
|
|
|
if (width < MOUSE_MOVE_THRESHOLD && height < MOUSE_MOVE_THRESHOLD) {
|
|
return { x: x, y: y };
|
|
}
|
|
|
|
return width > height ? { x: left + aspectRatio * height / 2, y: top + height / 2 } : { x: left + width / 2, y: top + width / aspectRatio / 2 };
|
|
}
|
|
|
|
/**
|
|
* Zoom the canvas
|
|
* @param {{x: number, y: number}} center - center of zoom
|
|
* @param {?number} zoomLevel - zoom level
|
|
*/
|
|
|
|
}, {
|
|
key: 'zoom',
|
|
value: function zoom(_ref3) {
|
|
var x = _ref3.x,
|
|
y = _ref3.y;
|
|
var zoomLevel = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.zoomLevel;
|
|
|
|
var canvas = this.getCanvas();
|
|
var centerPoints = this._centerPoints;
|
|
|
|
for (var i = centerPoints.length - 1; i >= 0; i -= 1) {
|
|
if (centerPoints[i].zoomLevel < zoomLevel) {
|
|
break;
|
|
}
|
|
|
|
var _centerPoints$pop = centerPoints.pop(),
|
|
prevX = _centerPoints$pop.x,
|
|
prevY = _centerPoints$pop.y,
|
|
prevZoomLevel = _centerPoints$pop.prevZoomLevel;
|
|
|
|
canvas.zoomToPoint({ x: prevX, y: prevY }, prevZoomLevel);
|
|
this.zoomLevel = prevZoomLevel;
|
|
}
|
|
|
|
canvas.zoomToPoint({ x: x, y: y }, zoomLevel);
|
|
if (!this._isDefaultZoomLevel(zoomLevel)) {
|
|
this._centerPoints.push({
|
|
x: x,
|
|
y: y,
|
|
zoomLevel: zoomLevel,
|
|
prevZoomLevel: this.zoomLevel
|
|
});
|
|
}
|
|
this.zoomLevel = zoomLevel;
|
|
|
|
this._fireZoomChanged(canvas, zoomLevel);
|
|
}
|
|
|
|
/**
|
|
* Zoom out one step
|
|
*/
|
|
|
|
}, {
|
|
key: 'zoomOut',
|
|
value: function zoomOut() {
|
|
var centerPoints = this._centerPoints;
|
|
|
|
if (!centerPoints.length) {
|
|
return;
|
|
}
|
|
|
|
var canvas = this.getCanvas();
|
|
var point = centerPoints.pop();
|
|
var x = point.x,
|
|
y = point.y,
|
|
prevZoomLevel = point.prevZoomLevel;
|
|
|
|
|
|
if (this._isDefaultZoomLevel(prevZoomLevel)) {
|
|
canvas.setViewportTransform([1, 0, 0, 1, 0, 0]);
|
|
} else {
|
|
canvas.zoomToPoint({ x: x, y: y }, prevZoomLevel);
|
|
}
|
|
|
|
this.zoomLevel = prevZoomLevel;
|
|
|
|
this._fireZoomChanged(canvas, this.zoomLevel);
|
|
}
|
|
|
|
/**
|
|
* Zoom reset
|
|
*/
|
|
|
|
}, {
|
|
key: 'resetZoom',
|
|
value: function resetZoom() {
|
|
var canvas = this.getCanvas();
|
|
|
|
canvas.setViewportTransform([1, 0, 0, 1, 0, 0]);
|
|
|
|
this.zoomLevel = DEFAULT_ZOOM_LEVEL;
|
|
this._centerPoints = [];
|
|
|
|
this._fireZoomChanged(canvas, this.zoomLevel);
|
|
}
|
|
|
|
/**
|
|
* Whether zoom level is max (5.0)
|
|
* @returns {boolean}
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_isMaxZoomLevel',
|
|
value: function _isMaxZoomLevel() {
|
|
return this.zoomLevel >= 5.0;
|
|
}
|
|
|
|
/**
|
|
* Move point of zoom
|
|
* @param {{x: number, y: number}} delta - move amount
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_movePointOfZoom',
|
|
value: function _movePointOfZoom(_ref4) {
|
|
var deltaX = _ref4.x,
|
|
deltaY = _ref4.y;
|
|
|
|
var centerPoints = this._centerPoints;
|
|
|
|
if (!centerPoints.length) {
|
|
return;
|
|
}
|
|
|
|
var canvas = this.getCanvas();
|
|
var zoomLevel = this.zoomLevel;
|
|
|
|
|
|
var point = centerPoints.pop();
|
|
var originX = point.x,
|
|
originY = point.y,
|
|
prevZoomLevel = point.prevZoomLevel;
|
|
|
|
var x = originX - deltaX;
|
|
var y = originY - deltaY;
|
|
|
|
canvas.zoomToPoint({ x: originX, y: originY }, prevZoomLevel);
|
|
canvas.zoomToPoint({ x: x, y: y }, zoomLevel);
|
|
centerPoints.push({ x: x, y: y, prevZoomLevel: prevZoomLevel, zoomLevel: zoomLevel });
|
|
|
|
this._fireZoomChanged(canvas, zoomLevel);
|
|
}
|
|
|
|
/**
|
|
* onMouseDown handler in fabric canvas
|
|
* @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onMouseDownWithHandMode',
|
|
value: function _onMouseDownWithHandMode(_ref5) {
|
|
var target = _ref5.target,
|
|
e = _ref5.e;
|
|
|
|
if (target) {
|
|
return;
|
|
}
|
|
|
|
var canvas = this.getCanvas();
|
|
|
|
if (this.zoomLevel <= DEFAULT_ZOOM_LEVEL) {
|
|
return;
|
|
}
|
|
|
|
canvas.selection = false;
|
|
|
|
this._startHandPoint = canvas.getPointer(e);
|
|
|
|
var _listeners4 = this._listeners,
|
|
moveHand = _listeners4.moveHand,
|
|
stopHand = _listeners4.stopHand;
|
|
|
|
canvas.on({
|
|
'mouse:move': moveHand,
|
|
'mouse:up': stopHand
|
|
});
|
|
}
|
|
|
|
/**
|
|
* onMouseMove handler in fabric canvas
|
|
* @param {{e: MouseEvent}} fEvent - Fabric event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onMouseMoveWithHandMode',
|
|
value: function _onMouseMoveWithHandMode(_ref6) {
|
|
var e = _ref6.e;
|
|
|
|
var canvas = this.getCanvas();
|
|
|
|
var _canvas$getPointer = canvas.getPointer(e),
|
|
x = _canvas$getPointer.x,
|
|
y = _canvas$getPointer.y;
|
|
|
|
var deltaX = x - this._startHandPoint.x;
|
|
var deltaY = y - this._startHandPoint.y;
|
|
|
|
this._movePointOfZoom({ x: deltaX, y: deltaY });
|
|
}
|
|
|
|
/**
|
|
* onMouseUp handler in fabric canvas
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onMouseUpWithHandMode',
|
|
value: function _onMouseUpWithHandMode() {
|
|
var canvas = this.getCanvas();
|
|
var _listeners5 = this._listeners,
|
|
moveHand = _listeners5.moveHand,
|
|
stopHand = _listeners5.stopHand;
|
|
|
|
|
|
canvas.off({
|
|
'mouse:move': moveHand,
|
|
'mouse:up': stopHand
|
|
});
|
|
|
|
this._startHandPoint = null;
|
|
}
|
|
|
|
/**
|
|
* onChangeZoom handler in fabric canvas
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_changeScrollState',
|
|
value: function _changeScrollState(_ref7) {
|
|
var viewport = _ref7.viewport,
|
|
zoomLevel = _ref7.zoomLevel;
|
|
|
|
var canvas = this.getCanvas();
|
|
|
|
canvas.remove(this._verticalScroll);
|
|
canvas.remove(this._horizontalScroll);
|
|
|
|
if (this._isDefaultZoomLevel(zoomLevel)) {
|
|
return;
|
|
}
|
|
|
|
var canvasWidth = canvas.width;
|
|
var canvasHeight = canvas.height;
|
|
|
|
var tl = viewport.tl,
|
|
tr = viewport.tr,
|
|
bl = viewport.bl;
|
|
|
|
var viewportWidth = tr.x - tl.x;
|
|
var viewportHeight = bl.y - tl.y;
|
|
|
|
var horizontalScrollWidth = viewportWidth * viewportWidth / canvasWidth;
|
|
var horizontalScrollHeight = viewportHeight * DEFAULT_HORIZONTAL_SCROLL_RATIO.SIZE;
|
|
var horizontalScrollLeft = (0, _util.clamp)(tl.x + tl.x / canvasWidth * viewportWidth, tl.x, tr.x - horizontalScrollWidth);
|
|
var horizontalScrollMargin = viewportHeight * DEFAULT_HORIZONTAL_SCROLL_RATIO.MARGIN;
|
|
var horizontalScrollBorderRadius = viewportHeight * DEFAULT_HORIZONTAL_SCROLL_RATIO.BORDER_RADIUS;
|
|
|
|
this._horizontalScroll.set({
|
|
left: horizontalScrollLeft,
|
|
top: bl.y - horizontalScrollHeight - horizontalScrollMargin,
|
|
width: horizontalScrollWidth,
|
|
height: horizontalScrollHeight,
|
|
rx: horizontalScrollBorderRadius,
|
|
ry: horizontalScrollBorderRadius
|
|
});
|
|
|
|
var verticalScrollWidth = viewportWidth * DEFAULT_VERTICAL_SCROLL_RATIO.SIZE;
|
|
var verticalScrollHeight = viewportHeight * viewportHeight / canvasHeight;
|
|
var verticalScrollTop = (0, _util.clamp)(tl.y + tl.y / canvasHeight * viewportHeight, tr.y, bl.y - verticalScrollHeight);
|
|
var verticalScrollMargin = viewportWidth * DEFAULT_VERTICAL_SCROLL_RATIO.MARGIN;
|
|
var verticalScrollBorderRadius = viewportWidth * DEFAULT_VERTICAL_SCROLL_RATIO.BORDER_RADIUS;
|
|
|
|
this._verticalScroll.set({
|
|
left: tr.x - verticalScrollWidth - verticalScrollMargin,
|
|
top: verticalScrollTop,
|
|
width: verticalScrollWidth,
|
|
height: verticalScrollHeight,
|
|
rx: verticalScrollBorderRadius,
|
|
ry: verticalScrollBorderRadius
|
|
});
|
|
|
|
this._addScrollBar();
|
|
}
|
|
|
|
/**
|
|
* Change objects 'evented' state
|
|
* @param {boolean} [evented=true] - objects 'evented' state
|
|
*/
|
|
|
|
}, {
|
|
key: '_changeObjectsEventedState',
|
|
value: function _changeObjectsEventedState() {
|
|
var evented = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
|
|
|
|
var canvas = this.getCanvas();
|
|
|
|
canvas.forEachObject(function (obj) {
|
|
// {@link http://fabricjs.com/docs/fabric.Object.html#evented}
|
|
obj.evented = evented;
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Add scroll bar and set remove timer
|
|
*/
|
|
|
|
}, {
|
|
key: '_addScrollBar',
|
|
value: function _addScrollBar() {
|
|
var _this2 = this;
|
|
|
|
var canvas = this.getCanvas();
|
|
|
|
canvas.add(this._horizontalScroll);
|
|
canvas.add(this._verticalScroll);
|
|
|
|
if (this.scrollBarTid) {
|
|
clearTimeout(this.scrollBarTid);
|
|
}
|
|
|
|
this.scrollBarTid = setTimeout(function () {
|
|
canvas.remove(_this2._horizontalScroll);
|
|
canvas.remove(_this2._verticalScroll);
|
|
}, 3000);
|
|
}
|
|
|
|
/**
|
|
* Check zoom level is default zoom level (1.0)
|
|
* @param {number} zoomLevel - zoom level
|
|
* @returns {boolean} - whether zoom level is 1.0
|
|
*/
|
|
|
|
}, {
|
|
key: '_isDefaultZoomLevel',
|
|
value: function _isDefaultZoomLevel(zoomLevel) {
|
|
return zoomLevel === DEFAULT_ZOOM_LEVEL;
|
|
}
|
|
|
|
/**
|
|
* Fire 'zoomChanged' event
|
|
* @param {fabric.Canvas} canvas - fabric canvas
|
|
* @param {number} zoomLevel - 'zoomChanged' event params
|
|
*/
|
|
|
|
}, {
|
|
key: '_fireZoomChanged',
|
|
value: function _fireZoomChanged(canvas, zoomLevel) {
|
|
canvas.fire(ZOOM_CHANGED, { viewport: canvas.calcViewportBoundaries(), zoomLevel: zoomLevel });
|
|
}
|
|
|
|
/**
|
|
* Get zoom mode
|
|
*/
|
|
|
|
}, {
|
|
key: 'mode',
|
|
get: function get() {
|
|
return this.zoomMode;
|
|
}
|
|
}]);
|
|
|
|
return Zoom;
|
|
}(_component2.default);
|
|
|
|
exports.default = Zoom;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/consts.js":
|
|
/*!**************************!*\
|
|
!*** ./src/js/consts.js ***!
|
|
\**************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
exports.emptyCropRectValues = exports.defaultFilterRangeValues = exports.defaultTextRangeValues = exports.defaultShapeStrokeValues = exports.defaultDrawRangeValues = exports.defaultRotateRangeValues = exports.defaultIconPath = exports.rejectMessages = exports.fObjectOptions = exports.keyCodes = exports.zoomModes = exports.drawingMenuNames = exports.drawingModes = exports.historyNames = exports.eventNames = exports.commandNames = exports.CROPZONE_DEFAULT_OPTIONS = exports.SHAPE_DEFAULT_OPTIONS = exports.componentNames = exports.filterType = exports.OBJ_TYPE = exports.SHAPE_TYPE = exports.SHAPE_FILL_TYPE = exports.HELP_MENUS = exports.DELETE_HELP_MENUS = exports.COMMAND_HELP_MENUS = exports.ZOOM_HELP_MENUS = undefined;
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
/**
|
|
* Help features for zoom
|
|
* @type {Array.<string>}
|
|
*/
|
|
var ZOOM_HELP_MENUS = exports.ZOOM_HELP_MENUS = ['zoomIn', 'zoomOut', 'hand'];
|
|
|
|
/**
|
|
* Help features for command
|
|
* @type {Array.<string>}
|
|
*/
|
|
/**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Constants
|
|
*/
|
|
var COMMAND_HELP_MENUS = exports.COMMAND_HELP_MENUS = ['history', 'undo', 'redo', 'reset'];
|
|
|
|
/**
|
|
* Help features for delete
|
|
* @type {Array.<string>}
|
|
*/
|
|
var DELETE_HELP_MENUS = exports.DELETE_HELP_MENUS = ['delete', 'deleteAll'];
|
|
|
|
/**
|
|
* Editor help features
|
|
* @type {Array.<string>}
|
|
*/
|
|
var HELP_MENUS = exports.HELP_MENUS = [].concat(ZOOM_HELP_MENUS, COMMAND_HELP_MENUS, DELETE_HELP_MENUS);
|
|
|
|
/**
|
|
* Fill type for shape
|
|
* @type {Object.<string, string>}
|
|
*/
|
|
var SHAPE_FILL_TYPE = exports.SHAPE_FILL_TYPE = {
|
|
FILTER: 'filter',
|
|
COLOR: 'color'
|
|
};
|
|
|
|
/**
|
|
* Shape type list
|
|
* @type {Array.<string>}
|
|
*/
|
|
var SHAPE_TYPE = exports.SHAPE_TYPE = ['rect', 'circle', 'triangle'];
|
|
|
|
/**
|
|
* Object type
|
|
* @type {Object.<string, string>}
|
|
*/
|
|
var OBJ_TYPE = exports.OBJ_TYPE = {
|
|
CROPZONE: 'cropzone'
|
|
};
|
|
|
|
/**
|
|
* Filter type map
|
|
* @type {Object.<string, string>}
|
|
*/
|
|
var filterType = exports.filterType = {
|
|
VINTAGE: 'vintage',
|
|
SEPIA2: 'sepia2',
|
|
REMOVE_COLOR: 'removeColor',
|
|
COLOR_FILTER: 'colorFilter',
|
|
REMOVE_WHITE: 'removeWhite',
|
|
BLEND_COLOR: 'blendColor',
|
|
BLEND: 'blend'
|
|
};
|
|
|
|
/**
|
|
* Component names
|
|
* @type {Object.<string, string>}
|
|
*/
|
|
var componentNames = exports.componentNames = (0, _util.keyMirror)('IMAGE_LOADER', 'CROPPER', 'FLIP', 'ROTATION', 'FREE_DRAWING', 'LINE', 'TEXT', 'ICON', 'FILTER', 'SHAPE', 'ZOOM');
|
|
|
|
/**
|
|
* Shape default option
|
|
* @type {Object}
|
|
*/
|
|
var SHAPE_DEFAULT_OPTIONS = exports.SHAPE_DEFAULT_OPTIONS = {
|
|
lockSkewingX: true,
|
|
lockSkewingY: true,
|
|
bringForward: true,
|
|
isRegular: false
|
|
};
|
|
|
|
/**
|
|
* Cropzone default option
|
|
* @type {Object}
|
|
*/
|
|
var CROPZONE_DEFAULT_OPTIONS = exports.CROPZONE_DEFAULT_OPTIONS = {
|
|
hasRotatingPoint: false,
|
|
hasBorders: false,
|
|
lockScalingFlip: true,
|
|
lockRotation: true,
|
|
lockSkewingX: true,
|
|
lockSkewingY: true
|
|
};
|
|
|
|
/**
|
|
* Command names
|
|
* @type {Object.<string, string>}
|
|
*/
|
|
var commandNames = exports.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',
|
|
CHANGE_SELECTION: 'changeSelection'
|
|
};
|
|
|
|
/**
|
|
* Event names
|
|
* @type {Object.<string, string>}
|
|
*/
|
|
var eventNames = exports.eventNames = {
|
|
OBJECT_ACTIVATED: 'objectActivated',
|
|
OBJECT_MOVED: 'objectMoved',
|
|
OBJECT_SCALED: 'objectScaled',
|
|
OBJECT_CREATED: 'objectCreated',
|
|
OBJECT_ROTATED: 'objectRotated',
|
|
OBJECT_ADDED: 'objectAdded',
|
|
OBJECT_MODIFIED: 'objectModified',
|
|
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',
|
|
EXECUTE_COMMAND: 'executeCommand',
|
|
AFTER_UNDO: 'afterUndo',
|
|
AFTER_REDO: 'afterRedo',
|
|
ZOOM_CHANGED: 'zoomChanged',
|
|
HAND_STARTED: 'handStarted',
|
|
HAND_STOPPED: 'handStopped',
|
|
KEY_DOWN: 'keydown',
|
|
KEY_UP: 'keyup'
|
|
};
|
|
|
|
/**
|
|
* History names
|
|
* @type {Object.<string, string>}
|
|
*/
|
|
var historyNames = exports.historyNames = {
|
|
LOAD_IMAGE: 'Load',
|
|
LOAD_MASK_IMAGE: 'Mask',
|
|
ADD_MASK_IMAGE: 'Mask',
|
|
ADD_IMAGE_OBJECT: 'Mask',
|
|
CROP: 'Crop',
|
|
APPLY_FILTER: 'Filter',
|
|
REMOVE_FILTER: 'Filter',
|
|
CHANGE_SHAPE: 'Shape',
|
|
CHANGE_ICON_COLOR: 'Icon',
|
|
ADD_TEXT: 'Text',
|
|
CHANGE_TEXT_STYLE: 'Text',
|
|
REMOVE_OBJECT: 'Delete',
|
|
CLEAR_OBJECTS: 'Delete'
|
|
};
|
|
|
|
/**
|
|
* Editor states
|
|
* @type {Object.<string, string>}
|
|
*/
|
|
var drawingModes = exports.drawingModes = (0, _util.keyMirror)('NORMAL', 'CROPPER', 'FREE_DRAWING', 'LINE_DRAWING', 'TEXT', 'SHAPE', 'ICON', 'ZOOM');
|
|
|
|
/**
|
|
* Menu names with drawing mode
|
|
* @type {Object.<string, string>}
|
|
*/
|
|
var drawingMenuNames = exports.drawingMenuNames = {
|
|
TEXT: 'text',
|
|
CROP: 'crop',
|
|
SHAPE: 'shape',
|
|
ZOOM: 'zoom'
|
|
};
|
|
|
|
/**
|
|
* Zoom modes
|
|
* @type {Object.<string, string>}
|
|
*/
|
|
var zoomModes = exports.zoomModes = {
|
|
DEFAULT: 'normal',
|
|
ZOOM: 'zoom',
|
|
HAND: 'hand'
|
|
};
|
|
|
|
/**
|
|
* Shortcut key values
|
|
* @type {Object.<string, number>}
|
|
*/
|
|
var keyCodes = exports.keyCodes = {
|
|
Z: 90,
|
|
Y: 89,
|
|
C: 67,
|
|
V: 86,
|
|
SHIFT: 16,
|
|
BACKSPACE: 8,
|
|
DEL: 46,
|
|
ARROW_DOWN: 40,
|
|
ARROW_UP: 38,
|
|
SPACE: 32
|
|
};
|
|
|
|
/**
|
|
* Fabric object options
|
|
* @type {Object.<string, Object>}
|
|
*/
|
|
var fObjectOptions = exports.fObjectOptions = {
|
|
SELECTION_STYLE: {
|
|
borderColor: 'red',
|
|
cornerColor: 'green',
|
|
cornerSize: 10,
|
|
originX: 'center',
|
|
originY: 'center',
|
|
transparentCorners: false
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Promise reject messages
|
|
* @type {Object.<string, string>}
|
|
*/
|
|
var rejectMessages = exports.rejectMessages = {
|
|
addedObject: 'The object is already added.',
|
|
flip: 'The flipX and flipY setting values are not changed.',
|
|
invalidDrawingMode: 'This operation is not supported in the drawing mode.',
|
|
invalidParameters: 'Invalid parameters.',
|
|
isLock: 'The executing command state is locked.',
|
|
loadImage: 'The background image is empty.',
|
|
loadingImageFailed: 'Invalid image loaded.',
|
|
noActiveObject: 'There is no active object.',
|
|
noObject: 'The object is not in canvas.',
|
|
redo: 'The promise of redo command is reject.',
|
|
rotation: 'The current angle is same the old angle.',
|
|
undo: 'The promise of undo command is reject.',
|
|
unsupportedOperation: 'Unsupported operation.',
|
|
unsupportedType: 'Unsupported object type.'
|
|
};
|
|
|
|
/**
|
|
* Default icon menu svg path
|
|
* @type {Object.<string, string>}
|
|
*/
|
|
var defaultIconPath = exports.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'
|
|
};
|
|
|
|
var defaultRotateRangeValues = exports.defaultRotateRangeValues = {
|
|
realTimeEvent: true,
|
|
min: -360,
|
|
max: 360,
|
|
value: 0
|
|
};
|
|
|
|
var defaultDrawRangeValues = exports.defaultDrawRangeValues = {
|
|
min: 5,
|
|
max: 30,
|
|
value: 12
|
|
};
|
|
|
|
var defaultShapeStrokeValues = exports.defaultShapeStrokeValues = {
|
|
realTimeEvent: true,
|
|
min: 2,
|
|
max: 300,
|
|
value: 3
|
|
};
|
|
|
|
var defaultTextRangeValues = exports.defaultTextRangeValues = {
|
|
realTimeEvent: true,
|
|
min: 10,
|
|
max: 100,
|
|
value: 50
|
|
};
|
|
|
|
var defaultFilterRangeValues = exports.defaultFilterRangeValues = {
|
|
tintOpacityRange: {
|
|
realTimeEvent: true,
|
|
min: 0,
|
|
max: 1,
|
|
value: 0.7,
|
|
useDecimal: true
|
|
},
|
|
removewhiteDistanceRange: {
|
|
realTimeEvent: true,
|
|
min: 0,
|
|
max: 1,
|
|
value: 0.2,
|
|
useDecimal: true
|
|
},
|
|
brightnessRange: {
|
|
realTimeEvent: true,
|
|
min: -1,
|
|
max: 1,
|
|
value: 0,
|
|
useDecimal: true
|
|
},
|
|
noiseRange: {
|
|
realTimeEvent: true,
|
|
min: 0,
|
|
max: 1000,
|
|
value: 100
|
|
},
|
|
pixelateRange: {
|
|
realTimeEvent: true,
|
|
min: 2,
|
|
max: 20,
|
|
value: 4
|
|
},
|
|
colorfilterThresholdRange: {
|
|
realTimeEvent: true,
|
|
min: 0,
|
|
max: 1,
|
|
value: 0.2,
|
|
useDecimal: true
|
|
},
|
|
blurFilterRange: {
|
|
value: 0.1
|
|
}
|
|
};
|
|
|
|
var emptyCropRectValues = exports.emptyCropRectValues = {
|
|
LEFT: 0,
|
|
TOP: 0,
|
|
WIDTH: 0.5,
|
|
HEIGHT: 0.5
|
|
};
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/drawingMode/cropper.js":
|
|
/*!***************************************!*\
|
|
!*** ./src/js/drawingMode/cropper.js ***!
|
|
\***************************************/
|
|
/*! no static exports found */
|
|
/***/ (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 _drawingMode = __webpack_require__(/*! @/interface/drawingMode */ "./src/js/interface/drawingMode.js");
|
|
|
|
var _drawingMode2 = _interopRequireDefault(_drawingMode);
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview CropperDrawingMode class
|
|
*/
|
|
|
|
|
|
/**
|
|
* 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, _consts.drawingModes.CROPPER));
|
|
}
|
|
|
|
/**
|
|
* start this drawing mode
|
|
* @param {Graphics} graphics - Graphics instance
|
|
* @override
|
|
*/
|
|
|
|
|
|
_createClass(CropperDrawingMode, [{
|
|
key: 'start',
|
|
value: function start(graphics) {
|
|
var cropper = graphics.getComponent(_consts.componentNames.CROPPER);
|
|
cropper.start();
|
|
}
|
|
|
|
/**
|
|
* stop this drawing mode
|
|
* @param {Graphics} graphics - Graphics instance
|
|
* @override
|
|
*/
|
|
|
|
}, {
|
|
key: 'end',
|
|
value: function end(graphics) {
|
|
var cropper = graphics.getComponent(_consts.componentNames.CROPPER);
|
|
cropper.end();
|
|
}
|
|
}]);
|
|
|
|
return CropperDrawingMode;
|
|
}(_drawingMode2.default);
|
|
|
|
exports.default = CropperDrawingMode;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/drawingMode/freeDrawing.js":
|
|
/*!*******************************************!*\
|
|
!*** ./src/js/drawingMode/freeDrawing.js ***!
|
|
\*******************************************/
|
|
/*! no static exports found */
|
|
/***/ (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 _drawingMode = __webpack_require__(/*! @/interface/drawingMode */ "./src/js/interface/drawingMode.js");
|
|
|
|
var _drawingMode2 = _interopRequireDefault(_drawingMode);
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview FreeDrawingMode class
|
|
*/
|
|
|
|
|
|
/**
|
|
* 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, _consts.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(_consts.componentNames.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(_consts.componentNames.FREE_DRAWING);
|
|
freeDrawing.end();
|
|
}
|
|
}]);
|
|
|
|
return FreeDrawingMode;
|
|
}(_drawingMode2.default);
|
|
|
|
exports.default = FreeDrawingMode;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/drawingMode/icon.js":
|
|
/*!************************************!*\
|
|
!*** ./src/js/drawingMode/icon.js ***!
|
|
\************************************/
|
|
/*! no static exports found */
|
|
/***/ (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 _drawingMode = __webpack_require__(/*! @/interface/drawingMode */ "./src/js/interface/drawingMode.js");
|
|
|
|
var _drawingMode2 = _interopRequireDefault(_drawingMode);
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview IconDrawingMode class
|
|
*/
|
|
|
|
|
|
/**
|
|
* IconDrawingMode class
|
|
* @class
|
|
* @ignore
|
|
*/
|
|
var IconDrawingMode = function (_DrawingMode) {
|
|
_inherits(IconDrawingMode, _DrawingMode);
|
|
|
|
function IconDrawingMode() {
|
|
_classCallCheck(this, IconDrawingMode);
|
|
|
|
return _possibleConstructorReturn(this, (IconDrawingMode.__proto__ || Object.getPrototypeOf(IconDrawingMode)).call(this, _consts.drawingModes.ICON));
|
|
}
|
|
|
|
/**
|
|
* start this drawing mode
|
|
* @param {Graphics} graphics - Graphics instance
|
|
* @override
|
|
*/
|
|
|
|
|
|
_createClass(IconDrawingMode, [{
|
|
key: 'start',
|
|
value: function start(graphics) {
|
|
var icon = graphics.getComponent(_consts.componentNames.ICON);
|
|
icon.start();
|
|
}
|
|
|
|
/**
|
|
* stop this drawing mode
|
|
* @param {Graphics} graphics - Graphics instance
|
|
* @override
|
|
*/
|
|
|
|
}, {
|
|
key: 'end',
|
|
value: function end(graphics) {
|
|
var icon = graphics.getComponent(_consts.componentNames.ICON);
|
|
icon.end();
|
|
}
|
|
}]);
|
|
|
|
return IconDrawingMode;
|
|
}(_drawingMode2.default);
|
|
|
|
exports.default = IconDrawingMode;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/drawingMode/lineDrawing.js":
|
|
/*!*******************************************!*\
|
|
!*** ./src/js/drawingMode/lineDrawing.js ***!
|
|
\*******************************************/
|
|
/*! no static exports found */
|
|
/***/ (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 _drawingMode = __webpack_require__(/*! @/interface/drawingMode */ "./src/js/interface/drawingMode.js");
|
|
|
|
var _drawingMode2 = _interopRequireDefault(_drawingMode);
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview LineDrawingMode class
|
|
*/
|
|
|
|
|
|
/**
|
|
* 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, _consts.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(_consts.componentNames.LINE);
|
|
lineDrawing.start(options);
|
|
}
|
|
|
|
/**
|
|
* stop this drawing mode
|
|
* @param {Graphics} graphics - Graphics instance
|
|
* @override
|
|
*/
|
|
|
|
}, {
|
|
key: 'end',
|
|
value: function end(graphics) {
|
|
var lineDrawing = graphics.getComponent(_consts.componentNames.LINE);
|
|
lineDrawing.end();
|
|
}
|
|
}]);
|
|
|
|
return LineDrawingMode;
|
|
}(_drawingMode2.default);
|
|
|
|
exports.default = LineDrawingMode;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/drawingMode/shape.js":
|
|
/*!*************************************!*\
|
|
!*** ./src/js/drawingMode/shape.js ***!
|
|
\*************************************/
|
|
/*! no static exports found */
|
|
/***/ (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 _drawingMode = __webpack_require__(/*! @/interface/drawingMode */ "./src/js/interface/drawingMode.js");
|
|
|
|
var _drawingMode2 = _interopRequireDefault(_drawingMode);
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview ShapeDrawingMode class
|
|
*/
|
|
|
|
|
|
/**
|
|
* 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, _consts.drawingModes.SHAPE));
|
|
}
|
|
|
|
/**
|
|
* start this drawing mode
|
|
* @param {Graphics} graphics - Graphics instance
|
|
* @override
|
|
*/
|
|
|
|
|
|
_createClass(ShapeDrawingMode, [{
|
|
key: 'start',
|
|
value: function start(graphics) {
|
|
var shape = graphics.getComponent(_consts.componentNames.SHAPE);
|
|
shape.start();
|
|
}
|
|
|
|
/**
|
|
* stop this drawing mode
|
|
* @param {Graphics} graphics - Graphics instance
|
|
* @override
|
|
*/
|
|
|
|
}, {
|
|
key: 'end',
|
|
value: function end(graphics) {
|
|
var shape = graphics.getComponent(_consts.componentNames.SHAPE);
|
|
shape.end();
|
|
}
|
|
}]);
|
|
|
|
return ShapeDrawingMode;
|
|
}(_drawingMode2.default);
|
|
|
|
exports.default = ShapeDrawingMode;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/drawingMode/text.js":
|
|
/*!************************************!*\
|
|
!*** ./src/js/drawingMode/text.js ***!
|
|
\************************************/
|
|
/*! no static exports found */
|
|
/***/ (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 _drawingMode = __webpack_require__(/*! @/interface/drawingMode */ "./src/js/interface/drawingMode.js");
|
|
|
|
var _drawingMode2 = _interopRequireDefault(_drawingMode);
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview TextDrawingMode class
|
|
*/
|
|
|
|
|
|
/**
|
|
* 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, _consts.drawingModes.TEXT));
|
|
}
|
|
|
|
/**
|
|
* start this drawing mode
|
|
* @param {Graphics} graphics - Graphics instance
|
|
* @override
|
|
*/
|
|
|
|
|
|
_createClass(TextDrawingMode, [{
|
|
key: 'start',
|
|
value: function start(graphics) {
|
|
var text = graphics.getComponent(_consts.componentNames.TEXT);
|
|
text.start();
|
|
}
|
|
|
|
/**
|
|
* stop this drawing mode
|
|
* @param {Graphics} graphics - Graphics instance
|
|
* @override
|
|
*/
|
|
|
|
}, {
|
|
key: 'end',
|
|
value: function end(graphics) {
|
|
var text = graphics.getComponent(_consts.componentNames.TEXT);
|
|
text.end();
|
|
}
|
|
}]);
|
|
|
|
return TextDrawingMode;
|
|
}(_drawingMode2.default);
|
|
|
|
exports.default = TextDrawingMode;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/drawingMode/zoom.js":
|
|
/*!************************************!*\
|
|
!*** ./src/js/drawingMode/zoom.js ***!
|
|
\************************************/
|
|
/*! no static exports found */
|
|
/***/ (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 _drawingMode = __webpack_require__(/*! @/interface/drawingMode */ "./src/js/interface/drawingMode.js");
|
|
|
|
var _drawingMode2 = _interopRequireDefault(_drawingMode);
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview ZoomDrawingMode class
|
|
*/
|
|
|
|
|
|
/**
|
|
* ZoomDrawingMode class
|
|
* @class
|
|
* @ignore
|
|
*/
|
|
var ZoomDrawingMode = function (_DrawingMode) {
|
|
_inherits(ZoomDrawingMode, _DrawingMode);
|
|
|
|
function ZoomDrawingMode() {
|
|
_classCallCheck(this, ZoomDrawingMode);
|
|
|
|
return _possibleConstructorReturn(this, (ZoomDrawingMode.__proto__ || Object.getPrototypeOf(ZoomDrawingMode)).call(this, _consts.drawingModes.ZOOM));
|
|
}
|
|
|
|
/**
|
|
* start this drawing mode
|
|
* @param {Graphics} graphics - Graphics instance
|
|
* @override
|
|
*/
|
|
|
|
|
|
_createClass(ZoomDrawingMode, [{
|
|
key: 'start',
|
|
value: function start(graphics) {
|
|
var zoom = graphics.getComponent(_consts.componentNames.ZOOM);
|
|
|
|
zoom.start();
|
|
}
|
|
|
|
/**
|
|
* stop this drawing mode
|
|
* @param {Graphics} graphics - Graphics instance
|
|
* @override
|
|
*/
|
|
|
|
}, {
|
|
key: 'end',
|
|
value: function end(graphics) {
|
|
var zoom = graphics.getComponent(_consts.componentNames.ZOOM);
|
|
|
|
zoom.end();
|
|
}
|
|
}]);
|
|
|
|
return ZoomDrawingMode;
|
|
}(_drawingMode2.default);
|
|
|
|
exports.default = ZoomDrawingMode;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/extension/arrowLine.js":
|
|
/*!***************************************!*\
|
|
!*** ./src/js/extension/arrowLine.js ***!
|
|
\***************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _fabric = __webpack_require__(/*! fabric */ "fabric");
|
|
|
|
var _fabric2 = _interopRequireDefault(_fabric);
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
var ARROW_ANGLE = 30; /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Blur extending fabric.Image.filters.Convolute
|
|
*/
|
|
|
|
var CHEVRON_SIZE_RATIO = 2.7;
|
|
var TRIANGLE_SIZE_RATIO = 1.7;
|
|
var RADIAN_CONVERSION_VALUE = 180;
|
|
|
|
var ArrowLine = _fabric2.default.util.createClass(_fabric2.default.Line,
|
|
/** @lends Convolute.prototype */{
|
|
/**
|
|
* Line type
|
|
* @param {String} type
|
|
* @default
|
|
*/
|
|
type: 'line',
|
|
|
|
/**
|
|
* Constructor
|
|
* @param {Array} [points] Array of points
|
|
* @param {Object} [options] Options object
|
|
* @override
|
|
*/
|
|
initialize: function initialize(points) {
|
|
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
|
|
this.callSuper('initialize', points, options);
|
|
|
|
this.arrowType = options.arrowType;
|
|
},
|
|
|
|
|
|
/**
|
|
* Render ArrowLine
|
|
* @private
|
|
* @override
|
|
*/
|
|
_render: function _render(ctx) {
|
|
var _calcLinePoints = this.calcLinePoints(),
|
|
fromX = _calcLinePoints.x1,
|
|
fromY = _calcLinePoints.y1,
|
|
toX = _calcLinePoints.x2,
|
|
toY = _calcLinePoints.y2;
|
|
|
|
var linePosition = {
|
|
fromX: fromX,
|
|
fromY: fromY,
|
|
toX: toX,
|
|
toY: toY
|
|
};
|
|
this.ctx = ctx;
|
|
ctx.lineWidth = this.strokeWidth;
|
|
|
|
this._renderBasicLinePath(linePosition);
|
|
this._drawDecoratorPath(linePosition);
|
|
|
|
this._renderStroke(ctx);
|
|
},
|
|
|
|
|
|
/**
|
|
* Render Basic line path
|
|
* @param {Object} linePosition - line position
|
|
* @param {number} option.fromX - line start position x
|
|
* @param {number} option.fromY - line start position y
|
|
* @param {number} option.toX - line end position x
|
|
* @param {number} option.toY - line end position y
|
|
* @private
|
|
*/
|
|
_renderBasicLinePath: function _renderBasicLinePath(_ref) {
|
|
var fromX = _ref.fromX,
|
|
fromY = _ref.fromY,
|
|
toX = _ref.toX,
|
|
toY = _ref.toY;
|
|
|
|
this.ctx.beginPath();
|
|
this.ctx.moveTo(fromX, fromY);
|
|
this.ctx.lineTo(toX, toY);
|
|
},
|
|
|
|
|
|
/**
|
|
* Render Arrow Head
|
|
* @param {Object} linePosition - line position
|
|
* @param {number} option.fromX - line start position x
|
|
* @param {number} option.fromY - line start position y
|
|
* @param {number} option.toX - line end position x
|
|
* @param {number} option.toY - line end position y
|
|
* @private
|
|
*/
|
|
_drawDecoratorPath: function _drawDecoratorPath(linePosition) {
|
|
this._drawDecoratorPathType('head', linePosition);
|
|
this._drawDecoratorPathType('tail', linePosition);
|
|
},
|
|
|
|
|
|
/**
|
|
* Render Arrow Head
|
|
* @param {string} type - 'head' or 'tail'
|
|
* @param {Object} linePosition - line position
|
|
* @param {number} option.fromX - line start position x
|
|
* @param {number} option.fromY - line start position y
|
|
* @param {number} option.toX - line end position x
|
|
* @param {number} option.toY - line end position y
|
|
* @private
|
|
*/
|
|
_drawDecoratorPathType: function _drawDecoratorPathType(type, linePosition) {
|
|
switch (this.arrowType[type]) {
|
|
case 'triangle':
|
|
this._drawTrianglePath(type, linePosition);
|
|
break;
|
|
case 'chevron':
|
|
this._drawChevronPath(type, linePosition);
|
|
break;
|
|
default:
|
|
break;
|
|
}
|
|
},
|
|
|
|
|
|
/**
|
|
* Render Triangle Head
|
|
* @param {string} type - 'head' or 'tail'
|
|
* @param {Object} linePosition - line position
|
|
* @param {number} option.fromX - line start position x
|
|
* @param {number} option.fromY - line start position y
|
|
* @param {number} option.toX - line end position x
|
|
* @param {number} option.toY - line end position y
|
|
* @private
|
|
*/
|
|
_drawTrianglePath: function _drawTrianglePath(type, linePosition) {
|
|
var decorateSize = this.ctx.lineWidth * TRIANGLE_SIZE_RATIO;
|
|
|
|
this._drawChevronPath(type, linePosition, decorateSize);
|
|
this.ctx.closePath();
|
|
},
|
|
|
|
|
|
/**
|
|
* Render Chevron Head
|
|
* @param {string} type - 'head' or 'tail'
|
|
* @param {Object} linePosition - line position
|
|
* @param {number} option.fromX - line start position x
|
|
* @param {number} option.fromY - line start position y
|
|
* @param {number} option.toX - line end position x
|
|
* @param {number} option.toY - line end position y
|
|
* @param {number} decorateSize - decorate size
|
|
* @private
|
|
*/
|
|
_drawChevronPath: function _drawChevronPath(type, _ref2, decorateSize) {
|
|
var _this = this;
|
|
|
|
var fromX = _ref2.fromX,
|
|
fromY = _ref2.fromY,
|
|
toX = _ref2.toX,
|
|
toY = _ref2.toY;
|
|
var ctx = this.ctx;
|
|
|
|
if (!decorateSize) {
|
|
decorateSize = this.ctx.lineWidth * CHEVRON_SIZE_RATIO;
|
|
}
|
|
|
|
var _ref3 = type === 'head' ? [fromX, fromY] : [toX, toY],
|
|
standardX = _ref3[0],
|
|
standardY = _ref3[1];
|
|
|
|
var _ref4 = type === 'head' ? [toX, toY] : [fromX, fromY],
|
|
compareX = _ref4[0],
|
|
compareY = _ref4[1];
|
|
|
|
var angle = Math.atan2(compareY - standardY, compareX - standardX) * RADIAN_CONVERSION_VALUE / Math.PI;
|
|
var rotatedPosition = function rotatedPosition(changeAngle) {
|
|
return _this.getRotatePosition(decorateSize, changeAngle, {
|
|
x: standardX,
|
|
y: standardY
|
|
});
|
|
};
|
|
|
|
ctx.moveTo.apply(ctx, rotatedPosition(angle + ARROW_ANGLE));
|
|
ctx.lineTo(standardX, standardY);
|
|
ctx.lineTo.apply(ctx, rotatedPosition(angle - ARROW_ANGLE));
|
|
},
|
|
|
|
|
|
/**
|
|
* return position from change angle.
|
|
* @param {number} distance - change distance
|
|
* @param {number} angle - change angle
|
|
* @param {Object} referencePosition - reference position
|
|
* @returns {Array}
|
|
* @private
|
|
*/
|
|
getRotatePosition: function getRotatePosition(distance, angle, referencePosition) {
|
|
var radian = angle * Math.PI / RADIAN_CONVERSION_VALUE;
|
|
var x = referencePosition.x,
|
|
y = referencePosition.y;
|
|
|
|
|
|
return [distance * Math.cos(radian) + x, distance * Math.sin(radian) + y];
|
|
}
|
|
});
|
|
|
|
exports.default = ArrowLine;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/extension/colorFilter.js":
|
|
/*!*****************************************!*\
|
|
!*** ./src/js/extension/colorFilter.js ***!
|
|
\*****************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _fabric = __webpack_require__(/*! fabric */ "fabric");
|
|
|
|
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 = _fabric2.default.util.createClass(_fabric2.default.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} canvas Canvas object passed by fabric
|
|
*/
|
|
// eslint-disable-next-line complexity
|
|
applyTo: function applyTo(canvas) {
|
|
var canvasEl = canvas.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 = _fabric2.default.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. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview ColorFilter extending fabric.Image.filters.BaseFilter
|
|
*/
|
|
exports.default = ColorFilter;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/extension/cropzone.js":
|
|
/*!**************************************!*\
|
|
!*** ./src/js/extension/cropzone.js ***!
|
|
\**************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _tuiCodeSnippet = __webpack_require__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _fabric = __webpack_require__(/*! fabric */ "fabric");
|
|
|
|
var _fabric2 = _interopRequireDefault(_fabric);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Cropzone extending fabric.Rect
|
|
*/
|
|
|
|
|
|
var CORNER_TYPE_TOP_LEFT = 'tl';
|
|
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';
|
|
var CORNER_TYPE_LIST = [CORNER_TYPE_TOP_LEFT, CORNER_TYPE_TOP_RIGHT, CORNER_TYPE_MIDDLE_TOP, CORNER_TYPE_MIDDLE_LEFT, CORNER_TYPE_MIDDLE_RIGHT, CORNER_TYPE_MIDDLE_BOTTOM, CORNER_TYPE_BOTTOM_LEFT, CORNER_TYPE_BOTTOM_RIGHT];
|
|
var NOOP_FUNCTION = function NOOP_FUNCTION() {};
|
|
|
|
/**
|
|
* Align with cropzone ratio
|
|
* @param {string} selectedCorner - selected corner type
|
|
* @returns {{width: number, height: number}}
|
|
* @private
|
|
*/
|
|
function cornerTypeValid(selectedCorner) {
|
|
return CORNER_TYPE_LIST.indexOf(selectedCorner) >= 0;
|
|
}
|
|
|
|
/**
|
|
* return scale basis type
|
|
* @param {number} diffX - X distance of the cursor and corner.
|
|
* @param {number} diffY - Y distance of the cursor and corner.
|
|
* @returns {string}
|
|
* @private
|
|
*/
|
|
function getScaleBasis(diffX, diffY) {
|
|
return diffX > diffY ? 'width' : 'height';
|
|
}
|
|
|
|
/**
|
|
* Cropzone object
|
|
* Issue: IE7, 8(with excanvas)
|
|
* - Cropzone is a black zone without transparency.
|
|
* @class Cropzone
|
|
* @extends {fabric.Rect}
|
|
* @ignore
|
|
*/
|
|
var Cropzone = _fabric2.default.util.createClass(_fabric2.default.Rect,
|
|
/** @lends Cropzone.prototype */{
|
|
/**
|
|
* Constructor
|
|
* @param {Object} canvas canvas
|
|
* @param {Object} options Options object
|
|
* @param {Object} extendsOptions object for extends "options"
|
|
* @override
|
|
*/
|
|
initialize: function initialize(canvas, options, extendsOptions) {
|
|
options = _tuiCodeSnippet2.default.extend(options, extendsOptions);
|
|
options.type = 'cropzone';
|
|
|
|
this.callSuper('initialize', options);
|
|
this._addEventHandler();
|
|
|
|
this.canvas = canvas;
|
|
this.options = options;
|
|
},
|
|
canvasEventDelegation: function canvasEventDelegation(eventName) {
|
|
var delegationState = 'unregistered';
|
|
var isRegistered = this.canvasEventTrigger[eventName] !== NOOP_FUNCTION;
|
|
if (isRegistered) {
|
|
delegationState = 'registered';
|
|
} else if ([_consts.eventNames.OBJECT_MOVED, _consts.eventNames.OBJECT_SCALED].indexOf(eventName) < 0) {
|
|
delegationState = 'none';
|
|
}
|
|
|
|
return delegationState;
|
|
},
|
|
canvasEventRegister: function canvasEventRegister(eventName, eventTrigger) {
|
|
this.canvasEventTrigger[eventName] = eventTrigger;
|
|
},
|
|
_addEventHandler: function _addEventHandler() {
|
|
var _canvasEventTrigger;
|
|
|
|
this.canvasEventTrigger = (_canvasEventTrigger = {}, _defineProperty(_canvasEventTrigger, _consts.eventNames.OBJECT_MOVED, NOOP_FUNCTION), _defineProperty(_canvasEventTrigger, _consts.eventNames.OBJECT_SCALED, NOOP_FUNCTION), _canvasEventTrigger);
|
|
this.on({
|
|
moving: this._onMoving.bind(this),
|
|
scaling: this._onScaling.bind(this)
|
|
});
|
|
_fabric2.default.util.addListener(document, 'keydown', this._onKeyDown.bind(this));
|
|
_fabric2.default.util.addListener(document, 'keyup', this._onKeyUp.bind(this));
|
|
},
|
|
_renderCropzone: function _renderCropzone(ctx) {
|
|
var cropzoneDashLineWidth = 7;
|
|
var cropzoneDashLineOffset = 7;
|
|
|
|
// 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.5)');
|
|
|
|
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)', {
|
|
lineDashWidth: cropzoneDashLineWidth
|
|
});
|
|
|
|
// White dash line
|
|
this._strokeBorder(ctx, 'rgb(255, 255, 255)', {
|
|
lineDashWidth: cropzoneDashLineWidth,
|
|
lineDashOffset: cropzoneDashLineOffset
|
|
});
|
|
}
|
|
|
|
// Reset scale
|
|
ctx.scale(1 / originalScaleX, 1 / originalScaleY);
|
|
},
|
|
|
|
|
|
/**
|
|
* Render Crop-zone
|
|
* @private
|
|
* @override
|
|
*/
|
|
_render: function _render(ctx) {
|
|
this.callSuper('_render', ctx);
|
|
|
|
this._renderCropzone(ctx);
|
|
},
|
|
|
|
|
|
/**
|
|
* 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<number>, y: Array<number>}} 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(),
|
|
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();
|
|
},
|
|
|
|
|
|
/**
|
|
* Draw Inner grid line
|
|
* @param {CanvasRenderingContext2D} ctx - Context
|
|
* @private
|
|
*/
|
|
_fillInnerRect: function _fillInnerRect(ctx) {
|
|
var _getCoordinates2 = this._getCoordinates(),
|
|
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 calculate
|
|
* @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
|
|
* @returns {cropzoneCoordinates} - {@link cropzoneCoordinates}
|
|
* @private
|
|
*/
|
|
_getCoordinates: function _getCoordinates() {
|
|
var canvas = this.canvas,
|
|
width = this.width,
|
|
height = this.height,
|
|
left = this.left,
|
|
top = this.top;
|
|
|
|
var halfWidth = width / 2;
|
|
var halfHeight = height / 2;
|
|
var canvasHeight = canvas.getHeight(); // fabric object
|
|
var canvasWidth = canvas.getWidth(); // fabric object
|
|
|
|
return {
|
|
x: _tuiCodeSnippet2.default.map([-(halfWidth + left), // x0
|
|
-halfWidth, // x1
|
|
halfWidth, // x2
|
|
halfWidth + (canvasWidth - left - width)], Math.ceil),
|
|
y: _tuiCodeSnippet2.default.map([-(halfHeight + top), // y0
|
|
-halfHeight, // y1
|
|
halfHeight, // y2
|
|
halfHeight + (canvasHeight - top - height)], 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
|
|
* @param {number} [lineWidth] - line width
|
|
* @private
|
|
*/
|
|
_strokeBorder: function _strokeBorder(ctx, strokeStyle, _ref) {
|
|
var lineDashWidth = _ref.lineDashWidth,
|
|
lineDashOffset = _ref.lineDashOffset,
|
|
lineWidth = _ref.lineWidth;
|
|
|
|
var halfWidth = this.width / 2;
|
|
var halfHeight = this.height / 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);
|
|
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 height = this.height,
|
|
width = this.width,
|
|
left = this.left,
|
|
top = this.top;
|
|
|
|
var maxLeft = this.canvas.getWidth() - width;
|
|
var maxTop = this.canvas.getHeight() - height;
|
|
|
|
this.left = (0, _util.clamp)(left, 0, maxLeft);
|
|
this.top = (0, _util.clamp)(top, 0, maxTop);
|
|
|
|
this.canvasEventTrigger[_consts.eventNames.OBJECT_MOVED](this);
|
|
},
|
|
|
|
|
|
/**
|
|
* onScaling event listener
|
|
* @param {{e: MouseEvent}} fEvent - Fabric event
|
|
* @private
|
|
*/
|
|
_onScaling: function _onScaling(fEvent) {
|
|
var selectedCorner = fEvent.transform.corner;
|
|
var pointer = this.canvas.getPointer(fEvent.e);
|
|
var settings = this._calcScalingSizeFromPointer(pointer, selectedCorner);
|
|
|
|
// On scaling cropzone,
|
|
// change real width and height and fix scaleFactor to 1
|
|
this.scale(1).set(settings);
|
|
|
|
this.canvasEventTrigger[_consts.eventNames.OBJECT_SCALED](this);
|
|
},
|
|
|
|
|
|
/**
|
|
* Calc scaled size from mouse pointer with selected corner
|
|
* @param {{x: number, y: number}} pointer - Mouse position
|
|
* @param {string} selectedCorner - selected corner type
|
|
* @returns {Object} Having left or(and) top or(and) width or(and) height.
|
|
* @private
|
|
*/
|
|
_calcScalingSizeFromPointer: function _calcScalingSizeFromPointer(pointer, selectedCorner) {
|
|
var isCornerTypeValid = cornerTypeValid(selectedCorner);
|
|
|
|
return isCornerTypeValid && this._resizeCropZone(pointer, selectedCorner);
|
|
},
|
|
|
|
|
|
/**
|
|
* Align with cropzone ratio
|
|
* @param {number} width - cropzone width
|
|
* @param {number} height - cropzone height
|
|
* @param {number} maxWidth - limit max width
|
|
* @param {number} maxHeight - limit max height
|
|
* @param {number} scaleTo - cropzone ratio
|
|
* @returns {{width: number, height: number}}
|
|
* @private
|
|
*/
|
|
adjustRatioCropzoneSize: function adjustRatioCropzoneSize(_ref2) {
|
|
var width = _ref2.width,
|
|
height = _ref2.height,
|
|
leftMaker = _ref2.leftMaker,
|
|
topMaker = _ref2.topMaker,
|
|
maxWidth = _ref2.maxWidth,
|
|
maxHeight = _ref2.maxHeight,
|
|
scaleTo = _ref2.scaleTo;
|
|
|
|
width = maxWidth ? (0, _util.clamp)(width, 1, maxWidth) : width;
|
|
height = maxHeight ? (0, _util.clamp)(height, 1, maxHeight) : height;
|
|
|
|
if (!this.presetRatio) {
|
|
if (this._withShiftKey) {
|
|
// make fixed ratio cropzone
|
|
if (width > height) {
|
|
height = width;
|
|
} else if (height > width) {
|
|
width = height;
|
|
}
|
|
}
|
|
|
|
return {
|
|
width: width,
|
|
height: height,
|
|
left: leftMaker(width),
|
|
top: topMaker(height)
|
|
};
|
|
}
|
|
|
|
if (scaleTo === 'width') {
|
|
height = width / this.presetRatio;
|
|
} else {
|
|
width = height * this.presetRatio;
|
|
}
|
|
|
|
var maxScaleFactor = Math.min(maxWidth / width, maxHeight / height);
|
|
if (maxScaleFactor <= 1) {
|
|
var _map = [width, height].map(function (v) {
|
|
return v * maxScaleFactor;
|
|
});
|
|
|
|
width = _map[0];
|
|
height = _map[1];
|
|
}
|
|
|
|
return {
|
|
width: width,
|
|
height: height,
|
|
left: leftMaker(width),
|
|
top: topMaker(height)
|
|
};
|
|
},
|
|
|
|
|
|
/**
|
|
* Get dimension last state cropzone
|
|
* @returns {{rectTop: number, rectLeft: number, rectWidth: number, rectHeight: number}}
|
|
* @private
|
|
*/
|
|
_getCropzoneRectInfo: function _getCropzoneRectInfo() {
|
|
var _canvas = this.canvas,
|
|
canvasWidth = _canvas.width,
|
|
canvasHeight = _canvas.height;
|
|
|
|
var _getBoundingRect = this.getBoundingRect(false, true),
|
|
rectTop = _getBoundingRect.top,
|
|
rectLeft = _getBoundingRect.left,
|
|
rectWidth = _getBoundingRect.width,
|
|
rectHeight = _getBoundingRect.height;
|
|
|
|
return {
|
|
rectTop: rectTop,
|
|
rectLeft: rectLeft,
|
|
rectWidth: rectWidth,
|
|
rectHeight: rectHeight,
|
|
rectRight: rectLeft + rectWidth,
|
|
rectBottom: rectTop + rectHeight,
|
|
canvasWidth: canvasWidth,
|
|
canvasHeight: canvasHeight
|
|
};
|
|
},
|
|
|
|
|
|
/**
|
|
* Calc scaling dimension
|
|
* @param {Object} position - Mouse position
|
|
* @param {string} corner - corner type
|
|
* @returns {{left: number, top: number, width: number, height: number}}
|
|
* @private
|
|
*/
|
|
_resizeCropZone: function _resizeCropZone(_ref3, corner) {
|
|
var x = _ref3.x,
|
|
y = _ref3.y;
|
|
|
|
var _getCropzoneRectInfo2 = this._getCropzoneRectInfo(),
|
|
rectWidth = _getCropzoneRectInfo2.rectWidth,
|
|
rectHeight = _getCropzoneRectInfo2.rectHeight,
|
|
rectTop = _getCropzoneRectInfo2.rectTop,
|
|
rectLeft = _getCropzoneRectInfo2.rectLeft,
|
|
rectBottom = _getCropzoneRectInfo2.rectBottom,
|
|
rectRight = _getCropzoneRectInfo2.rectRight,
|
|
canvasWidth = _getCropzoneRectInfo2.canvasWidth,
|
|
canvasHeight = _getCropzoneRectInfo2.canvasHeight;
|
|
|
|
var resizeInfoMap = {
|
|
tl: {
|
|
width: rectRight - x,
|
|
height: rectBottom - y,
|
|
leftMaker: function leftMaker(newWidth) {
|
|
return rectRight - newWidth;
|
|
},
|
|
topMaker: function topMaker(newHeight) {
|
|
return rectBottom - newHeight;
|
|
},
|
|
maxWidth: rectRight,
|
|
maxHeight: rectBottom,
|
|
scaleTo: getScaleBasis(rectLeft - x, rectTop - y)
|
|
},
|
|
tr: {
|
|
width: x - rectLeft,
|
|
height: rectBottom - y,
|
|
leftMaker: function leftMaker() {
|
|
return rectLeft;
|
|
},
|
|
topMaker: function topMaker(newHeight) {
|
|
return rectBottom - newHeight;
|
|
},
|
|
maxWidth: canvasWidth - rectLeft,
|
|
maxHeight: rectBottom,
|
|
scaleTo: getScaleBasis(x - rectRight, rectTop - y)
|
|
},
|
|
mt: {
|
|
width: rectWidth,
|
|
height: rectBottom - y,
|
|
leftMaker: function leftMaker() {
|
|
return rectLeft;
|
|
},
|
|
topMaker: function topMaker(newHeight) {
|
|
return rectBottom - newHeight;
|
|
},
|
|
maxWidth: canvasWidth - rectLeft,
|
|
maxHeight: rectBottom,
|
|
scaleTo: 'height'
|
|
},
|
|
ml: {
|
|
width: rectRight - x,
|
|
height: rectHeight,
|
|
leftMaker: function leftMaker(newWidth) {
|
|
return rectRight - newWidth;
|
|
},
|
|
topMaker: function topMaker() {
|
|
return rectTop;
|
|
},
|
|
maxWidth: rectRight,
|
|
maxHeight: canvasHeight - rectTop,
|
|
scaleTo: 'width'
|
|
},
|
|
mr: {
|
|
width: x - rectLeft,
|
|
height: rectHeight,
|
|
leftMaker: function leftMaker() {
|
|
return rectLeft;
|
|
},
|
|
topMaker: function topMaker() {
|
|
return rectTop;
|
|
},
|
|
maxWidth: canvasWidth - rectLeft,
|
|
maxHeight: canvasHeight - rectTop,
|
|
scaleTo: 'width'
|
|
},
|
|
mb: {
|
|
width: rectWidth,
|
|
height: y - rectTop,
|
|
leftMaker: function leftMaker() {
|
|
return rectLeft;
|
|
},
|
|
topMaker: function topMaker() {
|
|
return rectTop;
|
|
},
|
|
maxWidth: canvasWidth - rectLeft,
|
|
maxHeight: canvasHeight - rectTop,
|
|
scaleTo: 'height'
|
|
},
|
|
bl: {
|
|
width: rectRight - x,
|
|
height: y - rectTop,
|
|
leftMaker: function leftMaker(newWidth) {
|
|
return rectRight - newWidth;
|
|
},
|
|
topMaker: function topMaker() {
|
|
return rectTop;
|
|
},
|
|
maxWidth: rectRight,
|
|
maxHeight: canvasHeight - rectTop,
|
|
scaleTo: getScaleBasis(rectLeft - x, y - rectBottom)
|
|
},
|
|
br: {
|
|
width: x - rectLeft,
|
|
height: y - rectTop,
|
|
leftMaker: function leftMaker() {
|
|
return rectLeft;
|
|
},
|
|
topMaker: function topMaker() {
|
|
return rectTop;
|
|
},
|
|
maxWidth: canvasWidth - rectLeft,
|
|
maxHeight: canvasHeight - rectTop,
|
|
scaleTo: getScaleBasis(x - rectRight, y - rectBottom)
|
|
}
|
|
};
|
|
|
|
return this.adjustRatioCropzoneSize(resizeInfoMap[corner]);
|
|
},
|
|
|
|
|
|
/**
|
|
* 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;
|
|
},
|
|
|
|
|
|
/**
|
|
* Keydown event handler
|
|
* @param {{number}} keyCode - Event keyCode
|
|
* @private
|
|
*/
|
|
_onKeyDown: function _onKeyDown(_ref4) {
|
|
var keyCode = _ref4.keyCode;
|
|
|
|
if (keyCode === _consts.keyCodes.SHIFT) {
|
|
this._withShiftKey = true;
|
|
}
|
|
},
|
|
|
|
|
|
/**
|
|
* Keyup event handler
|
|
* @param {{number}} keyCode - Event keyCode
|
|
* @private
|
|
*/
|
|
_onKeyUp: function _onKeyUp(_ref5) {
|
|
var keyCode = _ref5.keyCode;
|
|
|
|
if (keyCode === _consts.keyCodes.SHIFT) {
|
|
this._withShiftKey = false;
|
|
}
|
|
}
|
|
});
|
|
|
|
exports.default = Cropzone;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/extension/emboss.js":
|
|
/*!************************************!*\
|
|
!*** ./src/js/extension/emboss.js ***!
|
|
\************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _fabric = __webpack_require__(/*! fabric */ "fabric");
|
|
|
|
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 = _fabric2.default.util.createClass(_fabric2.default.Image.filters.Convolute,
|
|
/** @lends Convolute.prototype */{
|
|
/**
|
|
* Filter type
|
|
* @param {String} type
|
|
* @default
|
|
*/
|
|
type: 'Emboss',
|
|
|
|
/**
|
|
* constructor
|
|
* @override
|
|
*/
|
|
initialize: function initialize() {
|
|
this.matrix = [1, 1, 1, 1, 0.7, -1, -1, -1, -1];
|
|
}
|
|
}); /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Emboss extending fabric.Image.filters.Convolute
|
|
*/
|
|
exports.default = Emboss;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/extension/mask.js":
|
|
/*!**********************************!*\
|
|
!*** ./src/js/extension/mask.js ***!
|
|
\**********************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _fabric = __webpack_require__(/*! fabric */ "fabric");
|
|
|
|
var _fabric2 = _interopRequireDefault(_fabric);
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
/**
|
|
* Mask object
|
|
* @class Mask
|
|
* @extends {fabric.Image.filters.BlendImage}
|
|
* @ignore
|
|
*/
|
|
var Mask = _fabric2.default.util.createClass(_fabric2.default.Image.filters.BlendImage,
|
|
/** @lends Mask.prototype */{
|
|
/**
|
|
* Apply filter to canvas element
|
|
* @param {Object} pipelineState - Canvas element to apply filter
|
|
* @override
|
|
*/
|
|
applyTo: function applyTo(pipelineState) {
|
|
if (!this.mask) {
|
|
return;
|
|
}
|
|
|
|
var canvas = pipelineState.canvasEl;
|
|
var width = canvas.width,
|
|
height = canvas.height;
|
|
|
|
var maskCanvasEl = this._createCanvasOfMask(width, height);
|
|
var ctx = canvas.getContext('2d');
|
|
var maskCtx = maskCanvasEl.getContext('2d');
|
|
var imageData = ctx.getImageData(0, 0, width, height);
|
|
|
|
this._drawMask(maskCtx, canvas, ctx);
|
|
this._mapData(maskCtx, imageData, width, height);
|
|
|
|
pipelineState.imageData = imageData;
|
|
},
|
|
|
|
|
|
/**
|
|
* 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 = _fabric2.default.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 angle = mask.angle,
|
|
left = mask.left,
|
|
scaleX = mask.scaleX,
|
|
scaleY = mask.scaleY,
|
|
top = mask.top;
|
|
|
|
|
|
maskCtx.save();
|
|
maskCtx.translate(left, top);
|
|
maskCtx.rotate(angle * Math.PI / 180);
|
|
maskCtx.scale(scaleX, 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 data = imageData.data,
|
|
imgHeight = imageData.height,
|
|
imgWidth = imageData.width;
|
|
|
|
var sourceData = data;
|
|
var len = imgWidth * imgHeight * 4;
|
|
var maskData = maskCtx.getImageData(0, 0, width, height).data;
|
|
|
|
for (var i = 0; i < len; i += 4) {
|
|
sourceData[i + 3] = maskData[i]; // adjust value of alpha data
|
|
}
|
|
}
|
|
}); /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Mask extending fabric.Image.filters.Mask
|
|
*/
|
|
exports.default = Mask;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/extension/sharpen.js":
|
|
/*!*************************************!*\
|
|
!*** ./src/js/extension/sharpen.js ***!
|
|
\*************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _fabric = __webpack_require__(/*! fabric */ "fabric");
|
|
|
|
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 = _fabric2.default.util.createClass(_fabric2.default.Image.filters.Convolute,
|
|
/** @lends Convolute.prototype */{
|
|
/**
|
|
* Filter type
|
|
* @param {String} type
|
|
* @default
|
|
*/
|
|
type: 'Sharpen',
|
|
|
|
/**
|
|
* constructor
|
|
* @override
|
|
*/
|
|
initialize: function initialize() {
|
|
this.matrix = [0, -1, 0, -1, 5, -1, 0, -1, 0];
|
|
}
|
|
}); /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Sharpen extending fabric.Image.filters.Convolute
|
|
*/
|
|
exports.default = Sharpen;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/factory/command.js":
|
|
/*!***********************************!*\
|
|
!*** ./src/js/factory/command.js ***!
|
|
\***********************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _command = __webpack_require__(/*! @/interface/command */ "./src/js/interface/command.js");
|
|
|
|
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. FE Development Team <dl_javascript@nhn.com>
|
|
* @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;
|
|
}
|
|
|
|
exports.default = {
|
|
create: create,
|
|
register: register
|
|
};
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/factory/errorMessage.js":
|
|
/*!****************************************!*\
|
|
!*** ./src/js/factory/errorMessage.js ***!
|
|
\****************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _tuiCodeSnippet = __webpack_require__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
/**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @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;
|
|
}
|
|
};
|
|
|
|
exports.default = {
|
|
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);
|
|
}
|
|
};
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/graphics.js":
|
|
/*!****************************!*\
|
|
!*** ./src/js/graphics.js ***!
|
|
\****************************/
|
|
/*! no static exports found */
|
|
/***/ (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; }; }(); /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Graphics module
|
|
*/
|
|
|
|
|
|
var _tuiCodeSnippet = __webpack_require__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _fabric = __webpack_require__(/*! fabric */ "fabric");
|
|
|
|
var _fabric2 = _interopRequireDefault(_fabric);
|
|
|
|
var _imageLoader = __webpack_require__(/*! @/component/imageLoader */ "./src/js/component/imageLoader.js");
|
|
|
|
var _imageLoader2 = _interopRequireDefault(_imageLoader);
|
|
|
|
var _cropper = __webpack_require__(/*! @/component/cropper */ "./src/js/component/cropper.js");
|
|
|
|
var _cropper2 = _interopRequireDefault(_cropper);
|
|
|
|
var _flip = __webpack_require__(/*! @/component/flip */ "./src/js/component/flip.js");
|
|
|
|
var _flip2 = _interopRequireDefault(_flip);
|
|
|
|
var _rotation = __webpack_require__(/*! @/component/rotation */ "./src/js/component/rotation.js");
|
|
|
|
var _rotation2 = _interopRequireDefault(_rotation);
|
|
|
|
var _freeDrawing = __webpack_require__(/*! @/component/freeDrawing */ "./src/js/component/freeDrawing.js");
|
|
|
|
var _freeDrawing2 = _interopRequireDefault(_freeDrawing);
|
|
|
|
var _line = __webpack_require__(/*! @/component/line */ "./src/js/component/line.js");
|
|
|
|
var _line2 = _interopRequireDefault(_line);
|
|
|
|
var _text = __webpack_require__(/*! @/component/text */ "./src/js/component/text.js");
|
|
|
|
var _text2 = _interopRequireDefault(_text);
|
|
|
|
var _icon = __webpack_require__(/*! @/component/icon */ "./src/js/component/icon.js");
|
|
|
|
var _icon2 = _interopRequireDefault(_icon);
|
|
|
|
var _filter = __webpack_require__(/*! @/component/filter */ "./src/js/component/filter.js");
|
|
|
|
var _filter2 = _interopRequireDefault(_filter);
|
|
|
|
var _shape = __webpack_require__(/*! @/component/shape */ "./src/js/component/shape.js");
|
|
|
|
var _shape2 = _interopRequireDefault(_shape);
|
|
|
|
var _zoom = __webpack_require__(/*! @/component/zoom */ "./src/js/component/zoom.js");
|
|
|
|
var _zoom2 = _interopRequireDefault(_zoom);
|
|
|
|
var _cropper3 = __webpack_require__(/*! @/drawingMode/cropper */ "./src/js/drawingMode/cropper.js");
|
|
|
|
var _cropper4 = _interopRequireDefault(_cropper3);
|
|
|
|
var _freeDrawing3 = __webpack_require__(/*! @/drawingMode/freeDrawing */ "./src/js/drawingMode/freeDrawing.js");
|
|
|
|
var _freeDrawing4 = _interopRequireDefault(_freeDrawing3);
|
|
|
|
var _lineDrawing = __webpack_require__(/*! @/drawingMode/lineDrawing */ "./src/js/drawingMode/lineDrawing.js");
|
|
|
|
var _lineDrawing2 = _interopRequireDefault(_lineDrawing);
|
|
|
|
var _shape3 = __webpack_require__(/*! @/drawingMode/shape */ "./src/js/drawingMode/shape.js");
|
|
|
|
var _shape4 = _interopRequireDefault(_shape3);
|
|
|
|
var _text3 = __webpack_require__(/*! @/drawingMode/text */ "./src/js/drawingMode/text.js");
|
|
|
|
var _text4 = _interopRequireDefault(_text3);
|
|
|
|
var _icon3 = __webpack_require__(/*! @/drawingMode/icon */ "./src/js/drawingMode/icon.js");
|
|
|
|
var _icon4 = _interopRequireDefault(_icon3);
|
|
|
|
var _zoom3 = __webpack_require__(/*! @/drawingMode/zoom */ "./src/js/drawingMode/zoom.js");
|
|
|
|
var _zoom4 = _interopRequireDefault(_zoom3);
|
|
|
|
var _selectionModifyHelper = __webpack_require__(/*! @/helper/selectionModifyHelper */ "./src/js/helper/selectionModifyHelper.js");
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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 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 EXTRA_PX_FOR_PASTE = 10;
|
|
|
|
var cssOnly = {
|
|
cssOnly: true
|
|
};
|
|
var backstoreOnly = {
|
|
backstoreOnly: true
|
|
};
|
|
|
|
/**
|
|
* Graphics class
|
|
* @class
|
|
* @param {string|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) {
|
|
var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
|
|
cssMaxWidth = _ref.cssMaxWidth,
|
|
cssMaxHeight = _ref.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;
|
|
|
|
/**
|
|
* cropper Selection Style
|
|
* @type {Object}
|
|
*/
|
|
this.cropSelectionStyle = {};
|
|
|
|
/**
|
|
* target fabric object for copy paste feature
|
|
* @type {fabric.Object}
|
|
* @private
|
|
*/
|
|
this.targetObjectForCopyPaste = null;
|
|
|
|
/**
|
|
* 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 = _consts.drawingModes.NORMAL;
|
|
|
|
/**
|
|
* DrawingMode map
|
|
* @type {Object.<string, DrawingMode>}
|
|
* @private
|
|
*/
|
|
this._drawingModeMap = {};
|
|
|
|
/**
|
|
* Component map
|
|
* @type {Object.<string, Component>}
|
|
* @private
|
|
*/
|
|
this._componentMap = {};
|
|
|
|
/**
|
|
* fabric event handlers
|
|
* @type {Object.<string, function>}
|
|
* @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),
|
|
onObjectModified: this._onObjectModified.bind(this),
|
|
onObjectRotated: this._onObjectRotated.bind(this),
|
|
onObjectSelected: this._onObjectSelected.bind(this),
|
|
onPathCreated: this._onPathCreated.bind(this),
|
|
onSelectionCleared: this._onSelectionCleared.bind(this),
|
|
onSelectionCreated: this._onSelectionCreated.bind(this)
|
|
};
|
|
|
|
this._setObjectCachingToFalse();
|
|
this._setCanvasElement(element);
|
|
this._createDrawingModeInstances();
|
|
this._createComponents();
|
|
this._attachCanvasEvents();
|
|
this._attachZoomEvents();
|
|
}
|
|
|
|
/**
|
|
* Destroy canvas element
|
|
*/
|
|
|
|
|
|
_createClass(Graphics, [{
|
|
key: 'destroy',
|
|
value: function destroy() {
|
|
var wrapperEl = this._canvas.wrapperEl;
|
|
|
|
|
|
this._canvas.clear();
|
|
|
|
wrapperEl.parentNode.removeChild(wrapperEl);
|
|
|
|
this._detachZoomEvents();
|
|
}
|
|
|
|
/**
|
|
* Attach zoom events
|
|
*/
|
|
|
|
}, {
|
|
key: '_attachZoomEvents',
|
|
value: function _attachZoomEvents() {
|
|
var zoom = this.getComponent(_consts.componentNames.ZOOM);
|
|
|
|
zoom.attachKeyboardZoomEvents();
|
|
}
|
|
|
|
/**
|
|
* Detach zoom events
|
|
*/
|
|
|
|
}, {
|
|
key: '_detachZoomEvents',
|
|
value: function _detachZoomEvents() {
|
|
var zoom = this.getComponent(_consts.componentNames.ZOOM);
|
|
|
|
zoom.detachKeyboardZoomEvents();
|
|
}
|
|
|
|
/**
|
|
* Deactivates all objects on canvas
|
|
* @returns {Graphics} this
|
|
*/
|
|
|
|
}, {
|
|
key: 'deactivateAll',
|
|
value: function deactivateAll() {
|
|
this._canvas.discardActiveObject();
|
|
|
|
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.discardActiveObject(); // restore states for each objects
|
|
target.forEachObject(function (obj) {
|
|
objects.push(obj);
|
|
canvas.remove(obj);
|
|
});
|
|
} else if (canvas.contains(target)) {
|
|
objects.push(target);
|
|
canvas.remove(target);
|
|
}
|
|
|
|
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._activeObject;
|
|
}
|
|
|
|
/**
|
|
* Returns the object ID to delete the object.
|
|
* @returns {number} object id for remove
|
|
*/
|
|
|
|
}, {
|
|
key: 'getActiveObjectIdForRemove',
|
|
value: function getActiveObjectIdForRemove() {
|
|
var activeObject = this.getActiveObject();
|
|
var type = activeObject.type,
|
|
left = activeObject.left,
|
|
top = activeObject.top;
|
|
|
|
var isSelection = type === 'activeSelection';
|
|
|
|
if (isSelection) {
|
|
var group = new _fabric2.default.Group([].concat(activeObject.getObjects()), {
|
|
left: left,
|
|
top: top
|
|
});
|
|
|
|
return this._addFabricObject(group);
|
|
}
|
|
|
|
return this.getObjectId(activeObject);
|
|
}
|
|
|
|
/**
|
|
* Verify that you are ready to erase the object.
|
|
* @returns {boolean} ready for object remove
|
|
*/
|
|
|
|
}, {
|
|
key: 'isReadyRemoveObject',
|
|
value: function isReadyRemoveObject() {
|
|
var activeObject = this.getActiveObject();
|
|
|
|
return activeObject && !activeObject.isEditing;
|
|
}
|
|
|
|
/**
|
|
* Gets an active group object
|
|
* @returns {Object} active group object instance
|
|
*/
|
|
|
|
}, {
|
|
key: 'getActiveObjects',
|
|
value: function getActiveObjects() {
|
|
var activeObject = this._canvas._activeObject;
|
|
|
|
return activeObject && activeObject.type === 'activeSelection' ? activeObject : null;
|
|
}
|
|
|
|
/**
|
|
* Get Active object Selection from object ids
|
|
* @param {Array.<Object>} objects - fabric objects
|
|
* @returns {Object} target - target object group
|
|
*/
|
|
|
|
}, {
|
|
key: 'getActiveSelectionFromObjects',
|
|
value: function getActiveSelectionFromObjects(objects) {
|
|
var canvas = this.getCanvas();
|
|
|
|
return new _fabric2.default.ActiveSelection(objects, { canvas: canvas });
|
|
}
|
|
|
|
/**
|
|
* Activates an object or group
|
|
* @param {Object} target - target object or group
|
|
*/
|
|
|
|
}, {
|
|
key: 'setActiveObject',
|
|
value: function setActiveObject(target) {
|
|
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
|
|
* @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 <I>'CROPPER', 'FREE_DRAWING', 'LINE', 'TEXT', 'SHAPE'</I>
|
|
* @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(_consts.drawingModes.NORMAL)) {
|
|
return;
|
|
}
|
|
|
|
var drawingModeInstance = this._getDrawingModeInstance(this.getDrawingMode());
|
|
if (drawingModeInstance && drawingModeInstance.end) {
|
|
drawingModeInstance.end(this);
|
|
}
|
|
this._drawingMode = _consts.drawingModes.NORMAL;
|
|
}
|
|
|
|
/**
|
|
* Change zoom of canvas
|
|
* @param {{x: number, y: number}} center - center of zoom
|
|
* @param {number} zoomLevel - zoom level
|
|
*/
|
|
|
|
}, {
|
|
key: 'zoom',
|
|
value: function zoom(_ref2, zoomLevel) {
|
|
var x = _ref2.x,
|
|
y = _ref2.y;
|
|
|
|
var zoom = this.getComponent(_consts.componentNames.ZOOM);
|
|
|
|
zoom.zoom({ x: x, y: y }, zoomLevel);
|
|
}
|
|
|
|
/**
|
|
* Get zoom mode
|
|
* @returns {string}
|
|
*/
|
|
|
|
}, {
|
|
key: 'getZoomMode',
|
|
value: function getZoomMode() {
|
|
var zoom = this.getComponent(_consts.componentNames.ZOOM);
|
|
|
|
return zoom.mode;
|
|
}
|
|
|
|
/**
|
|
* Start zoom-in mode
|
|
*/
|
|
|
|
}, {
|
|
key: 'startZoomInMode',
|
|
value: function startZoomInMode() {
|
|
var zoom = this.getComponent(_consts.componentNames.ZOOM);
|
|
|
|
zoom.startZoomInMode();
|
|
}
|
|
|
|
/**
|
|
* Stop zoom-in mode
|
|
*/
|
|
|
|
}, {
|
|
key: 'endZoomInMode',
|
|
value: function endZoomInMode() {
|
|
var zoom = this.getComponent(_consts.componentNames.ZOOM);
|
|
|
|
zoom.endZoomInMode();
|
|
}
|
|
|
|
/**
|
|
* Zoom out one step
|
|
*/
|
|
|
|
}, {
|
|
key: 'zoomOut',
|
|
value: function zoomOut() {
|
|
var zoom = this.getComponent(_consts.componentNames.ZOOM);
|
|
|
|
zoom.zoomOut();
|
|
}
|
|
|
|
/**
|
|
* Start hand mode
|
|
*/
|
|
|
|
}, {
|
|
key: 'startHandMode',
|
|
value: function startHandMode() {
|
|
var zoom = this.getComponent(_consts.componentNames.ZOOM);
|
|
|
|
zoom.startHandMode();
|
|
}
|
|
|
|
/**
|
|
* Stop hand mode
|
|
*/
|
|
|
|
}, {
|
|
key: 'endHandMode',
|
|
value: function endHandMode() {
|
|
var zoom = this.getComponent(_consts.componentNames.ZOOM);
|
|
|
|
zoom.endHandMode();
|
|
}
|
|
|
|
/**
|
|
* Zoom reset
|
|
*/
|
|
|
|
}, {
|
|
key: 'resetZoom',
|
|
value: function resetZoom() {
|
|
var zoom = this.getComponent(_consts.componentNames.ZOOM);
|
|
|
|
zoom.resetZoom();
|
|
}
|
|
|
|
/**
|
|
* To data url from canvas
|
|
* @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(options) {
|
|
var cropper = this.getComponent(_consts.componentNames.CROPPER);
|
|
cropper.changeVisibility(false);
|
|
|
|
var dataUrl = this._canvas && this._canvas.toDataURL(options);
|
|
cropper.changeVisibility(true);
|
|
|
|
return dataUrl;
|
|
}
|
|
|
|
/**
|
|
* 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}
|
|
*/
|
|
|
|
}, {
|
|
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 _util.Promise(function (resolve) {
|
|
_fabric2.default.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(_consts.componentNames.CROPPER).getCropzoneRect();
|
|
}
|
|
|
|
/**
|
|
* Get cropped rect
|
|
* @param {number} [mode] cropzone rect mode
|
|
*/
|
|
|
|
}, {
|
|
key: 'setCropzoneRect',
|
|
value: function setCropzoneRect(mode) {
|
|
this.getComponent(_consts.componentNames.CROPPER).setCropzoneRect(mode);
|
|
}
|
|
|
|
/**
|
|
* 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(_consts.componentNames.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 = _consts.componentNames.FREE_DRAWING;
|
|
|
|
if (drawingMode === _consts.drawingModes.LINE_DRAWING) {
|
|
compName = _consts.componentNames.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 {(ShapeFillOption | string)} [options.fill] - {@link ShapeFillOption} or
|
|
* 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(_consts.componentNames.SHAPE).setStates(type, options);
|
|
}
|
|
|
|
/**
|
|
* Set style of current drawing icon
|
|
* @param {string} type - icon type (ex: 'icon-arrow', 'icon-star')
|
|
* @param {Object} [iconColor] - Icon color
|
|
*/
|
|
|
|
}, {
|
|
key: 'setIconStyle',
|
|
value: function setIconStyle(type, iconColor) {
|
|
this.getComponent(_consts.componentNames.ICON).setStates(type, iconColor);
|
|
}
|
|
|
|
/**
|
|
* 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(_consts.componentNames.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
|
|
* @returns {boolean} true if it has the filter
|
|
*/
|
|
|
|
}, {
|
|
key: 'hasFilter',
|
|
value: function hasFilter(type) {
|
|
return this.getComponent(_consts.componentNames.FILTER).hasFilter(type);
|
|
}
|
|
|
|
/**
|
|
* Set selection style of fabric object by init option
|
|
* @param {Object} styles - Selection styles
|
|
*/
|
|
|
|
}, {
|
|
key: 'setSelectionStyle',
|
|
value: function setSelectionStyle(styles) {
|
|
extend(_consts.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.textDecoration] Type of line (underline / line-through / overline)
|
|
* @returns {Object} applied properties
|
|
*/
|
|
|
|
}, {
|
|
key: 'setObjectProperties',
|
|
value: function setObjectProperties(id, props) {
|
|
var object = this.getObject(id);
|
|
var clone = extend({}, props);
|
|
|
|
object.set(clone);
|
|
|
|
object.setCoords();
|
|
|
|
this.getCanvas().renderAll();
|
|
|
|
return clone;
|
|
}
|
|
|
|
/**
|
|
* Get object properties corresponding key
|
|
* @param {number} id - object id
|
|
* @param {Array<string>|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
|
|
});
|
|
|
|
targetObj.setCoords();
|
|
|
|
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
|
|
};
|
|
}
|
|
|
|
/**
|
|
* Create fabric static canvas
|
|
* @returns {Object} {{width: number, height: number}} image size
|
|
*/
|
|
|
|
}, {
|
|
key: 'createStaticCanvas',
|
|
value: function createStaticCanvas() {
|
|
var staticCanvas = new _fabric2.default.StaticCanvas();
|
|
|
|
staticCanvas.set({
|
|
enableRetinaScaling: false
|
|
});
|
|
|
|
return staticCanvas;
|
|
}
|
|
|
|
/**
|
|
* 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 object caching to false. This brought many bugs when draw Shape & cropzone
|
|
* @see http://fabricjs.com/fabric-object-caching
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_setObjectCachingToFalse',
|
|
value: function _setObjectCachingToFalse() {
|
|
_fabric2.default.Object.prototype.objectCaching = false;
|
|
}
|
|
|
|
/**
|
|
* Set canvas element to fabric.Canvas
|
|
* @param {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.nodeType) {
|
|
selectedElement = element;
|
|
} else {
|
|
selectedElement = document.querySelector(element);
|
|
}
|
|
|
|
if (selectedElement.nodeName.toUpperCase() !== 'CANVAS') {
|
|
canvasElement = document.createElement('canvas');
|
|
selectedElement.appendChild(canvasElement);
|
|
}
|
|
|
|
this._canvas = new _fabric2.default.Canvas(canvasElement, {
|
|
containerClass: 'tui-image-editor-canvas-container',
|
|
containerId: 'canvas1',
|
|
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());
|
|
this._register(this._drawingModeMap, new _icon4.default());
|
|
this._register(this._drawingModeMap, new _zoom4.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));
|
|
this._register(this._componentMap, new _zoom2.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(_consts.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:modified': handler.onObjectModified,
|
|
'object:rotating': handler.onObjectRotated,
|
|
'path:created': handler.onPathCreated,
|
|
'selection:cleared': handler.onSelectionCleared,
|
|
'selection:created': handler.onSelectionCreated,
|
|
'selection:updated': handler.onObjectSelected
|
|
});
|
|
}
|
|
|
|
/**
|
|
* "mouse:down" canvas event handler
|
|
* @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onMouseDown',
|
|
value: function _onMouseDown(fEvent) {
|
|
var _this2 = this;
|
|
|
|
var event = fEvent.e,
|
|
target = fEvent.target;
|
|
|
|
var originPointer = this._canvas.getPointer(event);
|
|
|
|
if (target) {
|
|
var type = target.type;
|
|
|
|
var undoData = (0, _selectionModifyHelper.makeSelectionUndoData)(target, function (item) {
|
|
return (0, _selectionModifyHelper.makeSelectionUndoDatum)(_this2.getObjectId(item), item, type === 'activeSelection');
|
|
});
|
|
|
|
(0, _selectionModifyHelper.setCachedUndoDataForDimension)(undoData);
|
|
}
|
|
|
|
this.fire(_consts.eventNames.MOUSE_DOWN, event, 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 _this3 = this;
|
|
|
|
this._lazyFire(_consts.eventNames.OBJECT_MOVED, function (object) {
|
|
return _this3.createObjectProperties(object);
|
|
}, fEvent.target);
|
|
}
|
|
|
|
/**
|
|
* "object:scaling" canvas event handler
|
|
* @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onObjectScaled',
|
|
value: function _onObjectScaled(fEvent) {
|
|
var _this4 = this;
|
|
|
|
this._lazyFire(_consts.eventNames.OBJECT_SCALED, function (object) {
|
|
return _this4.createObjectProperties(object);
|
|
}, fEvent.target);
|
|
}
|
|
|
|
/**
|
|
* "object:modified" canvas event handler
|
|
* @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onObjectModified',
|
|
value: function _onObjectModified(fEvent) {
|
|
var target = fEvent.target;
|
|
|
|
if (target.type === 'activeSelection') {
|
|
var items = target.getObjects();
|
|
|
|
items.forEach(function (item) {
|
|
return item.fire('modifiedInGroup', target);
|
|
});
|
|
}
|
|
|
|
this.fire(_consts.eventNames.OBJECT_MODIFIED, target, this.getObjectId(target));
|
|
}
|
|
|
|
/**
|
|
* "object:rotating" canvas event handler
|
|
* @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onObjectRotated',
|
|
value: function _onObjectRotated(fEvent) {
|
|
var _this5 = this;
|
|
|
|
this._lazyFire(_consts.eventNames.OBJECT_ROTATED, function (object) {
|
|
return _this5.createObjectProperties(object);
|
|
}, fEvent.target);
|
|
}
|
|
|
|
/**
|
|
* Lazy event emitter
|
|
* @param {string} eventName - event name
|
|
* @param {Function} paramsMaker - make param function
|
|
* @param {Object} [target] - Object of the event owner.
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_lazyFire',
|
|
value: function _lazyFire(eventName, paramsMaker, target) {
|
|
var _this6 = this;
|
|
|
|
var existEventDelegation = target && target.canvasEventDelegation;
|
|
var delegationState = existEventDelegation ? target.canvasEventDelegation(eventName) : 'none';
|
|
|
|
if (delegationState === 'unregistered') {
|
|
target.canvasEventRegister(eventName, function (object) {
|
|
_this6.fire(eventName, paramsMaker(object));
|
|
});
|
|
}
|
|
|
|
if (delegationState === 'none') {
|
|
this.fire(eventName, paramsMaker(target));
|
|
}
|
|
}
|
|
|
|
/**
|
|
* "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(_consts.eventNames.OBJECT_ACTIVATED, params);
|
|
}
|
|
|
|
/**
|
|
* "path:created" canvas event handler
|
|
* @param {{path: fabric.Path}} obj - Path object
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onPathCreated',
|
|
value: function _onPathCreated(obj) {
|
|
var _obj$path$getCenterPo = obj.path.getCenterPoint(),
|
|
left = _obj$path$getCenterPo.x,
|
|
top = _obj$path$getCenterPo.y;
|
|
|
|
obj.path.set(extend({
|
|
left: left,
|
|
top: top
|
|
}, _consts.fObjectOptions.SELECTION_STYLE));
|
|
|
|
var params = this.createObjectProperties(obj.path);
|
|
|
|
this.fire(_consts.eventNames.ADD_OBJECT, params);
|
|
}
|
|
|
|
/**
|
|
* "selction:cleared" canvas event handler
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onSelectionCleared',
|
|
value: function _onSelectionCleared() {
|
|
this.fire(_consts.eventNames.SELECTION_CLEARED);
|
|
}
|
|
|
|
/**
|
|
* "selction:created" canvas event handler
|
|
* @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onSelectionCreated',
|
|
value: function _onSelectionCreated(fEvent) {
|
|
var target = fEvent.target;
|
|
|
|
var params = this.createObjectProperties(target);
|
|
|
|
this.fire(_consts.eventNames.OBJECT_ACTIVATED, params);
|
|
this.fire(_consts.eventNames.SELECTION_CREATED, fEvent.target);
|
|
}
|
|
|
|
/**
|
|
* Canvas discard selection all
|
|
*/
|
|
|
|
}, {
|
|
key: 'discardSelection',
|
|
value: function discardSelection() {
|
|
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
|
|
* @returns {Object} properties object
|
|
*/
|
|
|
|
}, {
|
|
key: 'createObjectProperties',
|
|
value: function createObjectProperties(obj) {
|
|
var predefinedKeys = ['left', 'top', 'width', 'height', 'fill', 'stroke', 'strokeWidth', 'opacity', 'angle'];
|
|
var props = {
|
|
id: stamp(obj),
|
|
type: obj.type
|
|
};
|
|
|
|
extend(props, (0, _util.getProperties)(obj, predefinedKeys));
|
|
|
|
if ((0, _util.includes)(['i-text', 'text'], obj.type)) {
|
|
extend(props, this._createTextProperties(obj, props));
|
|
} else if ((0, _util.includes)(['rect', 'triangle', 'circle'], obj.type)) {
|
|
var shapeComp = this.getComponent(_consts.componentNames.SHAPE);
|
|
extend(props, {
|
|
fill: shapeComp.makeFillPropertyForUserEvent(obj)
|
|
});
|
|
}
|
|
|
|
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', 'fontWeight'];
|
|
var props = {};
|
|
extend(props, (0, _util.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];
|
|
}
|
|
|
|
/**
|
|
* Reset targetObjectForCopyPaste value from activeObject
|
|
*/
|
|
|
|
}, {
|
|
key: 'resetTargetObjectForCopyPaste',
|
|
value: function resetTargetObjectForCopyPaste() {
|
|
var activeObject = this.getActiveObject();
|
|
|
|
if (activeObject) {
|
|
this.targetObjectForCopyPaste = activeObject;
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Paste fabric object
|
|
* @returns {Promise}
|
|
*/
|
|
|
|
}, {
|
|
key: 'pasteObject',
|
|
value: function pasteObject() {
|
|
var _this7 = this;
|
|
|
|
if (!this.targetObjectForCopyPaste) {
|
|
return _util.Promise.resolve([]);
|
|
}
|
|
|
|
var targetObject = this.targetObjectForCopyPaste;
|
|
var isGroupSelect = targetObject.type === 'activeSelection';
|
|
var targetObjects = isGroupSelect ? targetObject.getObjects() : [targetObject];
|
|
var newTargetObject = null;
|
|
|
|
this.discardSelection();
|
|
|
|
return this._cloneObject(targetObjects).then(function (addedObjects) {
|
|
if (addedObjects.length > 1) {
|
|
newTargetObject = _this7.getActiveSelectionFromObjects(addedObjects);
|
|
} else {
|
|
newTargetObject = addedObjects[0];
|
|
}
|
|
_this7.targetObjectForCopyPaste = newTargetObject;
|
|
_this7.setActiveObject(newTargetObject);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Clone object
|
|
* @param {fabric.Object} targetObjects - fabric object
|
|
* @returns {Promise}
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_cloneObject',
|
|
value: function _cloneObject(targetObjects) {
|
|
var _this8 = this;
|
|
|
|
var addedObjects = _tuiCodeSnippet2.default.map(targetObjects, function (targetObject) {
|
|
return _this8._cloneObjectItem(targetObject);
|
|
});
|
|
|
|
return _util.Promise.all(addedObjects);
|
|
}
|
|
|
|
/**
|
|
* Clone object one item
|
|
* @param {fabric.Object} targetObject - fabric object
|
|
* @returns {Promise}
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_cloneObjectItem',
|
|
value: function _cloneObjectItem(targetObject) {
|
|
var _this9 = this;
|
|
|
|
return this._copyFabricObjectForPaste(targetObject).then(function (clonedObject) {
|
|
var objectProperties = _this9.createObjectProperties(clonedObject);
|
|
_this9.add(clonedObject);
|
|
|
|
_this9.fire(_consts.eventNames.ADD_OBJECT, objectProperties);
|
|
|
|
return clonedObject;
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Copy fabric object with Changed position for copy and paste
|
|
* @param {fabric.Object} targetObject - fabric object
|
|
* @returns {Promise}
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_copyFabricObjectForPaste',
|
|
value: function _copyFabricObjectForPaste(targetObject) {
|
|
var _this10 = this;
|
|
|
|
var addExtraPx = function addExtraPx(value, isReverse) {
|
|
return isReverse ? value - EXTRA_PX_FOR_PASTE : value + EXTRA_PX_FOR_PASTE;
|
|
};
|
|
|
|
return this._copyFabricObject(targetObject).then(function (clonedObject) {
|
|
var left = clonedObject.left,
|
|
top = clonedObject.top,
|
|
width = clonedObject.width,
|
|
height = clonedObject.height;
|
|
|
|
var _getCanvasSize = _this10.getCanvasSize(),
|
|
canvasWidth = _getCanvasSize.width,
|
|
canvasHeight = _getCanvasSize.height;
|
|
|
|
var rightEdge = left + width / 2;
|
|
var bottomEdge = top + height / 2;
|
|
|
|
clonedObject.set(_tuiCodeSnippet2.default.extend({
|
|
left: addExtraPx(left, rightEdge + EXTRA_PX_FOR_PASTE > canvasWidth),
|
|
top: addExtraPx(top, bottomEdge + EXTRA_PX_FOR_PASTE > canvasHeight)
|
|
}, _consts.fObjectOptions.SELECTION_STYLE));
|
|
|
|
return clonedObject;
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Copy fabric object
|
|
* @param {fabric.Object} targetObject - fabric object
|
|
* @returns {Promise}
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_copyFabricObject',
|
|
value: function _copyFabricObject(targetObject) {
|
|
var _this11 = this;
|
|
|
|
return new _util.Promise(function (resolve) {
|
|
targetObject.clone(function (cloned) {
|
|
var shapeComp = _this11.getComponent(_consts.componentNames.SHAPE);
|
|
if ((0, _util.isShape)(cloned)) {
|
|
shapeComp.processForCopiedObject(cloned, targetObject);
|
|
}
|
|
|
|
resolve(cloned);
|
|
});
|
|
});
|
|
}
|
|
}]);
|
|
|
|
return Graphics;
|
|
}();
|
|
|
|
CustomEvents.mixin(Graphics);
|
|
|
|
exports.default = Graphics;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/helper/imagetracer.js":
|
|
/*!**************************************!*\
|
|
!*** ./src/js/helper/imagetracer.js ***!
|
|
\**************************************/
|
|
/*! no static exports found */
|
|
/***/ (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; }; }();
|
|
|
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
|
|
/*
|
|
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 */
|
|
|
|
}]);
|
|
|
|
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 }]
|
|
}
|
|
};
|
|
|
|
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]]];
|
|
|
|
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]];
|
|
|
|
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 }];
|
|
}
|
|
|
|
_createClass(ImageTracer, [{
|
|
key: 'imageToSVG',
|
|
value: function imageToSVG(url, callback, options) {
|
|
var _this = this;
|
|
|
|
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);
|
|
|
|
return this.getsvgstring(td, options);
|
|
}
|
|
}, {
|
|
key: 'imageToTracedata',
|
|
value: function imageToTracedata(url, callback, options) {
|
|
var _this2 = this;
|
|
|
|
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
|
|
};
|
|
|
|
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
|
|
};
|
|
}
|
|
|
|
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 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 };
|
|
}
|
|
|
|
for (j = 0; j < imgd.height; j += 1) {
|
|
for (i = 0; i < imgd.width; i += 1) {
|
|
idx = (j * imgd.width + i) * 4;
|
|
|
|
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]
|
|
});
|
|
}
|
|
|
|
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 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);
|
|
}
|
|
}
|
|
|
|
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;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
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 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)
|
|
});
|
|
}
|
|
}
|
|
|
|
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;
|
|
}
|
|
|
|
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);
|
|
}
|
|
|
|
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;
|
|
}
|
|
|
|
smp.segments = smp.segments.concat(this.fitseq(path, ltres, qtres, pcnt, seqend));
|
|
|
|
if (seqend > 0) {
|
|
pcnt = seqend;
|
|
} else {
|
|
pcnt = path.points.length;
|
|
}
|
|
}
|
|
|
|
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;
|
|
|
|
return this.fitseq(path, ltres, qtres, seqstart, splitpoint).concat(this.fitseq(path, ltres, qtres, splitpoint, seqend));
|
|
}
|
|
}, {
|
|
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));
|
|
}
|
|
|
|
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);
|
|
}
|
|
|
|
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 = '<path ' + (options.desc ? 'desc="l ' + lnum + ' p ' + pathnum + '" ' : '') + this.tosvgcolorstr(tracedata.palette[lnum], options) + 'd="';
|
|
if (options.roundcoords === -1) {
|
|
str += 'M ' + smp.segments[0].x1 * options.scale + ' ' + smp.segments[0].y1 * options.scale + ' ';
|
|
for (pcnt = 0; pcnt < smp.segments.length; pcnt++) {
|
|
str += smp.segments[pcnt].type + ' ' + smp.segments[pcnt].x2 * options.scale + ' ' + smp.segments[pcnt].y2 * options.scale + ' ';
|
|
if (smp.segments[pcnt].hasOwnProperty('x3')) {
|
|
str += smp.segments[pcnt].x3 * options.scale + ' ' + smp.segments[pcnt].y3 * options.scale + ' ';
|
|
}
|
|
}
|
|
str += 'Z ';
|
|
} else {
|
|
str += 'M ' + this.roundtodec(smp.segments[0].x1 * options.scale, options.roundcoords) + ' ' + this.roundtodec(smp.segments[0].y1 * options.scale, options.roundcoords) + ' ';
|
|
for (pcnt = 0; pcnt < smp.segments.length; pcnt++) {
|
|
str += smp.segments[pcnt].type + ' ' + this.roundtodec(smp.segments[pcnt].x2 * options.scale, options.roundcoords) + ' ' + this.roundtodec(smp.segments[pcnt].y2 * options.scale, options.roundcoords) + ' ';
|
|
if (smp.segments[pcnt].hasOwnProperty('x3')) {
|
|
str += this.roundtodec(smp.segments[pcnt].x3 * options.scale, options.roundcoords) + ' ' + this.roundtodec(smp.segments[pcnt].y3 * options.scale, options.roundcoords) + ' ';
|
|
}
|
|
}
|
|
str += 'Z ';
|
|
}
|
|
for (var hcnt = 0; hcnt < smp.holechildren.length; hcnt++) {
|
|
var hsmp = layer[smp.holechildren[hcnt]];
|
|
|
|
if (options.roundcoords === -1) {
|
|
if (hsmp.segments[hsmp.segments.length - 1].hasOwnProperty('x3')) {
|
|
str += 'M ' + hsmp.segments[hsmp.segments.length - 1].x3 * options.scale + ' ' + hsmp.segments[hsmp.segments.length - 1].y3 * options.scale + ' ';
|
|
} else {
|
|
str += 'M ' + hsmp.segments[hsmp.segments.length - 1].x2 * options.scale + ' ' + hsmp.segments[hsmp.segments.length - 1].y2 * options.scale + ' ';
|
|
}
|
|
for (pcnt = hsmp.segments.length - 1; pcnt >= 0; pcnt--) {
|
|
str += hsmp.segments[pcnt].type + ' ';
|
|
if (hsmp.segments[pcnt].hasOwnProperty('x3')) {
|
|
str += hsmp.segments[pcnt].x2 * options.scale + ' ' + hsmp.segments[pcnt].y2 * options.scale + ' ';
|
|
}
|
|
str += hsmp.segments[pcnt].x1 * options.scale + ' ' + hsmp.segments[pcnt].y1 * options.scale + ' ';
|
|
}
|
|
} else {
|
|
if (hsmp.segments[hsmp.segments.length - 1].hasOwnProperty('x3')) {
|
|
str += 'M ' + this.roundtodec(hsmp.segments[hsmp.segments.length - 1].x3 * options.scale) + ' ' + this.roundtodec(hsmp.segments[hsmp.segments.length - 1].y3 * options.scale) + ' ';
|
|
} else {
|
|
str += 'M ' + this.roundtodec(hsmp.segments[hsmp.segments.length - 1].x2 * options.scale) + ' ' + this.roundtodec(hsmp.segments[hsmp.segments.length - 1].y2 * options.scale) + ' ';
|
|
}
|
|
for (pcnt = hsmp.segments.length - 1; pcnt >= 0; pcnt--) {
|
|
str += hsmp.segments[pcnt].type + ' ';
|
|
if (hsmp.segments[pcnt].hasOwnProperty('x3')) {
|
|
str += this.roundtodec(hsmp.segments[pcnt].x2 * options.scale) + ' ' + this.roundtodec(hsmp.segments[pcnt].y2 * options.scale) + ' ';
|
|
}
|
|
str += this.roundtodec(hsmp.segments[pcnt].x1 * options.scale) + ' ' + this.roundtodec(hsmp.segments[pcnt].y1 * options.scale) + ' ';
|
|
}
|
|
}
|
|
str += 'Z ';
|
|
}
|
|
str += '" />';
|
|
if (options.lcpr || options.qcpr) {
|
|
for (pcnt = 0; pcnt < smp.segments.length; pcnt++) {
|
|
if (smp.segments[pcnt].hasOwnProperty('x3') && options.qcpr) {
|
|
str += '<circle cx="' + smp.segments[pcnt].x2 * options.scale + '" cy="' + smp.segments[pcnt].y2 * options.scale + '" r="' + options.qcpr + '" fill="cyan" stroke-width="' + options.qcpr * 0.2 + '" stroke="black" />';
|
|
str += '<circle cx="' + smp.segments[pcnt].x3 * options.scale + '" cy="' + smp.segments[pcnt].y3 * options.scale + '" r="' + options.qcpr + '" fill="white" stroke-width="' + options.qcpr * 0.2 + '" stroke="black" />';
|
|
str += '<line x1="' + smp.segments[pcnt].x1 * options.scale + '" y1="' + smp.segments[pcnt].y1 * options.scale + '" x2="' + smp.segments[pcnt].x2 * options.scale + '" y2="' + smp.segments[pcnt].y2 * options.scale + '" stroke-width="' + options.qcpr * 0.2 + '" stroke="cyan" />';
|
|
str += '<line x1="' + smp.segments[pcnt].x2 * options.scale + '" y1="' + smp.segments[pcnt].y2 * options.scale + '" x2="' + smp.segments[pcnt].x3 * options.scale + '" y2="' + smp.segments[pcnt].y3 * options.scale + '" stroke-width="' + options.qcpr * 0.2 + '" stroke="cyan" />';
|
|
}
|
|
if (!smp.segments[pcnt].hasOwnProperty('x3') && options.lcpr) {
|
|
str += '<circle cx="' + smp.segments[pcnt].x2 * options.scale + '" cy="' + smp.segments[pcnt].y2 * options.scale + '" r="' + options.lcpr + '" fill="white" stroke-width="' + options.lcpr * 0.2 + '" stroke="black" />';
|
|
}
|
|
}
|
|
|
|
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 += '<circle cx="' + hsmp.segments[pcnt].x2 * options.scale + '" cy="' + hsmp.segments[pcnt].y2 * options.scale + '" r="' + options.qcpr + '" fill="cyan" stroke-width="' + options.qcpr * 0.2 + '" stroke="black" />';
|
|
str += '<circle cx="' + hsmp.segments[pcnt].x3 * options.scale + '" cy="' + hsmp.segments[pcnt].y3 * options.scale + '" r="' + options.qcpr + '" fill="white" stroke-width="' + options.qcpr * 0.2 + '" stroke="black" />';
|
|
str += '<line x1="' + hsmp.segments[pcnt].x1 * options.scale + '" y1="' + hsmp.segments[pcnt].y1 * options.scale + '" x2="' + hsmp.segments[pcnt].x2 * options.scale + '" y2="' + hsmp.segments[pcnt].y2 * options.scale + '" stroke-width="' + options.qcpr * 0.2 + '" stroke="cyan" />';
|
|
str += '<line x1="' + hsmp.segments[pcnt].x2 * options.scale + '" y1="' + hsmp.segments[pcnt].y2 * options.scale + '" x2="' + hsmp.segments[pcnt].x3 * options.scale + '" y2="' + hsmp.segments[pcnt].y3 * options.scale + '" stroke-width="' + options.qcpr * 0.2 + '" stroke="cyan" />';
|
|
}
|
|
if (!hsmp.segments[pcnt].hasOwnProperty('x3') && options.lcpr) {
|
|
str += '<circle cx="' + hsmp.segments[pcnt].x2 * options.scale + '" cy="' + hsmp.segments[pcnt].y2 * options.scale + '" r="' + options.lcpr + '" fill="white" stroke-width="' + options.lcpr * 0.2 + '" stroke="black" />';
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
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 = '<svg ' + (options.viewbox ? 'viewBox="0 0 ' + w + ' ' + h + '" ' : 'width="' + w + '" height="' + h + '" ') + 'version="1.1" xmlns="http://www.w3.org/2000/svg" desc="Created with imagetracer.js version ' + this.versionnumber + '" >';
|
|
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 += '</svg>';
|
|
|
|
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];
|
|
}
|
|
}
|
|
|
|
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];
|
|
}
|
|
}
|
|
|
|
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;
|
|
|
|
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]);
|
|
|
|
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];
|
|
}
|
|
}
|
|
}
|
|
|
|
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');
|
|
|
|
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);
|
|
}
|
|
}
|
|
}]);
|
|
|
|
return ImageTracer;
|
|
}();
|
|
|
|
exports.default = ImageTracer;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/helper/selectionModifyHelper.js":
|
|
/*!************************************************!*\
|
|
!*** ./src/js/helper/selectionModifyHelper.js ***!
|
|
\************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
exports.setCachedUndoDataForDimension = setCachedUndoDataForDimension;
|
|
exports.getCachedUndoDataForDimension = getCachedUndoDataForDimension;
|
|
exports.makeSelectionUndoData = makeSelectionUndoData;
|
|
exports.makeSelectionUndoDatum = makeSelectionUndoDatum;
|
|
|
|
var _tuiCodeSnippet = __webpack_require__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
/**
|
|
* Cached selection's info
|
|
* @type {Array}
|
|
* @private
|
|
*/
|
|
var cachedUndoDataForChangeDimension = null;
|
|
|
|
/**
|
|
* Set cached undo data
|
|
* @param {Array} undoData - selection object
|
|
* @private
|
|
*/
|
|
/**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Selection modification helper
|
|
*/
|
|
|
|
function setCachedUndoDataForDimension(undoData) {
|
|
cachedUndoDataForChangeDimension = undoData;
|
|
}
|
|
|
|
/**
|
|
* Get cached undo data
|
|
* @returns {Object} cached undo data
|
|
* @private
|
|
*/
|
|
function getCachedUndoDataForDimension() {
|
|
return cachedUndoDataForChangeDimension;
|
|
}
|
|
|
|
/**
|
|
* Make undo data
|
|
* @param {fabric.Object} obj - selection object
|
|
* @param {Function} undoDatumMaker - make undo datum
|
|
* @returns {Array} undoData
|
|
* @private
|
|
*/
|
|
function makeSelectionUndoData(obj, undoDatumMaker) {
|
|
var undoData = void 0;
|
|
|
|
if (obj.type === 'activeSelection') {
|
|
undoData = obj.getObjects().map(function (item) {
|
|
var angle = item.angle,
|
|
left = item.left,
|
|
top = item.top,
|
|
scaleX = item.scaleX,
|
|
scaleY = item.scaleY,
|
|
width = item.width,
|
|
height = item.height;
|
|
|
|
|
|
obj.realizeTransform(item);
|
|
var result = undoDatumMaker(item);
|
|
|
|
item.set({
|
|
angle: angle,
|
|
left: left,
|
|
top: top,
|
|
width: width,
|
|
height: height,
|
|
scaleX: scaleX,
|
|
scaleY: scaleY
|
|
});
|
|
|
|
return result;
|
|
});
|
|
} else {
|
|
undoData = [undoDatumMaker(obj)];
|
|
}
|
|
|
|
return undoData;
|
|
}
|
|
|
|
/**
|
|
* Make undo datum
|
|
* @param {number} id - object id
|
|
* @param {fabric.Object} obj - selection object
|
|
* @param {boolean} isSelection - whether or not object is selection
|
|
* @returns {Object} undo datum
|
|
* @private
|
|
*/
|
|
function makeSelectionUndoDatum(id, obj, isSelection) {
|
|
return isSelection ? {
|
|
id: id,
|
|
width: obj.width,
|
|
height: obj.height,
|
|
top: obj.top,
|
|
left: obj.left,
|
|
angle: obj.angle,
|
|
scaleX: obj.scaleX,
|
|
scaleY: obj.scaleY
|
|
} : (0, _tuiCodeSnippet.extend)({ id: id }, obj);
|
|
}
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/helper/shapeFilterFillHelper.js":
|
|
/*!************************************************!*\
|
|
!*** ./src/js/helper/shapeFilterFillHelper.js ***!
|
|
\************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
exports.getFillImageFromShape = getFillImageFromShape;
|
|
exports.rePositionFilterTypeFillImage = rePositionFilterTypeFillImage;
|
|
exports.makeFilterOptionFromFabricImage = makeFilterOptionFromFabricImage;
|
|
exports.makeFillPatternForFilter = makeFillPatternForFilter;
|
|
exports.resetFillPatternCanvas = resetFillPatternCanvas;
|
|
exports.reMakePatternImageSource = reMakePatternImageSource;
|
|
exports.getCachedCanvasImageElement = getCachedCanvasImageElement;
|
|
|
|
var _tuiCodeSnippet = __webpack_require__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _shapeResizeHelper = __webpack_require__(/*! @/helper/shapeResizeHelper */ "./src/js/helper/shapeResizeHelper.js");
|
|
|
|
var _shapeResizeHelper2 = _interopRequireDefault(_shapeResizeHelper);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Shape resize helper
|
|
*/
|
|
|
|
|
|
var FILTER_OPTION_MAP = {
|
|
pixelate: 'blocksize',
|
|
blur: 'blur'
|
|
};
|
|
var POSITION_DIMENSION_MAP = {
|
|
x: 'width',
|
|
y: 'height'
|
|
};
|
|
|
|
var FILTER_NAME_VALUE_MAP = (0, _util.flipObject)(FILTER_OPTION_MAP);
|
|
|
|
/**
|
|
* Cached canvas image element for fill image
|
|
* @type {boolean}
|
|
* @private
|
|
*/
|
|
var cachedCanvasImageElement = null;
|
|
|
|
/**
|
|
* Get background image of fill
|
|
* @param {fabric.Object} shapeObj - Shape object
|
|
* @returns {fabric.Image}
|
|
* @private
|
|
*/
|
|
function getFillImageFromShape(shapeObj) {
|
|
var _getCustomProperty = (0, _util.getCustomProperty)(shapeObj, 'patternSourceCanvas'),
|
|
patternSourceCanvas = _getCustomProperty.patternSourceCanvas;
|
|
|
|
var _patternSourceCanvas$ = patternSourceCanvas.getObjects(),
|
|
fillImage = _patternSourceCanvas$[0];
|
|
|
|
return fillImage;
|
|
}
|
|
|
|
/**
|
|
* Reset the image position in the filter type fill area.
|
|
* @param {fabric.Object} shapeObj - Shape object
|
|
* @private
|
|
*/
|
|
function rePositionFilterTypeFillImage(shapeObj) {
|
|
var angle = shapeObj.angle,
|
|
flipX = shapeObj.flipX,
|
|
flipY = shapeObj.flipY;
|
|
|
|
var fillImage = getFillImageFromShape(shapeObj);
|
|
var rotatedShapeCornerDimension = getRotatedDimension(shapeObj);
|
|
var right = rotatedShapeCornerDimension.right,
|
|
bottom = rotatedShapeCornerDimension.bottom;
|
|
var width = rotatedShapeCornerDimension.width,
|
|
height = rotatedShapeCornerDimension.height;
|
|
|
|
var diffLeft = (width - shapeObj.width) / 2;
|
|
var diffTop = (height - shapeObj.height) / 2;
|
|
var cropX = shapeObj.left - shapeObj.width / 2 - diffLeft;
|
|
var cropY = shapeObj.top - shapeObj.height / 2 - diffTop;
|
|
var left = width / 2 - diffLeft;
|
|
var top = height / 2 - diffTop;
|
|
var fillImageMaxSize = Math.max(width, height) + Math.max(diffLeft, diffTop);
|
|
|
|
var _calculateFillImageDi = calculateFillImageDimensionOutsideCanvas({
|
|
shapeObj: shapeObj,
|
|
left: left,
|
|
top: top,
|
|
width: width,
|
|
height: height,
|
|
cropX: cropX,
|
|
cropY: cropY,
|
|
flipX: flipX,
|
|
flipY: flipY,
|
|
right: right,
|
|
bottom: bottom
|
|
});
|
|
|
|
left = _calculateFillImageDi[0];
|
|
top = _calculateFillImageDi[1];
|
|
width = _calculateFillImageDi[2];
|
|
height = _calculateFillImageDi[3];
|
|
|
|
|
|
fillImage.set({
|
|
angle: flipX === flipY ? -angle : angle,
|
|
left: left,
|
|
top: top,
|
|
width: width,
|
|
height: height,
|
|
cropX: cropX,
|
|
cropY: cropY,
|
|
flipX: flipX,
|
|
flipY: flipY
|
|
});
|
|
|
|
(0, _util.setCustomProperty)(fillImage, { fillImageMaxSize: fillImageMaxSize });
|
|
}
|
|
|
|
/**
|
|
* Make filter option from fabric image
|
|
* @param {fabric.Image} imageObject - fabric image object
|
|
* @returns {object}
|
|
*/
|
|
function makeFilterOptionFromFabricImage(imageObject) {
|
|
return (0, _tuiCodeSnippet.map)(imageObject.filters, function (filter) {
|
|
var _Object$keys = Object.keys(filter),
|
|
key = _Object$keys[0];
|
|
|
|
return _defineProperty({}, FILTER_NAME_VALUE_MAP[key], filter[key]);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Calculate fill image position and size for out of Canvas
|
|
* @param {Object} options - options for position dimension calculate
|
|
* @param {fabric.Object} shapeObj - shape object
|
|
* @param {number} left - original left position
|
|
* @param {number} top - original top position
|
|
* @param {number} width - image width
|
|
* @param {number} height - image height
|
|
* @param {number} cropX - image cropX
|
|
* @param {number} cropY - image cropY
|
|
* @param {boolean} flipX - shape flipX
|
|
* @param {boolean} flipY - shape flipY
|
|
* @returns {Object}
|
|
*/
|
|
function calculateFillImageDimensionOutsideCanvas(_ref2) {
|
|
var shapeObj = _ref2.shapeObj,
|
|
left = _ref2.left,
|
|
top = _ref2.top,
|
|
width = _ref2.width,
|
|
height = _ref2.height,
|
|
cropX = _ref2.cropX,
|
|
cropY = _ref2.cropY,
|
|
flipX = _ref2.flipX,
|
|
flipY = _ref2.flipY,
|
|
right = _ref2.right,
|
|
bottom = _ref2.bottom;
|
|
|
|
var overflowAreaPositionFixer = function overflowAreaPositionFixer(type, outDistance, imageLeft, imageTop) {
|
|
return calculateDistanceOverflowPart({
|
|
type: type,
|
|
outDistance: outDistance,
|
|
shapeObj: shapeObj,
|
|
flipX: flipX,
|
|
flipY: flipY,
|
|
left: imageLeft,
|
|
top: imageTop
|
|
});
|
|
};
|
|
var originalWidth = width,
|
|
originalHeight = height;
|
|
|
|
var _calculateDimensionLe = calculateDimensionLeftTopEdge(overflowAreaPositionFixer, {
|
|
left: left,
|
|
top: top,
|
|
width: width,
|
|
height: height,
|
|
cropX: cropX,
|
|
cropY: cropY
|
|
});
|
|
|
|
left = _calculateDimensionLe[0];
|
|
top = _calculateDimensionLe[1];
|
|
width = _calculateDimensionLe[2];
|
|
height = _calculateDimensionLe[3];
|
|
|
|
var _calculateDimensionRi = calculateDimensionRightBottomEdge(overflowAreaPositionFixer, {
|
|
left: left,
|
|
top: top,
|
|
insideCanvasRealImageWidth: width,
|
|
insideCanvasRealImageHeight: height,
|
|
right: right,
|
|
bottom: bottom,
|
|
cropX: cropX,
|
|
cropY: cropY,
|
|
originalWidth: originalWidth,
|
|
originalHeight: originalHeight
|
|
});
|
|
|
|
left = _calculateDimensionRi[0];
|
|
top = _calculateDimensionRi[1];
|
|
width = _calculateDimensionRi[2];
|
|
height = _calculateDimensionRi[3];
|
|
|
|
|
|
return [left, top, width, height];
|
|
}
|
|
|
|
/**
|
|
* Calculate fill image position and size for for right bottom edge
|
|
* @param {Function} overflowAreaPositionFixer - position fixer
|
|
* @param {Object} options - options for position dimension calculate
|
|
* @param {fabric.Object} shapeObj - shape object
|
|
* @param {number} left - original left position
|
|
* @param {number} top - original top position
|
|
* @param {number} width - image width
|
|
* @param {number} height - image height
|
|
* @param {number} right - image right
|
|
* @param {number} bottom - image bottom
|
|
* @param {number} cropX - image cropX
|
|
* @param {number} cropY - image cropY
|
|
* @param {boolean} originalWidth - image original width
|
|
* @param {boolean} originalHeight - image original height
|
|
* @returns {Object}
|
|
*/
|
|
function calculateDimensionRightBottomEdge(overflowAreaPositionFixer, _ref3) {
|
|
var left = _ref3.left,
|
|
top = _ref3.top,
|
|
insideCanvasRealImageWidth = _ref3.insideCanvasRealImageWidth,
|
|
insideCanvasRealImageHeight = _ref3.insideCanvasRealImageHeight,
|
|
right = _ref3.right,
|
|
bottom = _ref3.bottom,
|
|
cropX = _ref3.cropX,
|
|
cropY = _ref3.cropY,
|
|
originalWidth = _ref3.originalWidth,
|
|
originalHeight = _ref3.originalHeight;
|
|
var width = insideCanvasRealImageWidth,
|
|
height = insideCanvasRealImageHeight;
|
|
var _cachedCanvasImageEle = cachedCanvasImageElement,
|
|
canvasWidth = _cachedCanvasImageEle.width,
|
|
canvasHeight = _cachedCanvasImageEle.height;
|
|
|
|
|
|
if (right > canvasWidth && cropX > 0) {
|
|
width = originalWidth - Math.abs(right - canvasWidth);
|
|
}
|
|
if (bottom > canvasHeight && cropY > 0) {
|
|
height = originalHeight - Math.abs(bottom - canvasHeight);
|
|
}
|
|
|
|
var diff = {
|
|
x: (insideCanvasRealImageWidth - width) / 2,
|
|
y: (insideCanvasRealImageHeight - height) / 2
|
|
};
|
|
|
|
(0, _tuiCodeSnippet.forEach)(['x', 'y'], function (type) {
|
|
var cropDistance2 = diff[type];
|
|
if (cropDistance2 > 0) {
|
|
var _overflowAreaPosition = overflowAreaPositionFixer(type, cropDistance2, left, top);
|
|
|
|
left = _overflowAreaPosition[0];
|
|
top = _overflowAreaPosition[1];
|
|
}
|
|
});
|
|
|
|
return [left, top, width, height];
|
|
}
|
|
|
|
/**
|
|
* Calculate fill image position and size for for left top
|
|
* @param {Function} overflowAreaPositionFixer - position fixer
|
|
* @param {Object} options - options for position dimension calculate
|
|
* @param {fabric.Object} shapeObj - shape object
|
|
* @param {number} left - original left position
|
|
* @param {number} top - original top position
|
|
* @param {number} width - image width
|
|
* @param {number} height - image height
|
|
* @param {number} cropX - image cropX
|
|
* @param {number} cropY - image cropY
|
|
* @returns {Object}
|
|
*/
|
|
function calculateDimensionLeftTopEdge(overflowAreaPositionFixer, _ref4) {
|
|
var left = _ref4.left,
|
|
top = _ref4.top,
|
|
width = _ref4.width,
|
|
height = _ref4.height,
|
|
cropX = _ref4.cropX,
|
|
cropY = _ref4.cropY;
|
|
|
|
var dimension = {
|
|
width: width,
|
|
height: height
|
|
};
|
|
|
|
(0, _tuiCodeSnippet.forEach)(['x', 'y'], function (type) {
|
|
var cropDistance = type === 'x' ? cropX : cropY;
|
|
var compareSize = dimension[POSITION_DIMENSION_MAP[type]];
|
|
var standardSize = cachedCanvasImageElement[POSITION_DIMENSION_MAP[type]];
|
|
|
|
if (compareSize > standardSize) {
|
|
var outDistance = (compareSize - standardSize) / 2;
|
|
|
|
dimension[POSITION_DIMENSION_MAP[type]] = standardSize;
|
|
|
|
var _overflowAreaPosition2 = overflowAreaPositionFixer(type, outDistance, left, top);
|
|
|
|
left = _overflowAreaPosition2[0];
|
|
top = _overflowAreaPosition2[1];
|
|
}
|
|
if (cropDistance < 0) {
|
|
var _overflowAreaPosition3 = overflowAreaPositionFixer(type, cropDistance, left, top);
|
|
|
|
left = _overflowAreaPosition3[0];
|
|
top = _overflowAreaPosition3[1];
|
|
}
|
|
});
|
|
|
|
return [left, top, dimension.width, dimension.height];
|
|
}
|
|
|
|
/**
|
|
* Make fill property of dynamic pattern type
|
|
* @param {fabric.Image} canvasImage - canvas background image
|
|
* @param {Array} filterOption - filter option
|
|
* @param {fabric.StaticCanvas} patternSourceCanvas - fabric static canvas
|
|
* @returns {Object}
|
|
*/
|
|
function makeFillPatternForFilter(canvasImage, filterOption, patternSourceCanvas) {
|
|
var copiedCanvasElement = getCachedCanvasImageElement(canvasImage);
|
|
var fillImage = makeFillImage(copiedCanvasElement, canvasImage.angle, filterOption);
|
|
patternSourceCanvas.add(fillImage);
|
|
|
|
var fabricProperty = {
|
|
fill: new fabric.Pattern({
|
|
source: patternSourceCanvas.getElement(),
|
|
repeat: 'no-repeat'
|
|
})
|
|
};
|
|
|
|
(0, _util.setCustomProperty)(fabricProperty, { patternSourceCanvas: patternSourceCanvas });
|
|
|
|
return fabricProperty;
|
|
}
|
|
|
|
/**
|
|
* Reset fill pattern canvas
|
|
* @param {fabric.StaticCanvas} patternSourceCanvas - fabric static canvas
|
|
*/
|
|
function resetFillPatternCanvas(patternSourceCanvas) {
|
|
var _patternSourceCanvas$2 = patternSourceCanvas.getObjects(),
|
|
innerImage = _patternSourceCanvas$2[0];
|
|
|
|
var _getCustomProperty2 = (0, _util.getCustomProperty)(innerImage, 'fillImageMaxSize'),
|
|
fillImageMaxSize = _getCustomProperty2.fillImageMaxSize;
|
|
|
|
fillImageMaxSize = Math.max(1, fillImageMaxSize);
|
|
|
|
patternSourceCanvas.setDimensions({
|
|
width: fillImageMaxSize,
|
|
height: fillImageMaxSize
|
|
});
|
|
patternSourceCanvas.renderAll();
|
|
}
|
|
|
|
/**
|
|
* Remake filter pattern image source
|
|
* @param {fabric.Object} shapeObj - Shape object
|
|
* @param {fabric.Image} canvasImage - canvas background image
|
|
*/
|
|
function reMakePatternImageSource(shapeObj, canvasImage) {
|
|
var _getCustomProperty3 = (0, _util.getCustomProperty)(shapeObj, 'patternSourceCanvas'),
|
|
patternSourceCanvas = _getCustomProperty3.patternSourceCanvas;
|
|
|
|
var _patternSourceCanvas$3 = patternSourceCanvas.getObjects(),
|
|
fillImage = _patternSourceCanvas$3[0];
|
|
|
|
var filterOption = makeFilterOptionFromFabricImage(fillImage);
|
|
|
|
patternSourceCanvas.remove(fillImage);
|
|
|
|
var copiedCanvasElement = getCachedCanvasImageElement(canvasImage, true);
|
|
var newFillImage = makeFillImage(copiedCanvasElement, canvasImage.angle, filterOption);
|
|
|
|
patternSourceCanvas.add(newFillImage);
|
|
}
|
|
|
|
/**
|
|
* Calculate a point line outside the canvas.
|
|
* @param {fabric.Image} canvasImage - canvas background image
|
|
* @param {boolean} reset - default is false
|
|
* @returns {HTMLImageElement}
|
|
*/
|
|
function getCachedCanvasImageElement(canvasImage) {
|
|
var reset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
|
|
if (!cachedCanvasImageElement || reset) {
|
|
cachedCanvasImageElement = canvasImage.toCanvasElement();
|
|
}
|
|
|
|
return cachedCanvasImageElement;
|
|
}
|
|
|
|
/**
|
|
* Calculate fill image position for out of Canvas
|
|
* @param {string} type - 'x' or 'y'
|
|
* @param {fabric.Object} shapeObj - shape object
|
|
* @param {number} outDistance - distance away
|
|
* @param {number} left - original left position
|
|
* @param {number} top - original top position
|
|
* @returns {Array}
|
|
*/
|
|
function calculateDistanceOverflowPart(_ref5) {
|
|
var type = _ref5.type,
|
|
shapeObj = _ref5.shapeObj,
|
|
outDistance = _ref5.outDistance,
|
|
left = _ref5.left,
|
|
top = _ref5.top,
|
|
flipX = _ref5.flipX,
|
|
flipY = _ref5.flipY;
|
|
|
|
var shapePointNavigation = getShapeEdgePoint(shapeObj);
|
|
var shapeNeighborPointNavigation = [[1, 2], [0, 3], [0, 3], [1, 2]];
|
|
var linePointsOutsideCanvas = calculateLinePointsOutsideCanvas(type, shapePointNavigation, shapeNeighborPointNavigation);
|
|
var reatAngles = calculateLineAngleOfOutsideCanvas(type, shapePointNavigation, linePointsOutsideCanvas);
|
|
var startPointIndex = linePointsOutsideCanvas.startPointIndex;
|
|
|
|
var diffPosition = getReversePositionForFlip({
|
|
outDistance: outDistance,
|
|
startPointIndex: startPointIndex,
|
|
flipX: flipX,
|
|
flipY: flipY,
|
|
reatAngles: reatAngles
|
|
});
|
|
|
|
return [left + diffPosition.left, top + diffPosition.top];
|
|
}
|
|
|
|
/**
|
|
* Calculate fill image position for out of Canvas
|
|
* @param {number} outDistance - distance away
|
|
* @param {boolean} flipX - flip x statux
|
|
* @param {boolean} flipY - flip y statux
|
|
* @param {Array} reatAngles - Line angle of the rectangle vertex.
|
|
* @returns {Object} diffPosition
|
|
*/
|
|
function getReversePositionForFlip(_ref6) {
|
|
var outDistance = _ref6.outDistance,
|
|
startPointIndex = _ref6.startPointIndex,
|
|
flipX = _ref6.flipX,
|
|
flipY = _ref6.flipY,
|
|
reatAngles = _ref6.reatAngles;
|
|
|
|
var rotationChangePoint1 = outDistance * Math.cos(reatAngles[0] * Math.PI / 180);
|
|
var rotationChangePoint2 = outDistance * Math.cos(reatAngles[1] * Math.PI / 180);
|
|
var isForward = startPointIndex === 2 || startPointIndex === 3;
|
|
var diffPosition = {
|
|
top: isForward ? rotationChangePoint1 : rotationChangePoint2,
|
|
left: isForward ? rotationChangePoint2 : rotationChangePoint1
|
|
};
|
|
|
|
if (isReverseLeftPositionForFlip(startPointIndex, flipX, flipY)) {
|
|
diffPosition.left = diffPosition.left * -1;
|
|
}
|
|
if (isReverseTopPositionForFlip(startPointIndex, flipX, flipY)) {
|
|
diffPosition.top = diffPosition.top * -1;
|
|
}
|
|
|
|
return diffPosition;
|
|
}
|
|
|
|
/**
|
|
* Calculate a point line outside the canvas.
|
|
* @param {string} type - 'x' or 'y'
|
|
* @param {Array} shapePointNavigation - shape edge positions
|
|
* @param {Object} shapePointNavigation.lefttop - left top position
|
|
* @param {Object} shapePointNavigation.righttop - right top position
|
|
* @param {Object} shapePointNavigation.leftbottom - lefttop position
|
|
* @param {Object} shapePointNavigation.rightbottom - rightbottom position
|
|
* @param {Array} shapeNeighborPointNavigation - Array to find adjacent edges.
|
|
* @returns {Object}
|
|
*/
|
|
function calculateLinePointsOutsideCanvas(type, shapePointNavigation, shapeNeighborPointNavigation) {
|
|
var minimumPoint = 0;
|
|
var minimumPointIndex = 0;
|
|
(0, _tuiCodeSnippet.forEach)(shapePointNavigation, function (point, index) {
|
|
if (point[type] < minimumPoint) {
|
|
minimumPoint = point[type];
|
|
minimumPointIndex = index;
|
|
}
|
|
});
|
|
|
|
var _shapeNeighborPointNa = shapeNeighborPointNavigation[minimumPointIndex],
|
|
endPointIndex1 = _shapeNeighborPointNa[0],
|
|
endPointIndex2 = _shapeNeighborPointNa[1];
|
|
|
|
|
|
return {
|
|
startPointIndex: minimumPointIndex,
|
|
endPointIndex1: endPointIndex1,
|
|
endPointIndex2: endPointIndex2
|
|
};
|
|
}
|
|
|
|
/**
|
|
* Calculate a point line outside the canvas.
|
|
* @param {string} type - 'x' or 'y'
|
|
* @param {Array} shapePointNavigation - shape edge positions
|
|
* @param {object} shapePointNavigation.lefttop - left top position
|
|
* @param {object} shapePointNavigation.righttop - right top position
|
|
* @param {object} shapePointNavigation.leftbottom - lefttop position
|
|
* @param {object} shapePointNavigation.rightbottom - rightbottom position
|
|
* @param {Object} linePointsOfOneVertexIndex - Line point of one vertex
|
|
* @param {Object} linePointsOfOneVertexIndex.startPoint - start point index
|
|
* @param {Object} linePointsOfOneVertexIndex.endPointIndex1 - end point index
|
|
* @param {Object} linePointsOfOneVertexIndex.endPointIndex2 - end point index
|
|
* @returns {Object}
|
|
*/
|
|
function calculateLineAngleOfOutsideCanvas(type, shapePointNavigation, linePointsOfOneVertexIndex) {
|
|
var startPointIndex = linePointsOfOneVertexIndex.startPointIndex,
|
|
endPointIndex1 = linePointsOfOneVertexIndex.endPointIndex1,
|
|
endPointIndex2 = linePointsOfOneVertexIndex.endPointIndex2;
|
|
|
|
var horizontalVerticalAngle = type === 'x' ? 180 : 270;
|
|
|
|
return (0, _tuiCodeSnippet.map)([endPointIndex1, endPointIndex2], function (pointIndex) {
|
|
var startPoint = shapePointNavigation[startPointIndex];
|
|
var endPoint = shapePointNavigation[pointIndex];
|
|
var diffY = startPoint.y - endPoint.y;
|
|
var diffX = startPoint.x - endPoint.x;
|
|
|
|
return Math.atan2(diffY, diffX) * 180 / Math.PI - horizontalVerticalAngle;
|
|
});
|
|
}
|
|
|
|
/* eslint-disable complexity */
|
|
/**
|
|
* Calculate a point line outside the canvas for horizontal.
|
|
* @param {number} startPointIndex - start point index
|
|
* @param {boolean} flipX - flip x statux
|
|
* @param {boolean} flipY - flip y statux
|
|
* @returns {boolean} flipY - flip y statux
|
|
*/
|
|
function isReverseLeftPositionForFlip(startPointIndex, flipX, flipY) {
|
|
return (!flipX && flipY || !flipX && !flipY) && startPointIndex === 0 || (flipX && flipY || flipX && !flipY) && startPointIndex === 1 || (!flipX && !flipY || !flipX && flipY) && startPointIndex === 2 || (flipX && !flipY || flipX && flipY) && startPointIndex === 3;
|
|
}
|
|
/* eslint-enable complexity */
|
|
|
|
/* eslint-disable complexity */
|
|
/**
|
|
* Calculate a point line outside the canvas for vertical.
|
|
* @param {number} startPointIndex - start point index
|
|
* @param {boolean} flipX - flip x statux
|
|
* @param {boolean} flipY - flip y statux
|
|
* @returns {boolean} flipY - flip y statux
|
|
*/
|
|
function isReverseTopPositionForFlip(startPointIndex, flipX, flipY) {
|
|
return (flipX && !flipY || !flipX && !flipY) && startPointIndex === 0 || (!flipX && !flipY || flipX && !flipY) && startPointIndex === 1 || (flipX && flipY || !flipX && flipY) && startPointIndex === 2 || (!flipX && flipY || flipX && flipY) && startPointIndex === 3;
|
|
}
|
|
/* eslint-enable complexity */
|
|
|
|
/**
|
|
* Shape edge points
|
|
* @param {fabric.Object} shapeObj - Selected shape object on canvas
|
|
* @returns {Array} shapeEdgePoint - shape edge positions
|
|
*/
|
|
function getShapeEdgePoint(shapeObj) {
|
|
return [shapeObj.getPointByOrigin('left', 'top'), shapeObj.getPointByOrigin('right', 'top'), shapeObj.getPointByOrigin('left', 'bottom'), shapeObj.getPointByOrigin('right', 'bottom')];
|
|
}
|
|
|
|
/**
|
|
* Rotated shape dimension
|
|
* @param {fabric.Object} shapeObj - Shape object
|
|
* @returns {Object} Rotated shape dimension
|
|
*/
|
|
function getRotatedDimension(shapeObj) {
|
|
var _getShapeEdgePoint = getShapeEdgePoint(shapeObj),
|
|
_getShapeEdgePoint$ = _getShapeEdgePoint[0],
|
|
ax = _getShapeEdgePoint$.x,
|
|
ay = _getShapeEdgePoint$.y,
|
|
_getShapeEdgePoint$2 = _getShapeEdgePoint[1],
|
|
bx = _getShapeEdgePoint$2.x,
|
|
by = _getShapeEdgePoint$2.y,
|
|
_getShapeEdgePoint$3 = _getShapeEdgePoint[2],
|
|
cx = _getShapeEdgePoint$3.x,
|
|
cy = _getShapeEdgePoint$3.y,
|
|
_getShapeEdgePoint$4 = _getShapeEdgePoint[3],
|
|
dx = _getShapeEdgePoint$4.x,
|
|
dy = _getShapeEdgePoint$4.y;
|
|
|
|
var left = Math.min(ax, bx, cx, dx);
|
|
var top = Math.min(ay, by, cy, dy);
|
|
var right = Math.max(ax, bx, cx, dx);
|
|
var bottom = Math.max(ay, by, cy, dy);
|
|
|
|
return {
|
|
left: left,
|
|
top: top,
|
|
right: right,
|
|
bottom: bottom,
|
|
width: right - left,
|
|
height: bottom - top
|
|
};
|
|
}
|
|
|
|
/**
|
|
* Make fill image
|
|
* @param {HTMLImageElement} copiedCanvasElement - html image element
|
|
* @param {number} currentCanvasImageAngle - current canvas angle
|
|
* @param {Array} filterOption - filter option
|
|
* @returns {fabric.Image}
|
|
* @private
|
|
*/
|
|
function makeFillImage(copiedCanvasElement, currentCanvasImageAngle, filterOption) {
|
|
var fillImage = new fabric.Image(copiedCanvasElement);
|
|
|
|
(0, _tuiCodeSnippet.forEach)(_tuiCodeSnippet.extend.apply(undefined, [{}].concat(filterOption)), function (value, key) {
|
|
var fabricFilterClassName = (0, _util.capitalizeString)(key);
|
|
var filter = new fabric.Image.filters[fabricFilterClassName](_defineProperty({}, FILTER_OPTION_MAP[key], value));
|
|
fillImage.filters.push(filter);
|
|
});
|
|
fillImage.applyFilters();
|
|
|
|
(0, _util.setCustomProperty)(fillImage, {
|
|
originalAngle: currentCanvasImageAngle,
|
|
fillImageMaxSize: Math.max(fillImage.width, fillImage.height)
|
|
});
|
|
_shapeResizeHelper2.default.adjustOriginToCenter(fillImage);
|
|
|
|
return fillImage;
|
|
}
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/helper/shapeResizeHelper.js":
|
|
/*!********************************************!*\
|
|
!*** ./src/js/helper/shapeResizeHelper.js ***!
|
|
\********************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
/**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @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.originX,
|
|
originY = shape.originY;
|
|
|
|
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.originX === 'center' && shape.originY === '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.angle;
|
|
var originPositions = getPositionsOfRotatedOrigin(centerPoint, pointer, angle);
|
|
var originX = originPositions.originX,
|
|
originY = originPositions.originY;
|
|
|
|
var origin = shape.getPointByOrigin(originX, originY);
|
|
var left = shape.left - (centerPoint.x - origin.x);
|
|
var top = shape.top - (centerPoint.y - 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.angle;
|
|
var originPositions = getPositionsOfRotatedOrigin(origin, pointer, angle);
|
|
var originX = originPositions.originX,
|
|
originY = originPositions.originY;
|
|
|
|
|
|
shape.setPositionByOrigin(origin, originX, originY);
|
|
shape.setCoords();
|
|
}
|
|
|
|
/**
|
|
* 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.originX,
|
|
originY = shape.originY;
|
|
|
|
var origin = shape.getPointByOrigin(originX, originY);
|
|
var left = shape.left + (centerPoint.x - origin.x);
|
|
var top = shape.top + (centerPoint.y - origin.y);
|
|
|
|
shape.set({
|
|
hasControls: true,
|
|
hasBorders: true,
|
|
originX: 'center',
|
|
originY: 'center',
|
|
left: left,
|
|
top: top
|
|
});
|
|
|
|
shape.setCoords(); // For left, top properties
|
|
}
|
|
};
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/imageEditor.js":
|
|
/*!*******************************!*\
|
|
!*** ./src/js/imageEditor.js ***!
|
|
\*******************************/
|
|
/*! no static exports found */
|
|
/***/ (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; }; }(); /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Image-editor application class
|
|
*/
|
|
|
|
|
|
var _tuiCodeSnippet = __webpack_require__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _invoker3 = __webpack_require__(/*! @/invoker */ "./src/js/invoker.js");
|
|
|
|
var _invoker4 = _interopRequireDefault(_invoker3);
|
|
|
|
var _ui = __webpack_require__(/*! @/ui */ "./src/js/ui.js");
|
|
|
|
var _ui2 = _interopRequireDefault(_ui);
|
|
|
|
var _action = __webpack_require__(/*! @/action */ "./src/js/action.js");
|
|
|
|
var _action2 = _interopRequireDefault(_action);
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _graphics = __webpack_require__(/*! @/graphics */ "./src/js/graphics.js");
|
|
|
|
var _graphics2 = _interopRequireDefault(_graphics);
|
|
|
|
var _selectionModifyHelper = __webpack_require__(/*! @/helper/selectionModifyHelper */ "./src/js/helper/selectionModifyHelper.js");
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
|
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
|
|
var isUndefined = _tuiCodeSnippet2.default.isUndefined,
|
|
forEach = _tuiCodeSnippet2.default.forEach,
|
|
CustomEvents = _tuiCodeSnippet2.default.CustomEvents;
|
|
var MOUSE_DOWN = _consts.eventNames.MOUSE_DOWN,
|
|
OBJECT_MOVED = _consts.eventNames.OBJECT_MOVED,
|
|
OBJECT_SCALED = _consts.eventNames.OBJECT_SCALED,
|
|
OBJECT_ACTIVATED = _consts.eventNames.OBJECT_ACTIVATED,
|
|
OBJECT_ROTATED = _consts.eventNames.OBJECT_ROTATED,
|
|
OBJECT_ADDED = _consts.eventNames.OBJECT_ADDED,
|
|
OBJECT_MODIFIED = _consts.eventNames.OBJECT_MODIFIED,
|
|
ADD_TEXT = _consts.eventNames.ADD_TEXT,
|
|
ADD_OBJECT = _consts.eventNames.ADD_OBJECT,
|
|
TEXT_EDITING = _consts.eventNames.TEXT_EDITING,
|
|
TEXT_CHANGED = _consts.eventNames.TEXT_CHANGED,
|
|
ICON_CREATE_RESIZE = _consts.eventNames.ICON_CREATE_RESIZE,
|
|
ICON_CREATE_END = _consts.eventNames.ICON_CREATE_END,
|
|
SELECTION_CLEARED = _consts.eventNames.SELECTION_CLEARED,
|
|
SELECTION_CREATED = _consts.eventNames.SELECTION_CREATED,
|
|
ADD_OBJECT_AFTER = _consts.eventNames.ADD_OBJECT_AFTER;
|
|
|
|
/**
|
|
* 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 | 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 | number)} 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} textDecoration - Type of line (underline / line-through / overline)
|
|
*/
|
|
|
|
/**
|
|
* Shape filter option
|
|
* @typedef {object.<string, number>} ShapeFilterOption
|
|
*/
|
|
|
|
/**
|
|
* Shape filter option
|
|
* @typedef {object} ShapeFillOption - fill option of shape
|
|
* @property {string} type - fill type ('color' or 'filter')
|
|
* @property {Array.<ShapeFillFilterOption>} [filter] - {@link ShapeFilterOption} List.
|
|
* only applies to filter types
|
|
* (ex: \[\{pixelate: 20\}, \{blur: 0.3\}\])
|
|
* @property {string} [color] - Shape foreground color (ex: '#fff', 'transparent')
|
|
*/
|
|
|
|
/**
|
|
* Image editor
|
|
* @class
|
|
* @param {string|HTMLElement} wrapper - Wrapper's element or selector
|
|
* @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 values are \['crop', 'flip', 'rotate', 'draw', 'shape', 'icon', 'text', 'mask', 'filter'\].
|
|
* @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
|
|
* @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');
|
|
* 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',
|
|
* uiSize: {
|
|
* width: '1000px',
|
|
* height: '700px'
|
|
* },
|
|
* menuBarPosition: 'bottom'
|
|
* },
|
|
* cssMaxWidth: 700,
|
|
* cssMaxHeight: 500,
|
|
* selectionStyle: {
|
|
* cornerSize: 20,
|
|
* rotatingPointOffset: 70
|
|
* }
|
|
* });
|
|
*/
|
|
|
|
var ImageEditor = function () {
|
|
function ImageEditor(wrapper, options) {
|
|
_classCallCheck(this, ImageEditor);
|
|
|
|
options = _tuiCodeSnippet2.default.extend({
|
|
includeUI: false,
|
|
usageStatistics: true
|
|
}, options);
|
|
|
|
this.mode = null;
|
|
|
|
this.activeObjectId = null;
|
|
|
|
/**
|
|
* UI instance
|
|
* @type {Ui}
|
|
*/
|
|
if (options.includeUI) {
|
|
var UIOption = options.includeUI;
|
|
UIOption.usageStatistics = options.usageStatistics;
|
|
|
|
this.ui = new _ui2.default(wrapper, UIOption, this.getActions());
|
|
options = this.ui.setUiDefaultSelectionStyle(options);
|
|
}
|
|
|
|
/**
|
|
* Invoker
|
|
* @type {Invoker}
|
|
* @private
|
|
*/
|
|
this._invoker = new _invoker4.default();
|
|
|
|
/**
|
|
* Graphics instance
|
|
* @type {Graphics}
|
|
* @private
|
|
*/
|
|
this._graphics = new _graphics2.default(this.ui ? this.ui.getEditorArea() : wrapper, {
|
|
cssMaxWidth: options.cssMaxWidth,
|
|
cssMaxHeight: options.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),
|
|
objectRotated: this._onObjectRotated.bind(this),
|
|
objectAdded: this._onObjectAdded.bind(this),
|
|
objectModified: this._onObjectModified.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),
|
|
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 (options.usageStatistics) {
|
|
(0, _util.sendHostName)();
|
|
}
|
|
|
|
if (this.ui) {
|
|
this.ui.initCanvas();
|
|
this.setReAction();
|
|
}
|
|
fabric.enableGLFiltering = false;
|
|
}
|
|
|
|
/**
|
|
* Set selection style by init option
|
|
* @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(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 === 'activeSelection') {
|
|
eventTarget.set(selectionStyle);
|
|
}
|
|
});
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Attach invoker events
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_attachInvokerEvents',
|
|
value: function _attachInvokerEvents() {
|
|
var _this = this;
|
|
|
|
var UNDO_STACK_CHANGED = _consts.eventNames.UNDO_STACK_CHANGED,
|
|
REDO_STACK_CHANGED = _consts.eventNames.REDO_STACK_CHANGED,
|
|
EXECUTE_COMMAND = _consts.eventNames.EXECUTE_COMMAND,
|
|
AFTER_UNDO = _consts.eventNames.AFTER_UNDO,
|
|
AFTER_REDO = _consts.eventNames.AFTER_REDO,
|
|
HAND_STARTED = _consts.eventNames.HAND_STARTED,
|
|
HAND_STOPPED = _consts.eventNames.HAND_STOPPED;
|
|
|
|
/**
|
|
* 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));
|
|
|
|
if (this.ui) {
|
|
var canvas = this._graphics.getCanvas();
|
|
|
|
this._invoker.on(EXECUTE_COMMAND, function (command) {
|
|
return _this.ui.fire(EXECUTE_COMMAND, command);
|
|
});
|
|
this._invoker.on(AFTER_UNDO, function (command) {
|
|
return _this.ui.fire(AFTER_UNDO, command);
|
|
});
|
|
this._invoker.on(AFTER_REDO, function (command) {
|
|
return _this.ui.fire(AFTER_REDO, command);
|
|
});
|
|
|
|
canvas.on(HAND_STARTED, function () {
|
|
return _this.ui.fire(HAND_STARTED);
|
|
});
|
|
canvas.on(HAND_STOPPED, function () {
|
|
return _this.ui.fire(HAND_STOPPED);
|
|
});
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Attach canvas events
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_attachGraphicsEvents',
|
|
value: function _attachGraphicsEvents() {
|
|
var _graphics$on;
|
|
|
|
this._graphics.on((_graphics$on = {}, _defineProperty(_graphics$on, MOUSE_DOWN, this._handlers.mousedown), _defineProperty(_graphics$on, OBJECT_MOVED, this._handlers.objectMoved), _defineProperty(_graphics$on, OBJECT_SCALED, this._handlers.objectScaled), _defineProperty(_graphics$on, OBJECT_ROTATED, this._handlers.objectRotated), _defineProperty(_graphics$on, OBJECT_ACTIVATED, this._handlers.objectActivated), _defineProperty(_graphics$on, OBJECT_ADDED, this._handlers.objectAdded), _defineProperty(_graphics$on, OBJECT_MODIFIED, this._handlers.objectModified), _defineProperty(_graphics$on, ADD_TEXT, this._handlers.addText), _defineProperty(_graphics$on, ADD_OBJECT, this._handlers.addObject), _defineProperty(_graphics$on, TEXT_EDITING, this._handlers.textEditing), _defineProperty(_graphics$on, TEXT_CHANGED, this._handlers.textChanged), _defineProperty(_graphics$on, ICON_CREATE_RESIZE, this._handlers.iconCreateResize), _defineProperty(_graphics$on, ICON_CREATE_END, this._handlers.iconCreateEnd), _defineProperty(_graphics$on, SELECTION_CLEARED, this._handlers.selectionCleared), _defineProperty(_graphics$on, SELECTION_CREATED, this._handlers.selectionCreated), _graphics$on));
|
|
}
|
|
|
|
/**
|
|
* 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 ctrlKey = e.ctrlKey,
|
|
keyCode = e.keyCode,
|
|
metaKey = e.metaKey;
|
|
|
|
var isModifierKey = ctrlKey || metaKey;
|
|
|
|
if (isModifierKey) {
|
|
if (keyCode === _consts.keyCodes.C) {
|
|
this._graphics.resetTargetObjectForCopyPaste();
|
|
} else if (keyCode === _consts.keyCodes.V) {
|
|
this._graphics.pasteObject();
|
|
this.clearRedoStack();
|
|
} else if (keyCode === _consts.keyCodes.Z) {
|
|
// There is no error message on shortcut when it's empty
|
|
this.undo()['catch'](function () {});
|
|
} else if (keyCode === _consts.keyCodes.Y) {
|
|
// There is no error message on shortcut when it's empty
|
|
this.redo()['catch'](function () {});
|
|
}
|
|
}
|
|
|
|
var isDeleteKey = keyCode === _consts.keyCodes.BACKSPACE || keyCode === _consts.keyCodes.DEL;
|
|
var isRemoveReady = this._graphics.isReadyRemoveObject();
|
|
|
|
if (isRemoveReady && isDeleteKey) {
|
|
e.preventDefault();
|
|
this.removeActiveObject();
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Remove Active Object
|
|
*/
|
|
|
|
}, {
|
|
key: 'removeActiveObject',
|
|
value: function removeActiveObject() {
|
|
var activeObjectId = this._graphics.getActiveObjectIdForRemove();
|
|
|
|
this.removeObject(activeObjectId);
|
|
}
|
|
|
|
/**
|
|
* 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(_consts.eventNames.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(_consts.commandNames.ADD_OBJECT, this._graphics, obj);
|
|
this._invoker.pushUndoStack(command);
|
|
}
|
|
|
|
/**
|
|
* Add a 'changeSelection' command
|
|
* @param {fabric.Object} obj - selection object
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_pushModifyObjectCommand',
|
|
value: function _pushModifyObjectCommand(obj) {
|
|
var _this2 = this;
|
|
|
|
var type = obj.type;
|
|
|
|
var props = (0, _selectionModifyHelper.makeSelectionUndoData)(obj, function (item) {
|
|
return (0, _selectionModifyHelper.makeSelectionUndoDatum)(_this2._graphics.getObjectId(item), item, type === 'activeSelection');
|
|
});
|
|
var command = _command2.default.create(_consts.commandNames.CHANGE_SELECTION, this._graphics, props);
|
|
command.execute(this._graphics, props);
|
|
|
|
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(_consts.eventNames.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(_consts.eventNames.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(_consts.eventNames.OBJECT_SCALED, props);
|
|
}
|
|
|
|
/**
|
|
* 'objectRotated' event handler
|
|
* @param {ObjectProps} props - object properties
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onObjectRotated',
|
|
value: function _onObjectRotated(props) {
|
|
/**
|
|
* The event when object angle is changed
|
|
* @event ImageEditor#objectRotated
|
|
* @param {ObjectProps} props - object properties
|
|
* @example
|
|
* imageEditor.on('objectRotated', function(props) {
|
|
* console.log(props);
|
|
* console.log(props.type);
|
|
* });
|
|
*/
|
|
this.fire(_consts.eventNames.OBJECT_ROTATED, 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(_consts.commandNames.CLEAR_OBJECTS);
|
|
}
|
|
|
|
/**
|
|
* Deactivate all objects
|
|
* @example
|
|
* imageEditor.deactivateAll();
|
|
*/
|
|
|
|
}, {
|
|
key: 'deactivateAll',
|
|
value: function deactivateAll() {
|
|
this._graphics.deactivateAll();
|
|
this._graphics.renderAll();
|
|
}
|
|
|
|
/**
|
|
* discard selction
|
|
* @example
|
|
* imageEditor.discardSelection();
|
|
*/
|
|
|
|
}, {
|
|
key: 'discardSelection',
|
|
value: function discardSelection() {
|
|
this._graphics.discardSelection();
|
|
}
|
|
|
|
/**
|
|
* selectable status change
|
|
* @param {boolean} selectable - selectable status
|
|
* @example
|
|
* imageEditor.changeSelectableAll(false); // or true
|
|
*/
|
|
|
|
}, {
|
|
key: 'changeSelectableAll',
|
|
value: function changeSelectableAll(selectable) {
|
|
this._graphics.changeSelectableAll(selectable);
|
|
}
|
|
|
|
/**
|
|
* Init history
|
|
*/
|
|
|
|
}, {
|
|
key: '_initHistory',
|
|
value: function _initHistory() {
|
|
if (this.ui) {
|
|
this.ui.initHistory();
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Clear history
|
|
*/
|
|
|
|
}, {
|
|
key: '_clearHistory',
|
|
value: function _clearHistory() {
|
|
if (this.ui) {
|
|
this.ui.clearHistory();
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 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));
|
|
}
|
|
|
|
/**
|
|
* Invoke command
|
|
* @param {String} commandName - Command name
|
|
* @param {...*} args - Arguments for creating command
|
|
* @returns {Promise}
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: 'executeSilent',
|
|
value: function executeSilent(commandName) {
|
|
var _invoker2;
|
|
|
|
for (var _len2 = arguments.length, args = Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
|
|
args[_key2 - 1] = arguments[_key2];
|
|
}
|
|
|
|
// Inject an Graphics instance as first parameter
|
|
var theArgs = [this._graphics].concat(args);
|
|
|
|
return (_invoker2 = this._invoker).executeSilent.apply(_invoker2, [commandName].concat(theArgs));
|
|
}
|
|
|
|
/**
|
|
* Undo
|
|
* @param {number} [iterationCount=1] - Iteration count of undo
|
|
* @returns {Promise}
|
|
* @example
|
|
* imageEditor.undo();
|
|
*/
|
|
|
|
}, {
|
|
key: 'undo',
|
|
value: function undo() {
|
|
var _this3 = this;
|
|
|
|
var iterationCount = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
|
|
|
|
var promise = _util.Promise.resolve();
|
|
|
|
for (var i = 0; i < iterationCount; i += 1) {
|
|
promise = promise.then(function () {
|
|
return _this3._invoker.undo();
|
|
});
|
|
}
|
|
|
|
return promise;
|
|
}
|
|
|
|
/**
|
|
* Redo
|
|
* @param {number} [iterationCount=1] - Iteration count of redo
|
|
* @returns {Promise}
|
|
* @example
|
|
* imageEditor.redo();
|
|
*/
|
|
|
|
}, {
|
|
key: 'redo',
|
|
value: function redo() {
|
|
var _this4 = this;
|
|
|
|
var iterationCount = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
|
|
|
|
var promise = _util.Promise.resolve();
|
|
|
|
for (var i = 0; i < iterationCount; i += 1) {
|
|
promise = promise.then(function () {
|
|
return _this4._invoker.redo();
|
|
});
|
|
}
|
|
|
|
return promise;
|
|
}
|
|
|
|
/**
|
|
* Zoom
|
|
* @param {number} x - x axis of center point for zoom
|
|
* @param {number} y - y axis of center point for zoom
|
|
* @param {number} zoomLevel - level of zoom(1.0 ~ 5.0)
|
|
*/
|
|
|
|
}, {
|
|
key: 'zoom',
|
|
value: function zoom(_ref2) {
|
|
var x = _ref2.x,
|
|
y = _ref2.y,
|
|
zoomLevel = _ref2.zoomLevel;
|
|
|
|
this._graphics.zoom({ x: x, y: y }, zoomLevel);
|
|
}
|
|
|
|
/**
|
|
* Reset zoom. Change zoom level to 1.0
|
|
*/
|
|
|
|
}, {
|
|
key: 'resetZoom',
|
|
value: function resetZoom() {
|
|
this._graphics.resetZoom();
|
|
}
|
|
|
|
/**
|
|
* Load image from file
|
|
* @param {File} imgFile - Image file
|
|
* @param {string} [imageName] - imageName
|
|
* @returns {Promise<SizeChange, ErrorMsg>}
|
|
* @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 _util.Promise.reject(_consts.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<SizeChange, ErrorMsg>}
|
|
* @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 _util.Promise.reject(_consts.rejectMessages.invalidParameters);
|
|
}
|
|
|
|
return this.execute(_consts.commandNames.LOAD_IMAGE, imageName, url);
|
|
}
|
|
|
|
/**
|
|
* Add image object on canvas
|
|
* @param {string} imgUrl - Image url to make object
|
|
* @returns {Promise<ObjectProps, ErrorMsg>}
|
|
* @example
|
|
* imageEditor.addImageObject('path/fileName.jpg').then(objectProps => {
|
|
* console.log(ojectProps.id);
|
|
* });
|
|
*/
|
|
|
|
}, {
|
|
key: 'addImageObject',
|
|
value: function addImageObject(imgUrl) {
|
|
if (!imgUrl) {
|
|
return _util.Promise.reject(_consts.rejectMessages.invalidParameters);
|
|
}
|
|
|
|
return this.execute(_consts.commandNames.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 <I>'CROPPER', 'FREE_DRAWING', 'LINE_DRAWING', 'TEXT', 'SHAPE'</I>
|
|
* @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
|
|
* @param {Object} [option.arrowType] arrow decorate
|
|
* @param {string} [option.arrowType.tail] arrow decorate for tail. 'chevron' or 'triangle'
|
|
* @param {string} [option.arrowType.head] arrow decorate for head. 'chevron' or 'triangle'
|
|
* @returns {boolean} true if success or false
|
|
* @example
|
|
* imageEditor.startDrawingMode('FREE_DRAWING', {
|
|
* width: 10,
|
|
* color: 'rgba(255,0,0,0.5)'
|
|
* });
|
|
* imageEditor.startDrawingMode('LINE_DRAWING', {
|
|
* width: 10,
|
|
* color: 'rgba(255,0,0,0.5)',
|
|
* arrowType: {
|
|
* tail: 'chevron' // triangle
|
|
* }
|
|
* });
|
|
*
|
|
*/
|
|
|
|
}, {
|
|
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 _util.Promise.reject(_consts.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();
|
|
}
|
|
|
|
/**
|
|
* Set the cropping rect
|
|
* @param {number} [mode] crop rect mode [1, 1.5, 1.3333333333333333, 1.25, 1.7777777777777777]
|
|
*/
|
|
|
|
}, {
|
|
key: 'setCropzoneRect',
|
|
value: function setCropzoneRect(mode) {
|
|
this._graphics.setCropzoneRect(mode);
|
|
}
|
|
|
|
/**
|
|
* Flip
|
|
* @returns {Promise}
|
|
* @param {string} type - 'flipX' or 'flipY' or 'reset'
|
|
* @returns {Promise<FlipStatus, ErrorMsg>}
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_flip',
|
|
value: function _flip(type) {
|
|
return this.execute(_consts.commandNames.FLIP_IMAGE, type);
|
|
}
|
|
|
|
/**
|
|
* Flip x
|
|
* @returns {Promise<FlipStatus, ErrorMsg>}
|
|
* @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<FlipStatus, ErrorMsg>}
|
|
* @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<FlipStatus, ErrorMsg>}
|
|
* @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)
|
|
* @param {boolean} isSilent - is silent execution or not
|
|
* @returns {Promise<RotateStatus, ErrorMsg>}
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_rotate',
|
|
value: function _rotate(type, angle, isSilent) {
|
|
var result = null;
|
|
|
|
if (isSilent) {
|
|
result = this.executeSilent(_consts.commandNames.ROTATE_IMAGE, type, angle);
|
|
} else {
|
|
result = this.execute(_consts.commandNames.ROTATE_IMAGE, type, angle);
|
|
}
|
|
|
|
return result;
|
|
}
|
|
|
|
/**
|
|
* Rotate image
|
|
* @returns {Promise}
|
|
* @param {number} angle - Additional angle to rotate image
|
|
* @param {boolean} isSilent - is silent execution or not
|
|
* @returns {Promise<RotateStatus, ErrorMsg>}
|
|
* @example
|
|
* imageEditor.rotate(10); // angle = 10
|
|
* imageEditor.rotate(10); // angle = 20
|
|
* imageEditor.rotate(5); // angle = 5
|
|
* imageEditor.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, isSilent) {
|
|
return this._rotate('rotate', angle, isSilent);
|
|
}
|
|
|
|
/**
|
|
* Set angle
|
|
* @param {number} angle - Angle of image
|
|
* @param {boolean} isSilent - is silent execution or not
|
|
* @returns {Promise<RotateStatus, ErrorMsg>}
|
|
* @example
|
|
* imageEditor.setAngle(10); // angle = 10
|
|
* imageEditor.rotate(10); // angle = 20
|
|
* imageEditor.setAngle(5); // angle = 5
|
|
* imageEditor.rotate(50); // angle = 55
|
|
* imageEditor.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, isSilent) {
|
|
return this._rotate('setAngle', angle, isSilent);
|
|
}
|
|
|
|
/**
|
|
* 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 {(ShapeFillOption | string)} [options.fill] - {@link ShapeFillOption} or
|
|
* 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('rect', {
|
|
* fill: {
|
|
* type: 'filter',
|
|
* filter: [{blur: 0.3}, {pixelate: 20}]
|
|
* },
|
|
* 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);
|
|
}
|
|
}, {
|
|
key: 'setDrawingIcon',
|
|
value: function setDrawingIcon(type, iconColor) {
|
|
this._graphics.setIconStyle(type, iconColor);
|
|
}
|
|
|
|
/**
|
|
* Add shape
|
|
* @param {string} type - Shape type (ex: 'rect', 'circle', 'triangle')
|
|
* @param {Object} options - Shape options
|
|
* @param {(ShapeFillOption | string)} [options.fill] - {@link ShapeFillOption} or
|
|
* 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 {boolean} [options.isRegular] - Whether resizing shape has 1:1 ratio or not
|
|
* @returns {Promise<ObjectProps, ErrorMsg>}
|
|
* @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);
|
|
* });
|
|
* @example
|
|
* imageEditor.addShape('rect', {
|
|
* fill: {
|
|
* type: 'filter',
|
|
* filter: [{blur: 0.3}, {pixelate: 20}]
|
|
* },
|
|
* 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(_consts.commandNames.ADD_SHAPE, type, options);
|
|
}
|
|
|
|
/**
|
|
* Change shape
|
|
* @param {number} id - object id
|
|
* @param {Object} options - Shape options
|
|
* @param {(ShapeFillOption | string)} [options.fill] - {@link ShapeFillOption} or
|
|
* 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 {boolean} [options.isRegular] - Whether resizing shape has 1:1 ratio or not
|
|
* @param {boolean} isSilent - is silent execution 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, isSilent) {
|
|
var executeMethodName = isSilent ? 'executeSilent' : 'execute';
|
|
|
|
return this[executeMethodName](_consts.commandNames.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.textDecoration] Type of line (underline / line-through / overline)
|
|
* @param {{x: number, y: number}} [options.position] - Initial position
|
|
* @param {boolean} [options.autofocus] - text autofocus, default is true
|
|
* @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(_consts.commandNames.ADD_TEXT, text, options);
|
|
}
|
|
|
|
/**
|
|
* Change contents of selected text object on image
|
|
* @param {number} id - object id
|
|
* @param {string} text - Changing text
|
|
* @returns {Promise<ObjectProps, ErrorMsg>}
|
|
* @example
|
|
* imageEditor.changeText(id, 'change text');
|
|
*/
|
|
|
|
}, {
|
|
key: 'changeText',
|
|
value: function changeText(id, text) {
|
|
text = text || '';
|
|
|
|
return this.execute(_consts.commandNames.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.textDecoration] Type of line (underline / line-through / overline)
|
|
* @param {boolean} isSilent - is silent execution or not
|
|
* @returns {Promise}
|
|
* @example
|
|
* imageEditor.changeTextStyle(id, {
|
|
* fontStyle: 'italic'
|
|
* });
|
|
*/
|
|
|
|
}, {
|
|
key: 'changeTextStyle',
|
|
value: function changeTextStyle(id, styleObj, isSilent) {
|
|
var executeMethodName = isSilent ? 'executeSilent' : 'execute';
|
|
|
|
return this[executeMethodName](_consts.commandNames.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} target - changed text object
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onTextChanged',
|
|
value: function _onTextChanged(target) {
|
|
this.fire(_consts.eventNames.TEXT_CHANGED, target);
|
|
}
|
|
|
|
/**
|
|
* '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(_consts.eventNames.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(_consts.eventNames.ICON_CREATE_END, originPointer);
|
|
}
|
|
|
|
/**
|
|
* '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(_consts.eventNames.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) {
|
|
* console.log('text position on canvas: ' + pos.originPosition);
|
|
* console.log('text position on brwoser: ' + pos.clientPosition);
|
|
* });
|
|
*/
|
|
|
|
this.fire(_consts.eventNames.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._invoker.fire(_consts.eventNames.EXECUTE_COMMAND, (0, _util.getObjectType)(obj.type));
|
|
this._pushAddObjectCommand(obj);
|
|
}
|
|
|
|
/**
|
|
* 'objectAdded' event handler
|
|
* @param {Object} objectProps added object properties
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onObjectAdded',
|
|
value: function _onObjectAdded(objectProps) {
|
|
/**
|
|
* The event when object added
|
|
* @event ImageEditor#objectAdded
|
|
* @param {ObjectProps} props - object properties
|
|
* @example
|
|
* imageEditor.on('objectAdded', function(props) {
|
|
* console.log(props);
|
|
* });
|
|
*/
|
|
this.fire(OBJECT_ADDED, objectProps);
|
|
|
|
/**
|
|
* The event when object added (deprecated)
|
|
* @event ImageEditor#addObjectAfter
|
|
* @param {ObjectProps} props - object properties
|
|
* @deprecated
|
|
*/
|
|
this.fire(ADD_OBJECT_AFTER, objectProps);
|
|
}
|
|
|
|
/**
|
|
* 'objectModified' event handler
|
|
* @param {fabric.Object} obj - selection object
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_onObjectModified',
|
|
value: function _onObjectModified(obj) {
|
|
if (obj.type !== _consts.OBJ_TYPE.CROPZONE) {
|
|
this._invoker.fire(_consts.eventNames.EXECUTE_COMMAND, (0, _util.getObjectType)(obj.type));
|
|
this._pushModifyObjectCommand(obj);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 'selectionCleared' event handler
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_selectionCleared',
|
|
value: function _selectionCleared() {
|
|
this.fire(SELECTION_CLEARED);
|
|
}
|
|
|
|
/**
|
|
* 'selectionCreated' event handler
|
|
* @param {Object} eventTarget - Fabric object
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_selectionCreated',
|
|
value: function _selectionCreated(eventTarget) {
|
|
this.fire(SELECTION_CREATED, eventTarget);
|
|
}
|
|
|
|
/**
|
|
* 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);
|
|
}
|
|
|
|
/**
|
|
* 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)
|
|
* @param {Object} options - Icon options
|
|
* @param {string} [options.fill] - Icon foreground color
|
|
* @param {number} [options.left] - Icon x position
|
|
* @param {number} [options.top] - Icon y position
|
|
* @returns {Promise<ObjectProps, ErrorMsg>}
|
|
* @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(_consts.commandNames.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(_consts.commandNames.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) {
|
|
var _graphics$getObject = this._graphics.getObject(id),
|
|
type = _graphics$getObject.type;
|
|
|
|
return this.execute(_consts.commandNames.REMOVE_OBJECT, id, (0, _util.getObjectType)(type));
|
|
}
|
|
|
|
/**
|
|
* 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<FilterResult, ErrorMsg>}
|
|
* @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(_consts.commandNames.REMOVE_FILTER, type);
|
|
}
|
|
|
|
/**
|
|
* Apply filter on canvas image
|
|
* @param {string} type - Filter type
|
|
* @param {object} options - Options to apply filter
|
|
* @param {boolean} isSilent - is silent execution or not
|
|
* @returns {Promise<FilterResult, ErrorMsg>}
|
|
* @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, isSilent) {
|
|
var executeMethodName = isSilent ? 'executeSilent' : 'execute';
|
|
|
|
return this[executeMethodName](_consts.commandNames.APPLY_FILTER, type, options);
|
|
}
|
|
|
|
/**
|
|
* Get data url
|
|
* @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();
|
|
*
|
|
* imageEditor.loadImageFromURL(imageEditor.toDataURL(), 'FilterImage').then(() => {
|
|
* imageEditor.addImageObject(imgUrl);
|
|
* });
|
|
*/
|
|
|
|
}, {
|
|
key: 'toDataURL',
|
|
value: function toDataURL(options) {
|
|
return this._graphics.toDataURL(options);
|
|
}
|
|
|
|
/**
|
|
* 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 _util.Promise.reject(_consts.rejectMessages.invalidParameters);
|
|
}
|
|
|
|
return this.execute(_consts.commandNames.RESIZE_CANVAS_DIMENSION, dimension);
|
|
}
|
|
|
|
/**
|
|
* Destroy
|
|
*/
|
|
|
|
}, {
|
|
key: 'destroy',
|
|
value: function destroy() {
|
|
var _this5 = this;
|
|
|
|
this.stopDrawingMode();
|
|
this._detachDomEvents();
|
|
this._graphics.destroy();
|
|
this._graphics = null;
|
|
|
|
if (this.ui) {
|
|
this.ui.destroy();
|
|
}
|
|
|
|
forEach(this, function (value, key) {
|
|
_this5[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(_consts.commandNames.SET_OBJECT_PROPERTIES, id, keyValue);
|
|
}
|
|
|
|
/**
|
|
* Set properties of active object, Do not leave an invoke history.
|
|
* @param {number} id - object id
|
|
* @param {Object} keyValue - key & value
|
|
* @example
|
|
* 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<string>|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(_consts.commandNames.SET_OBJECT_POSITION, id, posInfo);
|
|
}
|
|
}]);
|
|
|
|
return ImageEditor;
|
|
}();
|
|
|
|
_action2.default.mixin(ImageEditor);
|
|
CustomEvents.mixin(ImageEditor);
|
|
|
|
exports.default = ImageEditor;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/interface/command.js":
|
|
/*!*************************************!*\
|
|
!*** ./src/js/interface/command.js ***!
|
|
\*************************************/
|
|
/*! no static exports found */
|
|
/***/ (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; }; }(); /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Command interface
|
|
*/
|
|
|
|
|
|
var _tuiCodeSnippet = __webpack_require__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _errorMessage = __webpack_require__(/*! @/factory/errorMessage */ "./src/js/factory/errorMessage.js");
|
|
|
|
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.<string, Component>} compMap - Components injection
|
|
* @abstract
|
|
*/
|
|
|
|
|
|
_createClass(Command, [{
|
|
key: 'execute',
|
|
value: function execute() {
|
|
throw new Error(createMessage(errorTypes.UN_IMPLEMENTATION, 'execute'));
|
|
}
|
|
|
|
/**
|
|
* Undo action
|
|
* @param {Object.<string, Component>} compMap - Components injection
|
|
* @abstract
|
|
*/
|
|
|
|
}, {
|
|
key: 'undo',
|
|
value: function undo() {
|
|
throw new Error(createMessage(errorTypes.UN_IMPLEMENTATION, 'undo'));
|
|
}
|
|
|
|
/**
|
|
* command for redo if undoData exists
|
|
* @returns {boolean} isRedo
|
|
*/
|
|
|
|
}, {
|
|
key: 'setUndoData',
|
|
|
|
|
|
/**
|
|
* Set undoData action
|
|
* @param {Object} undoData - maked undo data
|
|
* @param {Object} cachedUndoDataForSilent - cached undo data
|
|
* @param {boolean} isSilent - is silent execution or not
|
|
* @returns {Object} cachedUndoDataForSilent
|
|
*/
|
|
value: function setUndoData(undoData, cachedUndoDataForSilent, isSilent) {
|
|
if (cachedUndoDataForSilent) {
|
|
undoData = cachedUndoDataForSilent;
|
|
}
|
|
|
|
if (!isSilent) {
|
|
_tuiCodeSnippet2.default.extend(this.undoData, undoData);
|
|
cachedUndoDataForSilent = null;
|
|
} else if (!cachedUndoDataForSilent) {
|
|
cachedUndoDataForSilent = undoData;
|
|
}
|
|
|
|
return cachedUndoDataForSilent;
|
|
}
|
|
|
|
/**
|
|
* 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;
|
|
}
|
|
}, {
|
|
key: 'isRedo',
|
|
get: function get() {
|
|
return Object.keys(this.undoData).length > 0;
|
|
}
|
|
}]);
|
|
|
|
return Command;
|
|
}();
|
|
|
|
exports.default = Command;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/interface/component.js":
|
|
/*!***************************************!*\
|
|
!*** ./src/js/interface/component.js ***!
|
|
\***************************************/
|
|
/*! no static exports found */
|
|
/***/ (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; }; }();
|
|
|
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
|
|
/**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @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
|
|
* @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;
|
|
}();
|
|
|
|
exports.default = Component;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/interface/drawingMode.js":
|
|
/*!*****************************************!*\
|
|
!*** ./src/js/interface/drawingMode.js ***!
|
|
\*****************************************/
|
|
/*! no static exports found */
|
|
/***/ (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; }; }(); /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview DrawingMode interface
|
|
*/
|
|
|
|
|
|
var _errorMessage = __webpack_require__(/*! @/factory/errorMessage */ "./src/js/factory/errorMessage.js");
|
|
|
|
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: 'end',
|
|
value: function end() {
|
|
throw new Error(createMessage(errorTypes.UN_IMPLEMENTATION, 'stop'));
|
|
}
|
|
}]);
|
|
|
|
return DrawingMode;
|
|
}();
|
|
|
|
exports.default = DrawingMode;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/invoker.js":
|
|
/*!***************************!*\
|
|
!*** ./src/js/invoker.js ***!
|
|
\***************************/
|
|
/*! no static exports found */
|
|
/***/ (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; }; }(); /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Invoker - invoke commands
|
|
*/
|
|
|
|
|
|
var _tuiCodeSnippet = __webpack_require__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _command = __webpack_require__(/*! @/factory/command */ "./src/js/factory/command.js");
|
|
|
|
var _command2 = _interopRequireDefault(_command);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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 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.<Command>}
|
|
* @private
|
|
*/
|
|
this._undoStack = [];
|
|
|
|
/**
|
|
* Redo stack
|
|
* @type {Array.<Command>}
|
|
* @private
|
|
*/
|
|
this._redoStack = [];
|
|
|
|
/**
|
|
* Lock-flag for executing command
|
|
* @type {boolean}
|
|
* @private
|
|
*/
|
|
this._isLocked = false;
|
|
|
|
this._isSilent = false;
|
|
}
|
|
|
|
/**
|
|
* Invoke command execution
|
|
* @param {Command} command - Command
|
|
* @param {boolean} [isRedo=false] - check if command is redo
|
|
* @returns {Promise}
|
|
* @private
|
|
*/
|
|
|
|
|
|
_createClass(Invoker, [{
|
|
key: '_invokeExecution',
|
|
value: function _invokeExecution(command) {
|
|
var _this = this;
|
|
|
|
var isRedo = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
|
|
this.lock();
|
|
|
|
var args = command.args;
|
|
|
|
if (!args) {
|
|
args = [];
|
|
}
|
|
|
|
return command.execute.apply(command, args).then(function (value) {
|
|
if (!_this._isSilent) {
|
|
_this.pushUndoStack(command);
|
|
|
|
_this.fire(isRedo ? _consts.eventNames.AFTER_REDO : _consts.eventNames.EXECUTE_COMMAND, command);
|
|
}
|
|
_this.unlock();
|
|
if (isFunction(command.executeCallback)) {
|
|
command.executeCallback(value);
|
|
}
|
|
|
|
return value;
|
|
})['catch'](function (message) {
|
|
_this.unlock();
|
|
|
|
return _util.Promise.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.fire(_consts.eventNames.AFTER_UNDO, command);
|
|
_this2.unlock();
|
|
if (isFunction(command.undoCallback)) {
|
|
command.undoCallback(value);
|
|
}
|
|
|
|
return value;
|
|
})['catch'](function (message) {
|
|
_this2.unlock();
|
|
|
|
return _util.Promise.reject(message);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* fire REDO_STACK_CHANGED event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_fireRedoStackChanged',
|
|
value: function _fireRedoStackChanged() {
|
|
this.fire(_consts.eventNames.REDO_STACK_CHANGED, this._redoStack.length);
|
|
}
|
|
|
|
/**
|
|
* fire UNDO_STACK_CHANGED event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_fireUndoStackChanged',
|
|
value: function _fireUndoStackChanged() {
|
|
this.fire(_consts.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;
|
|
}
|
|
}, {
|
|
key: 'executeSilent',
|
|
value: function executeSilent() {
|
|
var _this3 = this;
|
|
|
|
this._isSilent = true;
|
|
|
|
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
|
|
args[_key] = arguments[_key];
|
|
}
|
|
|
|
return this.execute.apply(this, args.concat([this._isSilent])).then(function () {
|
|
_this3._isSilent = 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 _this4 = this;
|
|
|
|
if (this._isLocked) {
|
|
return _util.Promise.reject(_consts.rejectMessages.isLock);
|
|
}
|
|
|
|
for (var _len2 = arguments.length, args = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
|
|
args[_key2] = arguments[_key2];
|
|
}
|
|
|
|
var command = args[0];
|
|
|
|
if (isString(command)) {
|
|
command = _command2.default.create.apply(_command2.default, args);
|
|
}
|
|
|
|
return this._invokeExecution(command).then(function (value) {
|
|
_this4.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 = _consts.rejectMessages.undo;
|
|
if (this._isLocked) {
|
|
message = message + ' Because ' + _consts.rejectMessages.isLock;
|
|
}
|
|
promise = _util.Promise.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, true);
|
|
} else {
|
|
message = _consts.rejectMessages.redo;
|
|
if (this._isLocked) {
|
|
message = message + ' Because ' + _consts.rejectMessages.isLock;
|
|
}
|
|
promise = _util.Promise.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);
|
|
|
|
exports.default = Invoker;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/polyfill.js":
|
|
/*!****************************!*\
|
|
!*** ./src/js/polyfill.js ***!
|
|
\****************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"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();
|
|
}
|
|
}
|
|
})();
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui.js":
|
|
/*!**********************!*\
|
|
!*** ./src/js/ui.js ***!
|
|
\**********************/
|
|
/*! no static exports found */
|
|
/***/ (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__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
var _mainContainer = __webpack_require__(/*! @/ui/template/mainContainer */ "./src/js/ui/template/mainContainer.js");
|
|
|
|
var _mainContainer2 = _interopRequireDefault(_mainContainer);
|
|
|
|
var _controls = __webpack_require__(/*! @/ui/template/controls */ "./src/js/ui/template/controls.js");
|
|
|
|
var _controls2 = _interopRequireDefault(_controls);
|
|
|
|
var _theme = __webpack_require__(/*! @/ui/theme/theme */ "./src/js/ui/theme/theme.js");
|
|
|
|
var _theme2 = _interopRequireDefault(_theme);
|
|
|
|
var _shape = __webpack_require__(/*! @/ui/shape */ "./src/js/ui/shape.js");
|
|
|
|
var _shape2 = _interopRequireDefault(_shape);
|
|
|
|
var _crop = __webpack_require__(/*! @/ui/crop */ "./src/js/ui/crop.js");
|
|
|
|
var _crop2 = _interopRequireDefault(_crop);
|
|
|
|
var _flip = __webpack_require__(/*! @/ui/flip */ "./src/js/ui/flip.js");
|
|
|
|
var _flip2 = _interopRequireDefault(_flip);
|
|
|
|
var _rotate = __webpack_require__(/*! @/ui/rotate */ "./src/js/ui/rotate.js");
|
|
|
|
var _rotate2 = _interopRequireDefault(_rotate);
|
|
|
|
var _text = __webpack_require__(/*! @/ui/text */ "./src/js/ui/text.js");
|
|
|
|
var _text2 = _interopRequireDefault(_text);
|
|
|
|
var _mask = __webpack_require__(/*! @/ui/mask */ "./src/js/ui/mask.js");
|
|
|
|
var _mask2 = _interopRequireDefault(_mask);
|
|
|
|
var _icon = __webpack_require__(/*! @/ui/icon */ "./src/js/ui/icon.js");
|
|
|
|
var _icon2 = _interopRequireDefault(_icon);
|
|
|
|
var _draw = __webpack_require__(/*! @/ui/draw */ "./src/js/ui/draw.js");
|
|
|
|
var _draw2 = _interopRequireDefault(_draw);
|
|
|
|
var _filter = __webpack_require__(/*! @/ui/filter */ "./src/js/ui/filter.js");
|
|
|
|
var _filter2 = _interopRequireDefault(_filter);
|
|
|
|
var _history = __webpack_require__(/*! @/ui/history */ "./src/js/ui/history.js");
|
|
|
|
var _history2 = _interopRequireDefault(_history);
|
|
|
|
var _locale = __webpack_require__(/*! @/ui/locale/locale */ "./src/js/ui/locale/locale.js");
|
|
|
|
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"); } }
|
|
|
|
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 CustomEvents = _tuiCodeSnippet2.default.CustomEvents;
|
|
|
|
|
|
var BI_EXPRESSION_MINSIZE_WHEN_TOP_POSITION = '1300';
|
|
var HISTORY_MENU = 'history';
|
|
var HISTORY_PANEL_CLASS_NAME = 'tie-panel-history';
|
|
|
|
var CLASS_NAME_ON = 'on';
|
|
var ZOOM_BUTTON_TYPE = {
|
|
ZOOM_IN: 'zoomIn',
|
|
HAND: 'hand'
|
|
};
|
|
|
|
/**
|
|
* Default UI Class
|
|
* @class
|
|
* @param {string|HTMLElement} element - Wrapper's element or selector
|
|
* @param {Object} [options] - Ui setting options
|
|
* @param {number} options.loadImage - Init default load image
|
|
* @param {number} options.initMenu - Init start menu
|
|
* @param {Boolean} [options.menuBarPosition=bottom] - Let
|
|
* @param {Boolean} [options.applyCropSelectionStyle=false] - Let
|
|
* @param {Boolean} [options.usageStatistics=false] - Use statistics or not
|
|
* @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 {Object} actions - ui action instance
|
|
*/
|
|
|
|
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._locale = new _locale2.default(this.options.locale);
|
|
this.theme = new _theme2.default(this.options.theme);
|
|
this.eventHandler = {};
|
|
this._submenuChangeTransection = false;
|
|
this._selectedElement = null;
|
|
this._mainElement = null;
|
|
this._editorElementWrap = null;
|
|
this._editorElement = null;
|
|
this._menuBarElement = null;
|
|
this._subMenuElement = null;
|
|
this._makeUiElement(element);
|
|
this._setUiSize();
|
|
this._initMenuEvent = false;
|
|
|
|
this._makeSubMenu();
|
|
|
|
this._attachHistoryEvent();
|
|
this._attachZoomEvent();
|
|
}
|
|
|
|
/**
|
|
* Destroys the instance.
|
|
*/
|
|
|
|
|
|
_createClass(Ui, [{
|
|
key: 'destroy',
|
|
value: function destroy() {
|
|
this._removeUiEvent();
|
|
this._destroyAllMenu();
|
|
this._selectedElement.innerHTML = '';
|
|
|
|
(0, _util.assignmentForDestroy)(this);
|
|
}
|
|
|
|
/**
|
|
* Set Default Selection for includeUI
|
|
* @param {Object} option - imageEditor options
|
|
* @returns {Object} - extends selectionStyle option
|
|
* @ignore
|
|
*/
|
|
|
|
}, {
|
|
key: 'setUiDefaultSelectionStyle',
|
|
value: function setUiDefaultSelectionStyle(option) {
|
|
return _tuiCodeSnippet2.default.extend({
|
|
applyCropSelectionStyle: true,
|
|
applyGroupSelectionStyle: true,
|
|
selectionStyle: {
|
|
cornerStyle: 'circle',
|
|
cornerSize: 16,
|
|
cornerColor: '#fff',
|
|
cornerStrokeColor: '#fff',
|
|
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 {string} resizeInfo.uiSize.width - ui width
|
|
* @param {string} 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
|
|
* @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();
|
|
*/
|
|
|
|
}, {
|
|
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 _getCanvasMaxDimensio = this._getCanvasMaxDimension(),
|
|
width = _getCanvasMaxDimensio.width,
|
|
height = _getCanvasMaxDimensio.height;
|
|
|
|
var editorElementStyle = this._editorElement.style;
|
|
var menuBarPosition = this.options.menuBarPosition;
|
|
|
|
|
|
editorElementStyle.height = height + 'px';
|
|
editorElementStyle.width = width + 'px';
|
|
|
|
this._setEditorPosition(menuBarPosition);
|
|
|
|
this._editorElementWrap.style.bottom = '0px';
|
|
this._editorElementWrap.style.top = '0px';
|
|
this._editorElementWrap.style.left = '0px';
|
|
this._editorElementWrap.style.width = '100%';
|
|
|
|
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');
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Toggle zoom button status
|
|
* @param {string} type - type of zoom button
|
|
*/
|
|
|
|
}, {
|
|
key: 'toggleZoomButtonStatus',
|
|
value: function toggleZoomButtonStatus(type) {
|
|
var targetClassList = this._buttonElements[type].classList;
|
|
|
|
targetClassList.toggle(CLASS_NAME_ON);
|
|
|
|
if (type === ZOOM_BUTTON_TYPE.ZOOM_IN) {
|
|
this._buttonElements[ZOOM_BUTTON_TYPE.HAND].classList.remove(CLASS_NAME_ON);
|
|
} else {
|
|
this._buttonElements[ZOOM_BUTTON_TYPE.ZOOM_IN].classList.remove(CLASS_NAME_ON);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Turn off zoom-in button status
|
|
*/
|
|
|
|
}, {
|
|
key: 'offZoomInButtonStatus',
|
|
value: function offZoomInButtonStatus() {
|
|
var zoomInClassList = this._buttonElements[ZOOM_BUTTON_TYPE.ZOOM_IN].classList;
|
|
|
|
zoomInClassList.remove(CLASS_NAME_ON);
|
|
}
|
|
|
|
/**
|
|
* Change hand button status
|
|
* @param {boolean} enabled - status to change
|
|
*/
|
|
|
|
}, {
|
|
key: 'changeHandButtonStatus',
|
|
value: function changeHandButtonStatus(enabled) {
|
|
var handClassList = this._buttonElements[ZOOM_BUTTON_TYPE.HAND].classList;
|
|
|
|
handClassList[enabled ? 'add' : 'remove'](CLASS_NAME_ON);
|
|
}
|
|
|
|
/**
|
|
* Change help button status
|
|
* @param {string} buttonType - target button type
|
|
* @param {Boolean} enableStatus - enabled status
|
|
* @ignore
|
|
*/
|
|
|
|
}, {
|
|
key: 'changeHelpButtonEnabled',
|
|
value: function changeHelpButtonEnabled(buttonType, enableStatus) {
|
|
var buttonClassList = this._buttonElements[buttonType].classList;
|
|
|
|
buttonClassList[enableStatus ? 'add' : 'remove']('enabled');
|
|
}
|
|
|
|
/**
|
|
* Change delete button status
|
|
* @param {Object} [options] - Ui setting options
|
|
* @param {object} [options.loadImage] - Init default load image
|
|
* @param {string} [options.initMenu] - Init start menu
|
|
* @param {string} [options.menuBarPosition=bottom] - Let
|
|
* @param {boolean} [options.applyCropSelectionStyle=false] - Let
|
|
* @param {boolean} [options.usageStatistics=false] - Send statistics ping or not
|
|
* @returns {Object} initialize option
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_initializeOption',
|
|
value: function _initializeOption(options) {
|
|
return _tuiCodeSnippet2.default.extend({
|
|
loadImage: {
|
|
path: '',
|
|
name: ''
|
|
},
|
|
locale: {},
|
|
menuIconPath: '',
|
|
menu: ['crop', 'flip', 'rotate', 'draw', 'shape', 'icon', 'text', 'mask', 'filter'],
|
|
initMenu: '',
|
|
uiSize: {
|
|
width: '100%',
|
|
height: '100%'
|
|
},
|
|
menuBarPosition: 'bottom'
|
|
}, options);
|
|
}
|
|
|
|
/**
|
|
* Set ui container size
|
|
* @param {Object} uiSize - ui dimension
|
|
* @param {string} uiSize.width - css width property
|
|
* @param {string} uiSize.height - css height property
|
|
* @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._buttonElements[menuName] = _this._menuBarElement.querySelector('.tie-btn-' + menuName);
|
|
|
|
// submenu ui instance
|
|
_this[menuName] = new SubComponentClass(_this._subMenuElement, {
|
|
locale: _this._locale,
|
|
makeSvgIcon: _this.theme.makeMenSvgIconSet.bind(_this.theme),
|
|
menuBarPosition: _this.options.menuBarPosition,
|
|
usageStatistics: _this.options.usageStatistics
|
|
});
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Attach history event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_attachHistoryEvent',
|
|
value: function _attachHistoryEvent() {
|
|
this.on(_consts.eventNames.EXECUTE_COMMAND, this._addHistory.bind(this));
|
|
this.on(_consts.eventNames.AFTER_UNDO, this._selectPrevHistory.bind(this));
|
|
this.on(_consts.eventNames.AFTER_REDO, this._selectNextHistory.bind(this));
|
|
}
|
|
|
|
/**
|
|
* Attach zoom event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_attachZoomEvent',
|
|
value: function _attachZoomEvent() {
|
|
var _this2 = this;
|
|
|
|
this.on(_consts.eventNames.HAND_STARTED, function () {
|
|
_this2.offZoomInButtonStatus();
|
|
_this2.changeHandButtonStatus(true);
|
|
});
|
|
this.on(_consts.eventNames.HAND_STOPPED, function () {
|
|
return _this2.changeHandButtonStatus(false);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Make primary ui dom element
|
|
* @param {string|HTMLElement} element - Wrapper's element or selector
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_makeUiElement',
|
|
value: function _makeUiElement(element) {
|
|
var selectedElement = void 0;
|
|
|
|
window.snippet = _tuiCodeSnippet2.default;
|
|
|
|
if (element.nodeType) {
|
|
selectedElement = element;
|
|
} else {
|
|
selectedElement = document.querySelector(element);
|
|
}
|
|
var selector = (0, _util.getSelector)(selectedElement);
|
|
|
|
selectedElement.classList.add('tui-image-editor-container');
|
|
selectedElement.innerHTML = (0, _controls2.default)({
|
|
locale: this._locale,
|
|
biImage: this.theme.getStyle('common.bi'),
|
|
loadButtonStyle: this.theme.getStyle('loadButton'),
|
|
downloadButtonStyle: this.theme.getStyle('downloadButton'),
|
|
menuBarPosition: this.options.menuBarPosition
|
|
}) + (0, _mainContainer2.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 = 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._helpMenuBarElement = selector('.tui-image-editor-help-menu');
|
|
this._menuBarElement = selector('.tui-image-editor-menu');
|
|
this._subMenuElement = selector('.tui-image-editor-submenu');
|
|
this._buttonElements = {
|
|
download: this._selectedElement.querySelectorAll('.tui-image-editor-download-btn'),
|
|
load: this._selectedElement.querySelectorAll('.tui-image-editor-load-btn')
|
|
};
|
|
|
|
this._addHelpMenus();
|
|
|
|
this._historyMenu = new _history2.default(this._buttonElements[HISTORY_MENU], {
|
|
locale: this._locale,
|
|
makeSvgIcon: this.theme.makeMenSvgIconSet.bind(this.theme)
|
|
});
|
|
|
|
this._activateZoomMenus();
|
|
}
|
|
|
|
/**
|
|
* Activate help menus for zoom.
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_activateZoomMenus',
|
|
value: function _activateZoomMenus() {
|
|
var _this3 = this;
|
|
|
|
_tuiCodeSnippet2.default.forEach(_consts.ZOOM_HELP_MENUS, function (menu) {
|
|
_this3.changeHelpButtonEnabled(menu, true);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* make array for help menu output, including partitions.
|
|
* @returns {Array}
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_makeHelpMenuWithPartition',
|
|
value: function _makeHelpMenuWithPartition() {
|
|
return [].concat(_consts.ZOOM_HELP_MENUS, [''], _consts.COMMAND_HELP_MENUS, [''], _consts.DELETE_HELP_MENUS);
|
|
}
|
|
|
|
/**
|
|
* Add help menu
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_addHelpMenus',
|
|
value: function _addHelpMenus() {
|
|
var _this4 = this;
|
|
|
|
var helpMenuWithPartition = this._makeHelpMenuWithPartition();
|
|
|
|
_tuiCodeSnippet2.default.forEach(helpMenuWithPartition, function (menuName) {
|
|
if (!menuName) {
|
|
_this4._makeMenuPartitionElement();
|
|
} else {
|
|
_this4._makeMenuElement(menuName, ['normal', 'disabled', 'hover'], 'help');
|
|
|
|
_this4._buttonElements[menuName] = _this4._helpMenuBarElement.querySelector('.tie-btn-' + menuName);
|
|
}
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Make menu partition element
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_makeMenuPartitionElement',
|
|
value: function _makeMenuPartitionElement() {
|
|
var partitionElement = document.createElement('li');
|
|
var partitionInnerElement = document.createElement('div');
|
|
partitionElement.className = (0, _util.cls)('item');
|
|
partitionInnerElement.className = (0, _util.cls)('icpartition');
|
|
partitionElement.appendChild(partitionInnerElement);
|
|
|
|
this._helpMenuBarElement.appendChild(partitionElement);
|
|
}
|
|
|
|
/**
|
|
* Make menu button element
|
|
* @param {string} menuName - menu name
|
|
* @param {Array} useIconTypes - Possible values are \['normal', 'active', 'hover', 'disabled'\]
|
|
* @param {string} menuType - 'normal' or 'help'
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_makeMenuElement',
|
|
value: function _makeMenuElement(menuName) {
|
|
var useIconTypes = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : ['normal', 'active', 'hover'];
|
|
var menuType = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'normal';
|
|
|
|
var btnElement = document.createElement('li');
|
|
var menuItemHtml = this.theme.makeMenSvgIconSet(useIconTypes, menuName);
|
|
|
|
this._addTooltipAttribute(btnElement, menuName);
|
|
btnElement.className = 'tie-btn-' + menuName + ' ' + (0, _util.cls)('item') + ' ' + menuType;
|
|
btnElement.innerHTML = menuItemHtml;
|
|
|
|
if (menuType === 'normal') {
|
|
this._menuBarElement.appendChild(btnElement);
|
|
} else {
|
|
this._helpMenuBarElement.appendChild(btnElement);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Add help action event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_addHelpActionEvent',
|
|
value: function _addHelpActionEvent() {
|
|
var _this5 = this;
|
|
|
|
_tuiCodeSnippet2.default.forEach(_consts.HELP_MENUS, function (helpName) {
|
|
_this5.eventHandler[helpName] = function (event) {
|
|
return _this5._actions.main[helpName](event);
|
|
};
|
|
_this5._buttonElements[helpName].addEventListener('click', _this5.eventHandler[helpName]);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Remove help action event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_removeHelpActionEvent',
|
|
value: function _removeHelpActionEvent() {
|
|
var _this6 = this;
|
|
|
|
_tuiCodeSnippet2.default.forEach(_consts.HELP_MENUS, function (helpName) {
|
|
_this6._buttonElements[helpName].removeEventListener('click', _this6.eventHandler[helpName]);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Add history
|
|
* @param {Command|string} command - command or command name
|
|
*/
|
|
|
|
}, {
|
|
key: '_addHistory',
|
|
value: function _addHistory(command) {
|
|
if (!(0, _util.isSilentCommand)(command)) {
|
|
var historyTitle = typeof command === 'string' ? { name: command } : (0, _util.getHistoryTitle)(command);
|
|
|
|
this._historyMenu.add(historyTitle);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Init history
|
|
*/
|
|
|
|
}, {
|
|
key: 'initHistory',
|
|
value: function initHistory() {
|
|
this._historyMenu.init();
|
|
}
|
|
|
|
/**
|
|
* Clear history
|
|
*/
|
|
|
|
}, {
|
|
key: 'clearHistory',
|
|
value: function clearHistory() {
|
|
this._historyMenu.clear();
|
|
}
|
|
|
|
/**
|
|
* Select prev history
|
|
*/
|
|
|
|
}, {
|
|
key: '_selectPrevHistory',
|
|
value: function _selectPrevHistory() {
|
|
this._historyMenu.prev();
|
|
}
|
|
|
|
/**
|
|
* Select next history
|
|
*/
|
|
|
|
}, {
|
|
key: '_selectNextHistory',
|
|
value: function _selectNextHistory() {
|
|
this._historyMenu.next();
|
|
}
|
|
|
|
/**
|
|
* Toggle history menu
|
|
* @param {object} event - event object
|
|
*/
|
|
|
|
}, {
|
|
key: 'toggleHistoryMenu',
|
|
value: function toggleHistoryMenu(event) {
|
|
var target = event.target;
|
|
|
|
var item = target.closest('.' + HISTORY_PANEL_CLASS_NAME);
|
|
|
|
if (item) {
|
|
return;
|
|
}
|
|
|
|
var historyButtonClassList = this._buttonElements[HISTORY_MENU].classList;
|
|
|
|
historyButtonClassList.toggle('opened');
|
|
}
|
|
|
|
/**
|
|
* Add attribute for menu tooltip
|
|
* @param {HTMLElement} element - menu element
|
|
* @param {string} tooltipName - tooltipName
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_addTooltipAttribute',
|
|
value: function _addTooltipAttribute(element, tooltipName) {
|
|
element.setAttribute('tooltip-content', this._locale.localize(tooltipName.replace(/^[a-z]/g, function ($0) {
|
|
return $0.toUpperCase();
|
|
})));
|
|
}
|
|
|
|
/**
|
|
* Add download event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_addDownloadEvent',
|
|
value: function _addDownloadEvent() {
|
|
var _this7 = this;
|
|
|
|
this.eventHandler.download = function () {
|
|
return _this7._actions.main.download();
|
|
};
|
|
_tuiCodeSnippet2.default.forEach(this._buttonElements.download, function (element) {
|
|
element.addEventListener('click', _this7.eventHandler.download);
|
|
});
|
|
}
|
|
}, {
|
|
key: '_removeDownloadEvent',
|
|
value: function _removeDownloadEvent() {
|
|
var _this8 = this;
|
|
|
|
_tuiCodeSnippet2.default.forEach(this._buttonElements.download, function (element) {
|
|
element.removeEventListener('click', _this8.eventHandler.download);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Add load event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_addLoadEvent',
|
|
value: function _addLoadEvent() {
|
|
var _this9 = this;
|
|
|
|
this.eventHandler.loadImage = function (event) {
|
|
return _this9._actions.main.load(event.target.files[0]);
|
|
};
|
|
|
|
_tuiCodeSnippet2.default.forEach(this._buttonElements.load, function (element) {
|
|
element.addEventListener('change', _this9.eventHandler.loadImage);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Remove load event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_removeLoadEvent',
|
|
value: function _removeLoadEvent() {
|
|
var _this10 = this;
|
|
|
|
_tuiCodeSnippet2.default.forEach(this._buttonElements.load, function (element) {
|
|
element.removeEventListener('change', _this10.eventHandler.loadImage);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Add menu event
|
|
* @param {string} menuName - menu name
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_addMainMenuEvent',
|
|
value: function _addMainMenuEvent(menuName) {
|
|
var _this11 = this;
|
|
|
|
this.eventHandler[menuName] = function () {
|
|
return _this11.changeMenu(menuName);
|
|
};
|
|
this._buttonElements[menuName].addEventListener('click', this.eventHandler[menuName]);
|
|
}
|
|
|
|
/**
|
|
* Add menu event
|
|
* @param {string} menuName - menu name
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_addSubMenuEvent',
|
|
value: function _addSubMenuEvent(menuName) {
|
|
this[menuName].addEvent(this._actions[menuName]);
|
|
}
|
|
|
|
/**
|
|
* Add menu event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_addMenuEvent',
|
|
value: function _addMenuEvent() {
|
|
var _this12 = this;
|
|
|
|
_tuiCodeSnippet2.default.forEach(this.options.menu, function (menuName) {
|
|
_this12._addMainMenuEvent(menuName);
|
|
_this12._addSubMenuEvent(menuName);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Remove menu event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_removeMainMenuEvent',
|
|
value: function _removeMainMenuEvent() {
|
|
var _this13 = this;
|
|
|
|
_tuiCodeSnippet2.default.forEach(this.options.menu, function (menuName) {
|
|
_this13._buttonElements[menuName].removeEventListener('click', _this13.eventHandler[menuName]);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Get editor area element
|
|
* @returns {HTMLElement} editor area html element
|
|
* @ignore
|
|
*/
|
|
|
|
}, {
|
|
key: 'getEditorArea',
|
|
value: function getEditorArea() {
|
|
return this._editorElement;
|
|
}
|
|
|
|
/**
|
|
* Add event for menu items
|
|
* @ignore
|
|
*/
|
|
|
|
}, {
|
|
key: 'activeMenuEvent',
|
|
value: function activeMenuEvent() {
|
|
if (this._initMenuEvent) {
|
|
return;
|
|
}
|
|
|
|
this._addHelpActionEvent();
|
|
this._addDownloadEvent();
|
|
this._addMenuEvent();
|
|
this._initMenu();
|
|
this._historyMenu.addEvent(this._actions.history);
|
|
this._initMenuEvent = true;
|
|
}
|
|
|
|
/**
|
|
* Remove ui event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_removeUiEvent',
|
|
value: function _removeUiEvent() {
|
|
this._removeHelpActionEvent();
|
|
this._removeDownloadEvent();
|
|
this._removeLoadEvent();
|
|
this._removeMainMenuEvent();
|
|
this._historyMenu.removeEvent();
|
|
}
|
|
|
|
/**
|
|
* Destroy all menu instance
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_destroyAllMenu',
|
|
value: function _destroyAllMenu() {
|
|
var _this14 = this;
|
|
|
|
_tuiCodeSnippet2.default.forEach(this.options.menu, function (menuName) {
|
|
_this14[menuName].destroy();
|
|
});
|
|
|
|
this._historyMenu.destroy();
|
|
}
|
|
|
|
/**
|
|
* Init canvas
|
|
* @ignore
|
|
*/
|
|
|
|
}, {
|
|
key: 'initCanvas',
|
|
value: function initCanvas() {
|
|
var _this15 = this;
|
|
|
|
var loadImageInfo = this._getLoadImage();
|
|
if (loadImageInfo.path) {
|
|
this._actions.main.initLoadImage(loadImageInfo.path, loadImageInfo.name).then(function () {
|
|
_this15.activeMenuEvent();
|
|
});
|
|
}
|
|
|
|
this._addLoadEvent();
|
|
|
|
var gridVisual = document.createElement('div');
|
|
|
|
gridVisual.className = (0, _util.cls)('grid-visual');
|
|
var grid = '<table>\n <tr><td class="dot left-top"></td><td></td><td class="dot right-top"></td></tr>\n <tr><td></td><td></td><td></td></tr>\n <tr><td class="dot left-bottom"></td><td></td><td class="dot right-bottom"></td></tr>\n </table>';
|
|
gridVisual.innerHTML = grid;
|
|
this._editorContainerElement = this._editorElement.querySelector('.tui-image-editor-canvas-container');
|
|
this._editorContainerElement.appendChild(gridVisual);
|
|
}
|
|
|
|
/**
|
|
* get editor area element
|
|
* @returns {Object} load image option
|
|
* @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
|
|
* @ignore
|
|
*/
|
|
|
|
}, {
|
|
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 toggle or not
|
|
* @param {boolean} discardSelection - discard selection
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_changeMenu',
|
|
value: function _changeMenu(menuName, toggle, discardSelection) {
|
|
if (this.submenu) {
|
|
this._buttonElements[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._buttonElements[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._buttonElements[this.options.initMenu].dispatchEvent(evt);
|
|
}
|
|
|
|
if (this.icon) {
|
|
this.icon.registerDefaultIcon();
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Get canvas max Dimension
|
|
* @returns {Object} - width & height of editor
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_getCanvasMaxDimension',
|
|
value: function _getCanvasMaxDimension() {
|
|
var _editorContainerEleme = this._editorContainerElement.style,
|
|
maxWidth = _editorContainerEleme.maxWidth,
|
|
maxHeight = _editorContainerEleme.maxHeight;
|
|
|
|
var width = parseFloat(maxWidth);
|
|
var height = parseFloat(maxHeight);
|
|
|
|
return {
|
|
width: width,
|
|
height: height
|
|
};
|
|
}
|
|
|
|
/**
|
|
* Set editor position
|
|
* @param {string} menuBarPosition - top or right or bottom or left
|
|
* @private
|
|
*/
|
|
// eslint-disable-next-line complexity
|
|
|
|
}, {
|
|
key: '_setEditorPosition',
|
|
value: function _setEditorPosition(menuBarPosition) {
|
|
var _getCanvasMaxDimensio2 = this._getCanvasMaxDimension(),
|
|
width = _getCanvasMaxDimensio2.width,
|
|
height = _getCanvasMaxDimensio2.height;
|
|
|
|
var editorElementStyle = this._editorElement.style;
|
|
var top = 0;
|
|
var left = 0;
|
|
|
|
if (this.submenu) {
|
|
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;
|
|
}
|
|
}
|
|
}
|
|
editorElementStyle.top = top + 'px';
|
|
editorElementStyle.left = left + 'px';
|
|
}
|
|
}]);
|
|
|
|
return Ui;
|
|
}();
|
|
|
|
CustomEvents.mixin(Ui);
|
|
|
|
exports.default = Ui;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/crop.js":
|
|
/*!***************************!*\
|
|
!*** ./src/js/ui/crop.js ***!
|
|
\***************************/
|
|
/*! no static exports found */
|
|
/***/ (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__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _submenuBase = __webpack_require__(/*! @/ui/submenuBase */ "./src/js/ui/submenuBase.js");
|
|
|
|
var _submenuBase2 = _interopRequireDefault(_submenuBase);
|
|
|
|
var _crop = __webpack_require__(/*! @/ui/template/submenu/crop */ "./src/js/ui/template/submenu/crop.js");
|
|
|
|
var _crop2 = _interopRequireDefault(_crop);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
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 locale = _ref.locale,
|
|
makeSvgIcon = _ref.makeSvgIcon,
|
|
menuBarPosition = _ref.menuBarPosition,
|
|
usageStatistics = _ref.usageStatistics;
|
|
|
|
_classCallCheck(this, Crop);
|
|
|
|
var _this = _possibleConstructorReturn(this, (Crop.__proto__ || Object.getPrototypeOf(Crop)).call(this, subMenuElement, {
|
|
locale: locale,
|
|
name: 'crop',
|
|
makeSvgIcon: makeSvgIcon,
|
|
menuBarPosition: menuBarPosition,
|
|
templateHtml: _crop2.default,
|
|
usageStatistics: usageStatistics
|
|
}));
|
|
|
|
_this.status = 'active';
|
|
|
|
_this._els = {
|
|
apply: _this.selector('.tie-crop-button .apply'),
|
|
cancel: _this.selector('.tie-crop-button .cancel'),
|
|
preset: _this.selector('.tie-crop-preset-button')
|
|
};
|
|
|
|
_this.defaultPresetButton = _this._els.preset.querySelector('.preset-none');
|
|
return _this;
|
|
}
|
|
|
|
/**
|
|
* Destroys the instance.
|
|
*/
|
|
|
|
|
|
_createClass(Crop, [{
|
|
key: 'destroy',
|
|
value: function destroy() {
|
|
this._removeEvent();
|
|
|
|
(0, _util.assignmentForDestroy)(this);
|
|
}
|
|
|
|
/**
|
|
* Add event for crop
|
|
* @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
|
|
*/
|
|
|
|
}, {
|
|
key: 'addEvent',
|
|
value: function addEvent(actions) {
|
|
var apply = this._applyEventHandler.bind(this);
|
|
var cancel = this._cancelEventHandler.bind(this);
|
|
var cropzonePreset = this._cropzonePresetEventHandler.bind(this);
|
|
|
|
this.eventHandler = {
|
|
apply: apply,
|
|
cancel: cancel,
|
|
cropzonePreset: cropzonePreset
|
|
};
|
|
|
|
this.actions = actions;
|
|
this._els.apply.addEventListener('click', apply);
|
|
this._els.cancel.addEventListener('click', cancel);
|
|
this._els.preset.addEventListener('click', cropzonePreset);
|
|
}
|
|
|
|
/**
|
|
* Remove event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_removeEvent',
|
|
value: function _removeEvent() {
|
|
this._els.apply.removeEventListener('click', this.eventHandler.apply);
|
|
this._els.cancel.removeEventListener('click', this.eventHandler.cancel);
|
|
this._els.preset.removeEventListener('click', this.eventHandler.cropzonePreset);
|
|
}
|
|
}, {
|
|
key: '_applyEventHandler',
|
|
value: function _applyEventHandler() {
|
|
this.actions.crop();
|
|
this._els.apply.classList.remove('active');
|
|
}
|
|
}, {
|
|
key: '_cancelEventHandler',
|
|
value: function _cancelEventHandler() {
|
|
this.actions.cancel();
|
|
this._els.apply.classList.remove('active');
|
|
}
|
|
}, {
|
|
key: '_cropzonePresetEventHandler',
|
|
value: function _cropzonePresetEventHandler(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];
|
|
|
|
this._setPresetButtonActive(button);
|
|
this.actions.preset(presetType);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 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();
|
|
this._setPresetButtonActive();
|
|
}
|
|
|
|
/**
|
|
* 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');
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 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;
|
|
}(_submenuBase2.default);
|
|
|
|
exports.default = Crop;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/draw.js":
|
|
/*!***************************!*\
|
|
!*** ./src/js/ui/draw.js ***!
|
|
\***************************/
|
|
/*! no static exports found */
|
|
/***/ (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__(/*! @/ui/tools/colorpicker */ "./src/js/ui/tools/colorpicker.js");
|
|
|
|
var _colorpicker2 = _interopRequireDefault(_colorpicker);
|
|
|
|
var _range = __webpack_require__(/*! @/ui/tools/range */ "./src/js/ui/tools/range.js");
|
|
|
|
var _range2 = _interopRequireDefault(_range);
|
|
|
|
var _submenuBase = __webpack_require__(/*! @/ui/submenuBase */ "./src/js/ui/submenuBase.js");
|
|
|
|
var _submenuBase2 = _interopRequireDefault(_submenuBase);
|
|
|
|
var _draw = __webpack_require__(/*! @/ui/template/submenu/draw */ "./src/js/ui/template/submenu/draw.js");
|
|
|
|
var _draw2 = _interopRequireDefault(_draw);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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 locale = _ref.locale,
|
|
makeSvgIcon = _ref.makeSvgIcon,
|
|
menuBarPosition = _ref.menuBarPosition,
|
|
usageStatistics = _ref.usageStatistics;
|
|
|
|
_classCallCheck(this, Draw);
|
|
|
|
var _this = _possibleConstructorReturn(this, (Draw.__proto__ || Object.getPrototypeOf(Draw)).call(this, subMenuElement, {
|
|
locale: locale,
|
|
name: 'draw',
|
|
makeSvgIcon: makeSvgIcon,
|
|
menuBarPosition: menuBarPosition,
|
|
templateHtml: _draw2.default,
|
|
usageStatistics: usageStatistics
|
|
}));
|
|
|
|
_this._els = {
|
|
lineSelectButton: _this.selector('.tie-draw-line-select-button'),
|
|
drawColorPicker: new _colorpicker2.default(_this.selector('.tie-draw-color'), '#00a9ff', _this.toggleDirection, _this.usageStatistics),
|
|
drawRange: new _range2.default({
|
|
slider: _this.selector('.tie-draw-range'),
|
|
input: _this.selector('.tie-draw-range-value')
|
|
}, _consts.defaultDrawRangeValues)
|
|
};
|
|
|
|
_this.type = null;
|
|
_this.color = _this._els.drawColorPicker.color;
|
|
_this.width = _this._els.drawRange.value;
|
|
return _this;
|
|
}
|
|
|
|
/**
|
|
* Destroys the instance.
|
|
*/
|
|
|
|
|
|
_createClass(Draw, [{
|
|
key: 'destroy',
|
|
value: function destroy() {
|
|
this._removeEvent();
|
|
this._els.drawColorPicker.destroy();
|
|
this._els.drawRange.destroy();
|
|
|
|
(0, _util.assignmentForDestroy)(this);
|
|
}
|
|
|
|
/**
|
|
* Add event for draw
|
|
* @param {Object} actions - actions for crop
|
|
* @param {Function} actions.setDrawMode - set draw mode
|
|
*/
|
|
|
|
}, {
|
|
key: 'addEvent',
|
|
value: function addEvent(actions) {
|
|
this.eventHandler.changeDrawType = this._changeDrawType.bind(this);
|
|
|
|
this.actions = actions;
|
|
this._els.lineSelectButton.addEventListener('click', this.eventHandler.changeDrawType);
|
|
this._els.drawColorPicker.on('change', this._changeDrawColor.bind(this));
|
|
this._els.drawRange.on('change', this._changeDrawRange.bind(this));
|
|
}
|
|
|
|
/**
|
|
* Remove event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_removeEvent',
|
|
value: function _removeEvent() {
|
|
this._els.lineSelectButton.removeEventListener('click', this.eventHandler.changeDrawType);
|
|
this._els.drawColorPicker.off();
|
|
this._els.drawRange.off();
|
|
}
|
|
|
|
/**
|
|
* set draw mode - action runner
|
|
*/
|
|
|
|
}, {
|
|
key: 'setDrawMode',
|
|
value: function setDrawMode() {
|
|
this.actions.setDrawMode(this.type, {
|
|
width: this.width,
|
|
color: (0, _util.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) {
|
|
this.width = value;
|
|
if (!this.type) {
|
|
this.changeStartMode();
|
|
} else {
|
|
this.setDrawMode();
|
|
}
|
|
}
|
|
}]);
|
|
|
|
return Draw;
|
|
}(_submenuBase2.default);
|
|
|
|
exports.default = Draw;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/filter.js":
|
|
/*!*****************************!*\
|
|
!*** ./src/js/ui/filter.js ***!
|
|
\*****************************/
|
|
/*! no static exports found */
|
|
/***/ (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__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _colorpicker = __webpack_require__(/*! @/ui/tools/colorpicker */ "./src/js/ui/tools/colorpicker.js");
|
|
|
|
var _colorpicker2 = _interopRequireDefault(_colorpicker);
|
|
|
|
var _range = __webpack_require__(/*! @/ui/tools/range */ "./src/js/ui/tools/range.js");
|
|
|
|
var _range2 = _interopRequireDefault(_range);
|
|
|
|
var _submenuBase = __webpack_require__(/*! @/ui/submenuBase */ "./src/js/ui/submenuBase.js");
|
|
|
|
var _submenuBase2 = _interopRequireDefault(_submenuBase);
|
|
|
|
var _filter = __webpack_require__(/*! @/ui/template/submenu/filter */ "./src/js/ui/template/submenu/filter.js");
|
|
|
|
var _filter2 = _interopRequireDefault(_filter);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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', 'vintage', 'blur', 'sharpen', 'emboss', 'remove-white', 'brightness', 'noise', 'pixelate', 'color-filter', 'tint', 'multiply', 'blend'];
|
|
var filterNameMap = {
|
|
grayscale: 'grayscale',
|
|
invert: 'invert',
|
|
sepia: 'sepia',
|
|
blur: 'blur',
|
|
sharpen: 'sharpen',
|
|
emboss: 'emboss',
|
|
removeWhite: 'removeColor',
|
|
brightness: 'brightness',
|
|
contrast: 'contrast',
|
|
saturation: 'saturation',
|
|
vintage: 'vintage',
|
|
polaroid: 'polaroid',
|
|
noise: 'noise',
|
|
pixelate: 'pixelate',
|
|
colorFilter: 'removeColor',
|
|
tint: 'blendColor',
|
|
multiply: 'blendColor',
|
|
blend: 'blendColor',
|
|
hue: 'hue',
|
|
gamma: 'gamma'
|
|
};
|
|
var RANGE_INSTANCE_NAMES = ['removewhiteDistanceRange', 'colorfilterThresholdRange', 'pixelateRange', 'noiseRange', 'brightnessRange', 'tintOpacity'];
|
|
var COLORPICKER_INSTANCE_NAMES = ['filterBlendColor', 'filterMultiplyColor', 'filterTintColor'];
|
|
|
|
/**
|
|
* Filter ui class
|
|
* @class
|
|
* @ignore
|
|
*/
|
|
|
|
var Filter = function (_Submenu) {
|
|
_inherits(Filter, _Submenu);
|
|
|
|
function Filter(subMenuElement, _ref) {
|
|
var locale = _ref.locale,
|
|
menuBarPosition = _ref.menuBarPosition,
|
|
usageStatistics = _ref.usageStatistics;
|
|
|
|
_classCallCheck(this, Filter);
|
|
|
|
var _this = _possibleConstructorReturn(this, (Filter.__proto__ || Object.getPrototypeOf(Filter)).call(this, subMenuElement, {
|
|
locale: locale,
|
|
name: 'filter',
|
|
menuBarPosition: menuBarPosition,
|
|
templateHtml: _filter2.default,
|
|
usageStatistics: usageStatistics
|
|
}));
|
|
|
|
_this.selectBoxShow = false;
|
|
|
|
_this.checkedMap = {};
|
|
_this._makeControlElement();
|
|
return _this;
|
|
}
|
|
|
|
/**
|
|
* Destroys the instance.
|
|
*/
|
|
|
|
|
|
_createClass(Filter, [{
|
|
key: 'destroy',
|
|
value: function destroy() {
|
|
this._removeEvent();
|
|
this._destroyToolInstance();
|
|
|
|
(0, _util.assignmentForDestroy)(this);
|
|
}
|
|
|
|
/**
|
|
* Remove event for filter
|
|
*/
|
|
|
|
}, {
|
|
key: '_removeEvent',
|
|
value: function _removeEvent() {
|
|
var _this2 = this;
|
|
|
|
_tuiCodeSnippet2.default.forEach(FILTER_OPTIONS, function (filter) {
|
|
var filterCheckElement = _this2.selector('.tie-' + filter);
|
|
var filterNameCamelCase = (0, _util.toCamelCase)(filter);
|
|
|
|
filterCheckElement.removeEventListener('change', _this2.eventHandler[filterNameCamelCase]);
|
|
});
|
|
|
|
_tuiCodeSnippet2.default.forEach([].concat(RANGE_INSTANCE_NAMES, COLORPICKER_INSTANCE_NAMES), function (instanceName) {
|
|
_this2._els[instanceName].off();
|
|
});
|
|
|
|
this._els.blendType.removeEventListener('change', this.eventHandler.changeBlendFilter);
|
|
this._els.blendType.removeEventListener('click', this.eventHandler.changeBlendFilter);
|
|
}
|
|
}, {
|
|
key: '_destroyToolInstance',
|
|
value: function _destroyToolInstance() {
|
|
var _this3 = this;
|
|
|
|
_tuiCodeSnippet2.default.forEach([].concat(RANGE_INSTANCE_NAMES, COLORPICKER_INSTANCE_NAMES), function (instanceName) {
|
|
_this3._els[instanceName].destroy();
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Add event for filter
|
|
* @param {Object} actions - actions for crop
|
|
* @param {Function} actions.applyFilter - apply filter option
|
|
*/
|
|
|
|
}, {
|
|
key: 'addEvent',
|
|
value: function addEvent(_ref2) {
|
|
var _this4 = this;
|
|
|
|
var applyFilter = _ref2.applyFilter;
|
|
|
|
var changeFilterState = function changeFilterState(filterName) {
|
|
return _this4._changeFilterState.bind(_this4, applyFilter, filterName);
|
|
};
|
|
var changeFilterStateForRange = function changeFilterStateForRange(filterName) {
|
|
return function (value, isLast) {
|
|
return _this4._changeFilterState(applyFilter, filterName, isLast);
|
|
};
|
|
};
|
|
|
|
this.eventHandler = {
|
|
changeBlendFilter: changeFilterState('blend'),
|
|
blandTypeClick: function blandTypeClick(event) {
|
|
return event.stopPropagation();
|
|
}
|
|
};
|
|
|
|
_tuiCodeSnippet2.default.forEach(FILTER_OPTIONS, function (filter) {
|
|
var filterCheckElement = _this4.selector('.tie-' + filter);
|
|
var filterNameCamelCase = (0, _util.toCamelCase)(filter);
|
|
_this4.checkedMap[filterNameCamelCase] = filterCheckElement;
|
|
_this4.eventHandler[filterNameCamelCase] = changeFilterState(filterNameCamelCase);
|
|
|
|
filterCheckElement.addEventListener('change', _this4.eventHandler[filterNameCamelCase]);
|
|
});
|
|
|
|
this._els.removewhiteDistanceRange.on('change', changeFilterStateForRange('removeWhite'));
|
|
this._els.colorfilterThresholdRange.on('change', changeFilterStateForRange('colorFilter'));
|
|
this._els.pixelateRange.on('change', changeFilterStateForRange('pixelate'));
|
|
this._els.noiseRange.on('change', changeFilterStateForRange('noise'));
|
|
this._els.brightnessRange.on('change', changeFilterStateForRange('brightness'));
|
|
|
|
this._els.filterBlendColor.on('change', this.eventHandler.changeBlendFilter);
|
|
this._els.filterMultiplyColor.on('change', changeFilterState('multiply'));
|
|
this._els.filterTintColor.on('change', changeFilterState('tint'));
|
|
this._els.tintOpacity.on('change', changeFilterStateForRange('tint'));
|
|
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));
|
|
|
|
this._els.blendType.addEventListener('change', this.eventHandler.changeBlendFilter);
|
|
this._els.blendType.addEventListener('click', this.eventHandler.blandTypeClick);
|
|
}
|
|
|
|
/**
|
|
* Set filter for undo changed
|
|
* @param {Object} changedFilterInfos - changed command infos
|
|
* @param {string} type - filter type
|
|
* @param {string} action - add or remove
|
|
* @param {Object} options - filter options
|
|
*/
|
|
|
|
}, {
|
|
key: 'setFilterState',
|
|
value: function setFilterState(changedFilterInfos) {
|
|
var type = changedFilterInfos.type,
|
|
options = changedFilterInfos.options,
|
|
action = changedFilterInfos.action;
|
|
|
|
var filterName = this._getFilterNameFromOptions(type, options);
|
|
var isRemove = action === 'remove';
|
|
|
|
if (!isRemove) {
|
|
this._setFilterState(filterName, options);
|
|
}
|
|
|
|
this.checkedMap[filterName].checked = !isRemove;
|
|
}
|
|
|
|
/**
|
|
* Set filter for undo changed
|
|
* @param {string} filterName - filter name
|
|
* @param {Object} options - filter options
|
|
* @private
|
|
*/
|
|
// eslint-disable-next-line complexity
|
|
|
|
}, {
|
|
key: '_setFilterState',
|
|
value: function _setFilterState(filterName, options) {
|
|
if (filterName === 'colorFilter') {
|
|
this._els.colorfilterThresholdRange.value = options.distance;
|
|
} else if (filterName === 'removeWhite') {
|
|
this._els.removewhiteDistanceRange.value = options.distance;
|
|
} else if (filterName === 'pixelate') {
|
|
this._els.pixelateRange.value = options.blocksize;
|
|
} else if (filterName === 'brightness') {
|
|
this._els.brightnessRange.value = options.brightness;
|
|
} else if (filterName === 'noise') {
|
|
this._els.noiseRange.value = options.noise;
|
|
} else if (filterName === 'tint') {
|
|
this._els.tintOpacity.value = options.alpha;
|
|
this._els.filterTintColor.color = options.color;
|
|
} else if (filterName === 'blend') {
|
|
this._els.filterBlendColor.color = options.color;
|
|
} else if (filterName === 'multiply') {
|
|
this._els.filterMultiplyColor.color = options.color;
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Get filter name
|
|
* @param {string} type - filter type
|
|
* @param {Object} options - filter options
|
|
* @returns {string} filter name
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_getFilterNameFromOptions',
|
|
value: function _getFilterNameFromOptions(type, options) {
|
|
var filterName = type;
|
|
|
|
if (type === 'removeColor') {
|
|
filterName = _tuiCodeSnippet2.default.isExisty(options.useAlpha) ? 'removeWhite' : 'colorFilter';
|
|
} else if (type === 'blendColor') {
|
|
filterName = {
|
|
add: 'blend',
|
|
multiply: 'multiply',
|
|
tint: 'tint'
|
|
}[options.mode];
|
|
}
|
|
|
|
return filterName;
|
|
}
|
|
|
|
/**
|
|
* Add event for filter
|
|
* @param {Function} applyFilter - actions for firter
|
|
* @param {string} filterName - filter name
|
|
* @param {boolean} [isLast] - Is last change
|
|
*/
|
|
|
|
}, {
|
|
key: '_changeFilterState',
|
|
value: function _changeFilterState(applyFilter, filterName) {
|
|
var isLast = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
|
|
|
|
var apply = this.checkedMap[filterName].checked;
|
|
var type = filterNameMap[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(filterName), !isLast);
|
|
}
|
|
|
|
/**
|
|
* Get filter option
|
|
* @param {String} type - filter type
|
|
* @returns {Object} filter option object
|
|
* @private
|
|
*/
|
|
// eslint-disable-next-line complexity
|
|
|
|
}, {
|
|
key: '_getFilterOption',
|
|
value: function _getFilterOption(type) {
|
|
var option = {};
|
|
switch (type) {
|
|
case 'removeWhite':
|
|
option.color = '#FFFFFF';
|
|
option.useAlpha = false;
|
|
option.distance = parseFloat(this._els.removewhiteDistanceRange.value);
|
|
break;
|
|
case 'colorFilter':
|
|
option.color = '#FFFFFF';
|
|
option.distance = parseFloat(this._els.colorfilterThresholdRange.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 = parseFloat(this._els.brightnessRange.value);
|
|
break;
|
|
case 'blend':
|
|
option.mode = 'add';
|
|
option.color = this._els.filterBlendColor.color;
|
|
option.mode = this._els.blendType.value;
|
|
break;
|
|
case 'multiply':
|
|
option.mode = 'multiply';
|
|
option.color = this._els.filterMultiplyColor.color;
|
|
break;
|
|
case 'tint':
|
|
option.mode = 'tint';
|
|
option.color = this._els.filterTintColor.color;
|
|
option.alpha = this._els.tintOpacity.value;
|
|
break;
|
|
case 'blur':
|
|
option.blur = this._els.blurRange.value;
|
|
break;
|
|
default:
|
|
break;
|
|
}
|
|
|
|
return option;
|
|
}
|
|
|
|
/**
|
|
* Make submenu range and colorpicker control
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_makeControlElement',
|
|
value: function _makeControlElement() {
|
|
this._els = {
|
|
removewhiteDistanceRange: new _range2.default({ slider: this.selector('.tie-removewhite-distance-range') }, _consts.defaultFilterRangeValues.removewhiteDistanceRange),
|
|
brightnessRange: new _range2.default({ slider: this.selector('.tie-brightness-range') }, _consts.defaultFilterRangeValues.brightnessRange),
|
|
noiseRange: new _range2.default({ slider: this.selector('.tie-noise-range') }, _consts.defaultFilterRangeValues.noiseRange),
|
|
pixelateRange: new _range2.default({ slider: this.selector('.tie-pixelate-range') }, _consts.defaultFilterRangeValues.pixelateRange),
|
|
colorfilterThresholdRange: new _range2.default({ slider: this.selector('.tie-colorfilter-threshold-range') }, _consts.defaultFilterRangeValues.colorfilterThresholdRange),
|
|
filterTintColor: new _colorpicker2.default(this.selector('.tie-filter-tint-color'), '#03bd9e', this.toggleDirection, this.usageStatistics),
|
|
filterMultiplyColor: new _colorpicker2.default(this.selector('.tie-filter-multiply-color'), '#515ce6', this.toggleDirection, this.usageStatistics),
|
|
filterBlendColor: new _colorpicker2.default(this.selector('.tie-filter-blend-color'), '#ffbb3b', this.toggleDirection, this.usageStatistics),
|
|
blurRange: _consts.defaultFilterRangeValues.blurFilterRange
|
|
};
|
|
|
|
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);
|
|
}
|
|
|
|
/**
|
|
* 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 slider = document.createElement('div');
|
|
|
|
slider.id = 'tie-filter-tint-opacity';
|
|
rangeLabel.innerHTML = 'Opacity';
|
|
rangeWrap.appendChild(rangeLabel);
|
|
rangeWrap.appendChild(slider);
|
|
pickerControl.appendChild(rangeWrap);
|
|
pickerControl.style.height = PICKER_CONTROL_HEIGHT;
|
|
|
|
return new _range2.default({ slider: slider }, _consts.defaultFilterRangeValues.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 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 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);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* custom 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 _this5 = 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);
|
|
|
|
_this5.selectBoxShow = false;
|
|
optionlist.style.display = 'none';
|
|
});
|
|
|
|
selectlist.addEventListener('mousedown', function (event) {
|
|
event.preventDefault();
|
|
_this5.selectBoxShow = !_this5.selectBoxShow;
|
|
optionlist.style.display = _this5.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
|
|
*/
|
|
|
|
}, {
|
|
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);
|
|
});
|
|
}
|
|
}]);
|
|
|
|
return Filter;
|
|
}(_submenuBase2.default);
|
|
|
|
exports.default = Filter;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/flip.js":
|
|
/*!***************************!*\
|
|
!*** ./src/js/ui/flip.js ***!
|
|
\***************************/
|
|
/*! no static exports found */
|
|
/***/ (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__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _submenuBase = __webpack_require__(/*! @/ui/submenuBase */ "./src/js/ui/submenuBase.js");
|
|
|
|
var _submenuBase2 = _interopRequireDefault(_submenuBase);
|
|
|
|
var _flip = __webpack_require__(/*! @/ui/template/submenu/flip */ "./src/js/ui/template/submenu/flip.js");
|
|
|
|
var _flip2 = _interopRequireDefault(_flip);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
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 locale = _ref.locale,
|
|
makeSvgIcon = _ref.makeSvgIcon,
|
|
menuBarPosition = _ref.menuBarPosition,
|
|
usageStatistics = _ref.usageStatistics;
|
|
|
|
_classCallCheck(this, Flip);
|
|
|
|
var _this = _possibleConstructorReturn(this, (Flip.__proto__ || Object.getPrototypeOf(Flip)).call(this, subMenuElement, {
|
|
locale: locale,
|
|
name: 'flip',
|
|
makeSvgIcon: makeSvgIcon,
|
|
menuBarPosition: menuBarPosition,
|
|
templateHtml: _flip2.default,
|
|
usageStatistics: usageStatistics
|
|
}));
|
|
|
|
_this.flipStatus = false;
|
|
|
|
_this._els = {
|
|
flipButton: _this.selector('.tie-flip-button')
|
|
};
|
|
return _this;
|
|
}
|
|
|
|
/**
|
|
* Destroys the instance.
|
|
*/
|
|
|
|
|
|
_createClass(Flip, [{
|
|
key: 'destroy',
|
|
value: function destroy() {
|
|
this._removeEvent();
|
|
|
|
(0, _util.assignmentForDestroy)(this);
|
|
}
|
|
|
|
/**
|
|
* Add event for flip
|
|
* @param {Object} actions - actions for flip
|
|
* @param {Function} actions.flip - flip action
|
|
*/
|
|
|
|
}, {
|
|
key: 'addEvent',
|
|
value: function addEvent(actions) {
|
|
this.eventHandler.changeFlip = this._changeFlip.bind(this);
|
|
this._actions = actions;
|
|
this._els.flipButton.addEventListener('click', this.eventHandler.changeFlip);
|
|
}
|
|
|
|
/**
|
|
* Remove event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_removeEvent',
|
|
value: function _removeEvent() {
|
|
this._els.flipButton.removeEventListener('click', this.eventHandler.changeFlip);
|
|
}
|
|
|
|
/**
|
|
* 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;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/history.js":
|
|
/*!******************************!*\
|
|
!*** ./src/js/ui/history.js ***!
|
|
\******************************/
|
|
/*! no static exports found */
|
|
/***/ (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 _panelMenu = __webpack_require__(/*! @/ui/panelMenu */ "./src/js/ui/panelMenu.js");
|
|
|
|
var _panelMenu2 = _interopRequireDefault(_panelMenu);
|
|
|
|
var _history = __webpack_require__(/*! @/ui/template/submenu/history */ "./src/js/ui/template/submenu/history.js");
|
|
|
|
var _history2 = _interopRequireDefault(_history);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
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 historyClassName = 'history-item';
|
|
var selectedClassName = 'selected-item';
|
|
var disabledClassName = 'disabled-item';
|
|
|
|
/**
|
|
* History ui class
|
|
* @class
|
|
* @ignore
|
|
*/
|
|
|
|
var History = function (_Panel) {
|
|
_inherits(History, _Panel);
|
|
|
|
function History(menuElement, _ref) {
|
|
var locale = _ref.locale,
|
|
makeSvgIcon = _ref.makeSvgIcon;
|
|
|
|
_classCallCheck(this, History);
|
|
|
|
var _this = _possibleConstructorReturn(this, (History.__proto__ || Object.getPrototypeOf(History)).call(this, menuElement, { name: 'history' }));
|
|
|
|
menuElement.classList.add('enabled');
|
|
|
|
_this.locale = locale;
|
|
_this.makeSvgIcon = makeSvgIcon;
|
|
_this._eventHandler = {};
|
|
_this._historyIndex = _this.getListLength();
|
|
return _this;
|
|
}
|
|
|
|
/**
|
|
* Add history
|
|
* @param {string} name - name of history
|
|
* @param {?string} detail - detail information of history
|
|
*/
|
|
|
|
|
|
_createClass(History, [{
|
|
key: 'add',
|
|
value: function add(_ref2) {
|
|
var name = _ref2.name,
|
|
detail = _ref2.detail;
|
|
|
|
if (this._hasDisabledItem()) {
|
|
this.deleteListItemElement(this._historyIndex + 1, this.getListLength());
|
|
}
|
|
|
|
var html = (0, _history2.default)({ locale: this.locale, makeSvgIcon: this.makeSvgIcon, name: name, detail: detail });
|
|
var item = this.makeListItemElement(html);
|
|
|
|
this.pushListItemElement(item);
|
|
this._historyIndex = this.getListLength() - 1;
|
|
this._selectItem(this._historyIndex);
|
|
}
|
|
|
|
/**
|
|
* Init history
|
|
*/
|
|
|
|
}, {
|
|
key: 'init',
|
|
value: function init() {
|
|
this.deleteListItemElement(1, this.getListLength());
|
|
this._historyIndex = 0;
|
|
this._selectItem(this._historyIndex);
|
|
}
|
|
|
|
/**
|
|
* Clear history
|
|
*/
|
|
|
|
}, {
|
|
key: 'clear',
|
|
value: function clear() {
|
|
this.deleteListItemElement(0, this.getListLength());
|
|
this._historyIndex = -1;
|
|
}
|
|
|
|
/**
|
|
* Select previous history of current selected history
|
|
*/
|
|
|
|
}, {
|
|
key: 'prev',
|
|
value: function prev() {
|
|
this._historyIndex -= 1;
|
|
this._selectItem(this._historyIndex);
|
|
}
|
|
|
|
/**
|
|
* Select next history of current selected history
|
|
*/
|
|
|
|
}, {
|
|
key: 'next',
|
|
value: function next() {
|
|
this._historyIndex += 1;
|
|
this._selectItem(this._historyIndex);
|
|
}
|
|
|
|
/**
|
|
* Whether history menu has disabled item
|
|
* @returns {boolean}
|
|
*/
|
|
|
|
}, {
|
|
key: '_hasDisabledItem',
|
|
value: function _hasDisabledItem() {
|
|
return this.getListLength() - 1 > this._historyIndex;
|
|
}
|
|
|
|
/**
|
|
* Add history menu event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_addHistoryEventListener',
|
|
value: function _addHistoryEventListener() {
|
|
var _this2 = this;
|
|
|
|
this._eventHandler.history = function (event) {
|
|
return _this2._clickHistoryItem(event);
|
|
};
|
|
this.listElement.addEventListener('click', this._eventHandler.history);
|
|
}
|
|
|
|
/**
|
|
* Remove history menu event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_removeHistoryEventListener',
|
|
value: function _removeHistoryEventListener() {
|
|
this.listElement.removeEventListener('click', this._eventHandler.history);
|
|
}
|
|
|
|
/**
|
|
* onClick history menu event listener
|
|
* @param {object} event - event object
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_clickHistoryItem',
|
|
value: function _clickHistoryItem(event) {
|
|
var target = event.target;
|
|
|
|
var item = target.closest('.' + historyClassName);
|
|
|
|
if (!item) {
|
|
return;
|
|
}
|
|
|
|
var index = Number.parseInt(item.getAttribute('data-index'), 10);
|
|
|
|
if (index !== this._historyIndex) {
|
|
var count = Math.abs(index - this._historyIndex);
|
|
|
|
if (index < this._historyIndex) {
|
|
this._actions.undo(count);
|
|
} else {
|
|
this._actions.redo(count);
|
|
}
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Change item's state to selected state
|
|
* @param {number} index - index of selected item
|
|
*/
|
|
|
|
}, {
|
|
key: '_selectItem',
|
|
value: function _selectItem(index) {
|
|
for (var i = 0; i < this.getListLength(); i += 1) {
|
|
this.removeClass(i, selectedClassName);
|
|
this.removeClass(i, disabledClassName);
|
|
if (i > index) {
|
|
this.addClass(i, disabledClassName);
|
|
}
|
|
}
|
|
this.addClass(index, selectedClassName);
|
|
}
|
|
|
|
/**
|
|
* Destroys the instance.
|
|
*/
|
|
|
|
}, {
|
|
key: 'destroy',
|
|
value: function destroy() {
|
|
this.removeEvent();
|
|
|
|
(0, _util.assignmentForDestroy)(this);
|
|
}
|
|
|
|
/**
|
|
* Add event for history
|
|
* @param {Object} actions - actions for crop
|
|
* @param {Function} actions.undo - undo action
|
|
* @param {Function} actions.redo - redo action
|
|
*/
|
|
|
|
}, {
|
|
key: 'addEvent',
|
|
value: function addEvent(actions) {
|
|
this._actions = actions;
|
|
this._addHistoryEventListener();
|
|
}
|
|
|
|
/**
|
|
* Remove event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: 'removeEvent',
|
|
value: function removeEvent() {
|
|
this._removeHistoryEventListener();
|
|
}
|
|
}]);
|
|
|
|
return History;
|
|
}(_panelMenu2.default);
|
|
|
|
exports.default = History;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/icon.js":
|
|
/*!***************************!*\
|
|
!*** ./src/js/ui/icon.js ***!
|
|
\***************************/
|
|
/*! no static exports found */
|
|
/***/ (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__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _colorpicker = __webpack_require__(/*! @/ui/tools/colorpicker */ "./src/js/ui/tools/colorpicker.js");
|
|
|
|
var _colorpicker2 = _interopRequireDefault(_colorpicker);
|
|
|
|
var _submenuBase = __webpack_require__(/*! @/ui/submenuBase */ "./src/js/ui/submenuBase.js");
|
|
|
|
var _submenuBase2 = _interopRequireDefault(_submenuBase);
|
|
|
|
var _icon = __webpack_require__(/*! @/ui/template/submenu/icon */ "./src/js/ui/template/submenu/icon.js");
|
|
|
|
var _icon2 = _interopRequireDefault(_icon);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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 locale = _ref.locale,
|
|
makeSvgIcon = _ref.makeSvgIcon,
|
|
menuBarPosition = _ref.menuBarPosition,
|
|
usageStatistics = _ref.usageStatistics;
|
|
|
|
_classCallCheck(this, Icon);
|
|
|
|
var _this = _possibleConstructorReturn(this, (Icon.__proto__ || Object.getPrototypeOf(Icon)).call(this, subMenuElement, {
|
|
locale: locale,
|
|
name: 'icon',
|
|
makeSvgIcon: makeSvgIcon,
|
|
menuBarPosition: menuBarPosition,
|
|
templateHtml: _icon2.default,
|
|
usageStatistics: usageStatistics
|
|
}));
|
|
|
|
_this.iconType = null;
|
|
_this._iconMap = {};
|
|
|
|
_this._els = {
|
|
registerIconButton: _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, _this.usageStatistics)
|
|
};
|
|
return _this;
|
|
}
|
|
|
|
/**
|
|
* Destroys the instance.
|
|
*/
|
|
|
|
|
|
_createClass(Icon, [{
|
|
key: 'destroy',
|
|
value: function destroy() {
|
|
this._removeEvent();
|
|
this._els.iconColorpicker.destroy();
|
|
|
|
(0, _util.assignmentForDestroy)(this);
|
|
}
|
|
|
|
/**
|
|
* Add event for icon
|
|
* @param {Object} actions - actions for icon
|
|
* @param {Function} actions.registerCustomIcon - register icon
|
|
* @param {Function} actions.addIcon - add icon
|
|
* @param {Function} actions.changeColor - change icon color
|
|
*/
|
|
|
|
}, {
|
|
key: 'addEvent',
|
|
value: function addEvent(actions) {
|
|
var registerIcon = this._registerIconHandler.bind(this);
|
|
var addIcon = this._addIconHandler.bind(this);
|
|
|
|
this.eventHandler = {
|
|
registerIcon: registerIcon,
|
|
addIcon: addIcon
|
|
};
|
|
|
|
this.actions = actions;
|
|
this._els.iconColorpicker.on('change', this._changeColorHandler.bind(this));
|
|
this._els.registerIconButton.addEventListener('change', registerIcon);
|
|
this._els.addIconButton.addEventListener('click', addIcon);
|
|
}
|
|
|
|
/**
|
|
* Remove event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_removeEvent',
|
|
value: function _removeEvent() {
|
|
this._els.iconColorpicker.off();
|
|
this._els.registerIconButton.removeEventListener('change', this.eventHandler.registerIcon);
|
|
this._els.addIconButton.removeEventListener('click', this.eventHandler.addIcon);
|
|
}
|
|
|
|
/**
|
|
* Clear icon type
|
|
*/
|
|
|
|
}, {
|
|
key: 'clearIconType',
|
|
value: function clearIconType() {
|
|
this._els.addIconButton.classList.remove(this.iconType);
|
|
this.iconType = null;
|
|
}
|
|
|
|
/**
|
|
* Register default icon
|
|
*/
|
|
|
|
}, {
|
|
key: 'registerDefaultIcon',
|
|
value: function registerDefaultIcon() {
|
|
var _this2 = this;
|
|
|
|
_tuiCodeSnippet2.default.forEach(_consts.defaultIconPath, function (path, type) {
|
|
_this2.actions.registerDefaultIcons(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: '_registerIconHandler',
|
|
value: function _registerIconHandler(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.registerCustomIcon(imgUrl, file);
|
|
}
|
|
}
|
|
}]);
|
|
|
|
return Icon;
|
|
}(_submenuBase2.default);
|
|
|
|
exports.default = Icon;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/locale/locale.js":
|
|
/*!************************************!*\
|
|
!*** ./src/js/ui/locale/locale.js ***!
|
|
\************************************/
|
|
/*! no static exports found */
|
|
/***/ (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; }; }();
|
|
|
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
|
|
/**
|
|
* Translate messages
|
|
*/
|
|
var Locale = function () {
|
|
/**
|
|
* @constructor
|
|
* @param {Object} locale - Locale object for initialise
|
|
*/
|
|
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;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/mask.js":
|
|
/*!***************************!*\
|
|
!*** ./src/js/ui/mask.js ***!
|
|
\***************************/
|
|
/*! no static exports found */
|
|
/***/ (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__(/*! @/ui/submenuBase */ "./src/js/ui/submenuBase.js");
|
|
|
|
var _submenuBase2 = _interopRequireDefault(_submenuBase);
|
|
|
|
var _mask = __webpack_require__(/*! @/ui/template/submenu/mask */ "./src/js/ui/template/submenu/mask.js");
|
|
|
|
var _mask2 = _interopRequireDefault(_mask);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
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 locale = _ref.locale,
|
|
makeSvgIcon = _ref.makeSvgIcon,
|
|
menuBarPosition = _ref.menuBarPosition,
|
|
usageStatistics = _ref.usageStatistics;
|
|
|
|
_classCallCheck(this, Mask);
|
|
|
|
var _this = _possibleConstructorReturn(this, (Mask.__proto__ || Object.getPrototypeOf(Mask)).call(this, subMenuElement, {
|
|
locale: locale,
|
|
name: 'mask',
|
|
makeSvgIcon: makeSvgIcon,
|
|
menuBarPosition: menuBarPosition,
|
|
templateHtml: _mask2.default,
|
|
usageStatistics: usageStatistics
|
|
}));
|
|
|
|
_this._els = {
|
|
applyButton: _this.selector('.tie-mask-apply'),
|
|
maskImageButton: _this.selector('.tie-mask-image-file')
|
|
};
|
|
return _this;
|
|
}
|
|
|
|
/**
|
|
* Destroys the instance.
|
|
*/
|
|
|
|
|
|
_createClass(Mask, [{
|
|
key: 'destroy',
|
|
value: function destroy() {
|
|
this._removeEvent();
|
|
|
|
(0, _util.assignmentForDestroy)(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
|
|
*/
|
|
|
|
}, {
|
|
key: 'addEvent',
|
|
value: function addEvent(actions) {
|
|
var loadMaskFile = this._loadMaskFile.bind(this);
|
|
var applyMask = this._applyMask.bind(this);
|
|
|
|
this.eventHandler = {
|
|
loadMaskFile: loadMaskFile,
|
|
applyMask: applyMask
|
|
};
|
|
|
|
this.actions = actions;
|
|
this._els.maskImageButton.addEventListener('change', loadMaskFile);
|
|
this._els.applyButton.addEventListener('click', applyMask);
|
|
}
|
|
|
|
/**
|
|
* Remove event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_removeEvent',
|
|
value: function _removeEvent() {
|
|
this._els.maskImageButton.removeEventListener('change', this.eventHandler.loadMaskFile);
|
|
this._els.applyButton.removeEventListener('click', this.eventHandler.applyMask);
|
|
}
|
|
|
|
/**
|
|
* 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 (!(0, _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.loadImageFromURL(imgUrl, file);
|
|
this._els.applyButton.classList.add('active');
|
|
}
|
|
}
|
|
}]);
|
|
|
|
return Mask;
|
|
}(_submenuBase2.default);
|
|
|
|
exports.default = Mask;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/panelMenu.js":
|
|
/*!********************************!*\
|
|
!*** ./src/js/ui/panelMenu.js ***!
|
|
\********************************/
|
|
/*! no static exports found */
|
|
/***/ (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; }; }();
|
|
|
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
|
|
/**
|
|
* Menu Panel Class
|
|
* @class
|
|
* @ignore
|
|
*/
|
|
|
|
var Panel = function () {
|
|
/**
|
|
* @param {HTMLElement} menuElement - menu dom element
|
|
* @param {Object} options - menu options
|
|
* @param {string} options.name - name of panel menu
|
|
*/
|
|
function Panel(menuElement, _ref) {
|
|
var name = _ref.name;
|
|
|
|
_classCallCheck(this, Panel);
|
|
|
|
this.name = name;
|
|
this.items = [];
|
|
|
|
this.panelElement = this._makePanelElement();
|
|
this.listElement = this._makeListElement();
|
|
|
|
this.panelElement.appendChild(this.listElement);
|
|
menuElement.appendChild(this.panelElement);
|
|
}
|
|
|
|
/**
|
|
* Make Panel element
|
|
* @returns {HTMLElement}
|
|
*/
|
|
|
|
|
|
_createClass(Panel, [{
|
|
key: '_makePanelElement',
|
|
value: function _makePanelElement() {
|
|
var panel = document.createElement('div');
|
|
|
|
panel.className = 'tie-panel-' + this.name;
|
|
|
|
return panel;
|
|
}
|
|
|
|
/**
|
|
* Make list element
|
|
* @returns {HTMLElement} list element
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_makeListElement',
|
|
value: function _makeListElement() {
|
|
var list = document.createElement('ol');
|
|
|
|
list.className = this.name + '-list';
|
|
|
|
return list;
|
|
}
|
|
|
|
/**
|
|
* Make list item element
|
|
* @param {string} html - history list item html
|
|
* @returns {HTMLElement} list item element
|
|
*/
|
|
|
|
}, {
|
|
key: 'makeListItemElement',
|
|
value: function makeListItemElement(html) {
|
|
var listItem = document.createElement('li');
|
|
|
|
listItem.innerHTML = html;
|
|
listItem.className = this.name + '-item';
|
|
listItem.setAttribute('data-index', this.items.length);
|
|
|
|
return listItem;
|
|
}
|
|
|
|
/**
|
|
* Push list item element
|
|
* @param {HTMLElement} item - list item element to add to the list
|
|
*/
|
|
|
|
}, {
|
|
key: 'pushListItemElement',
|
|
value: function pushListItemElement(item) {
|
|
this.listElement.appendChild(item);
|
|
this.listElement.scrollTop += item.offsetHeight;
|
|
this.items.push(item);
|
|
}
|
|
|
|
/**
|
|
* Delete list item element
|
|
* @param {number} start - start index to delete
|
|
* @param {number} end - end index to delete
|
|
*/
|
|
|
|
}, {
|
|
key: 'deleteListItemElement',
|
|
value: function deleteListItemElement(start, end) {
|
|
var items = this.items;
|
|
|
|
|
|
for (var i = start; i < end; i += 1) {
|
|
this.listElement.removeChild(items[i]);
|
|
}
|
|
items.splice(start, end - start + 1);
|
|
}
|
|
|
|
/**
|
|
* Get list's length
|
|
* @returns {number}
|
|
*/
|
|
|
|
}, {
|
|
key: 'getListLength',
|
|
value: function getListLength() {
|
|
return this.items.length;
|
|
}
|
|
|
|
/**
|
|
* Add class name of item
|
|
* @param {number} index - index of item
|
|
* @param {string} className - class name to add
|
|
*/
|
|
|
|
}, {
|
|
key: 'addClass',
|
|
value: function addClass(index, className) {
|
|
if (this.items[index]) {
|
|
this.items[index].classList.add(className);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Remove class name of item
|
|
* @param {number} index - index of item
|
|
* @param {string} className - class name to remove
|
|
*/
|
|
|
|
}, {
|
|
key: 'removeClass',
|
|
value: function removeClass(index, className) {
|
|
if (this.items[index]) {
|
|
this.items[index].classList.remove(className);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Toggle class name of item
|
|
* @param {number} index - index of item
|
|
* @param {string} className - class name to remove
|
|
*/
|
|
|
|
}, {
|
|
key: 'toggleClass',
|
|
value: function toggleClass(index, className) {
|
|
if (this.items[index]) {
|
|
this.items[index].classList.toggle(className);
|
|
}
|
|
}
|
|
}]);
|
|
|
|
return Panel;
|
|
}();
|
|
|
|
exports.default = Panel;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/rotate.js":
|
|
/*!*****************************!*\
|
|
!*** ./src/js/ui/rotate.js ***!
|
|
\*****************************/
|
|
/*! no static exports found */
|
|
/***/ (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__(/*! @/ui/tools/range */ "./src/js/ui/tools/range.js");
|
|
|
|
var _range2 = _interopRequireDefault(_range);
|
|
|
|
var _submenuBase = __webpack_require__(/*! @/ui/submenuBase */ "./src/js/ui/submenuBase.js");
|
|
|
|
var _submenuBase2 = _interopRequireDefault(_submenuBase);
|
|
|
|
var _rotate = __webpack_require__(/*! @/ui/template/submenu/rotate */ "./src/js/ui/template/submenu/rotate.js");
|
|
|
|
var _rotate2 = _interopRequireDefault(_rotate);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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 locale = _ref.locale,
|
|
makeSvgIcon = _ref.makeSvgIcon,
|
|
menuBarPosition = _ref.menuBarPosition,
|
|
usageStatistics = _ref.usageStatistics;
|
|
|
|
_classCallCheck(this, Rotate);
|
|
|
|
var _this = _possibleConstructorReturn(this, (Rotate.__proto__ || Object.getPrototypeOf(Rotate)).call(this, subMenuElement, {
|
|
locale: locale,
|
|
name: 'rotate',
|
|
makeSvgIcon: makeSvgIcon,
|
|
menuBarPosition: menuBarPosition,
|
|
templateHtml: _rotate2.default,
|
|
usageStatistics: usageStatistics
|
|
}));
|
|
|
|
_this._value = 0;
|
|
|
|
_this._els = {
|
|
rotateButton: _this.selector('.tie-rotate-button'),
|
|
rotateRange: new _range2.default({
|
|
slider: _this.selector('.tie-rotate-range'),
|
|
input: _this.selector('.tie-rotate-range-value')
|
|
}, _consts.defaultRotateRangeValues)
|
|
};
|
|
return _this;
|
|
}
|
|
|
|
/**
|
|
* Destroys the instance.
|
|
*/
|
|
|
|
|
|
_createClass(Rotate, [{
|
|
key: 'destroy',
|
|
value: function destroy() {
|
|
this._removeEvent();
|
|
this._els.rotateRange.destroy();
|
|
|
|
(0, _util.assignmentForDestroy)(this);
|
|
}
|
|
}, {
|
|
key: 'setRangeBarAngle',
|
|
value: function setRangeBarAngle(type, angle) {
|
|
var resultAngle = angle;
|
|
|
|
if (type === 'rotate') {
|
|
resultAngle = parseInt(this._els.rotateRange.value, 10) + angle;
|
|
}
|
|
|
|
this._setRangeBarRatio(resultAngle);
|
|
}
|
|
}, {
|
|
key: '_setRangeBarRatio',
|
|
value: function _setRangeBarRatio(angle) {
|
|
this._els.rotateRange.value = angle;
|
|
}
|
|
|
|
/**
|
|
* Add event for rotate
|
|
* @param {Object} actions - actions for crop
|
|
* @param {Function} actions.rotate - rotate action
|
|
* @param {Function} actions.setAngle - set angle action
|
|
*/
|
|
|
|
}, {
|
|
key: 'addEvent',
|
|
value: function addEvent(actions) {
|
|
this.eventHandler.rotationAngleChanged = this._changeRotateForButton.bind(this);
|
|
|
|
// {rotate, setAngle}
|
|
this.actions = actions;
|
|
this._els.rotateButton.addEventListener('click', this.eventHandler.rotationAngleChanged);
|
|
this._els.rotateRange.on('change', this._changeRotateForRange.bind(this));
|
|
}
|
|
|
|
/**
|
|
* Remove event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_removeEvent',
|
|
value: function _removeEvent() {
|
|
this._els.rotateButton.removeEventListener('click', this.eventHandler.rotationAngleChanged);
|
|
this._els.rotateRange.off();
|
|
}
|
|
|
|
/**
|
|
* Change rotate for range
|
|
* @param {number} value - angle value
|
|
* @param {boolean} isLast - Is last change
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_changeRotateForRange',
|
|
value: function _changeRotateForRange(value, isLast) {
|
|
var angle = (0, _util.toInteger)(value);
|
|
this.actions.setAngle(angle, !isLast);
|
|
this._value = 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');
|
|
var angle = this._els.rotateRange.value;
|
|
|
|
if (button) {
|
|
var rotateType = this.getButtonType(button, ['counterclockwise', 'clockwise']);
|
|
var rotateAngle = {
|
|
clockwise: CLOCKWISE,
|
|
counterclockwise: COUNTERCLOCKWISE
|
|
}[rotateType];
|
|
var newAngle = parseInt(angle, 10) + rotateAngle;
|
|
var isRotatable = newAngle >= -360 && newAngle <= 360;
|
|
if (isRotatable) {
|
|
this.actions.rotate(rotateAngle);
|
|
}
|
|
}
|
|
}
|
|
}]);
|
|
|
|
return Rotate;
|
|
}(_submenuBase2.default);
|
|
|
|
exports.default = Rotate;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/shape.js":
|
|
/*!****************************!*\
|
|
!*** ./src/js/ui/shape.js ***!
|
|
\****************************/
|
|
/*! no static exports found */
|
|
/***/ (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__(/*! @/ui/tools/colorpicker */ "./src/js/ui/tools/colorpicker.js");
|
|
|
|
var _colorpicker2 = _interopRequireDefault(_colorpicker);
|
|
|
|
var _range = __webpack_require__(/*! @/ui/tools/range */ "./src/js/ui/tools/range.js");
|
|
|
|
var _range2 = _interopRequireDefault(_range);
|
|
|
|
var _submenuBase = __webpack_require__(/*! @/ui/submenuBase */ "./src/js/ui/submenuBase.js");
|
|
|
|
var _submenuBase2 = _interopRequireDefault(_submenuBase);
|
|
|
|
var _shape = __webpack_require__(/*! @/ui/template/submenu/shape */ "./src/js/ui/template/submenu/shape.js");
|
|
|
|
var _shape2 = _interopRequireDefault(_shape);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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 locale = _ref.locale,
|
|
makeSvgIcon = _ref.makeSvgIcon,
|
|
menuBarPosition = _ref.menuBarPosition,
|
|
usageStatistics = _ref.usageStatistics;
|
|
|
|
_classCallCheck(this, Shape);
|
|
|
|
var _this = _possibleConstructorReturn(this, (Shape.__proto__ || Object.getPrototypeOf(Shape)).call(this, subMenuElement, {
|
|
locale: locale,
|
|
name: 'shape',
|
|
makeSvgIcon: makeSvgIcon,
|
|
menuBarPosition: menuBarPosition,
|
|
templateHtml: _shape2.default,
|
|
usageStatistics: usageStatistics
|
|
}));
|
|
|
|
_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({
|
|
slider: _this.selector('.tie-stroke-range'),
|
|
input: _this.selector('.tie-stroke-range-value')
|
|
}, _consts.defaultShapeStrokeValues),
|
|
fillColorpicker: new _colorpicker2.default(_this.selector('.tie-color-fill'), '', _this.toggleDirection, _this.usageStatistics),
|
|
strokeColorpicker: new _colorpicker2.default(_this.selector('.tie-color-stroke'), '#ffbb3b', _this.toggleDirection, _this.usageStatistics)
|
|
};
|
|
|
|
_this.colorPickerControls.push(_this._els.fillColorpicker);
|
|
_this.colorPickerControls.push(_this._els.strokeColorpicker);
|
|
return _this;
|
|
}
|
|
|
|
/**
|
|
* Destroys the instance.
|
|
*/
|
|
|
|
|
|
_createClass(Shape, [{
|
|
key: 'destroy',
|
|
value: function destroy() {
|
|
this._removeEvent();
|
|
this._els.strokeRange.destroy();
|
|
this._els.fillColorpicker.destroy();
|
|
this._els.strokeColorpicker.destroy();
|
|
|
|
(0, _util.assignmentForDestroy)(this);
|
|
}
|
|
|
|
/**
|
|
* Add event for shape
|
|
* @param {Object} actions - actions for shape
|
|
* @param {Function} actions.changeShape - change shape mode
|
|
* @param {Function} actions.setDrawingShape - set drawing shape
|
|
*/
|
|
|
|
}, {
|
|
key: 'addEvent',
|
|
value: function addEvent(actions) {
|
|
this.eventHandler.shapeTypeSelected = this._changeShapeHandler.bind(this);
|
|
this.actions = actions;
|
|
|
|
this._els.shapeSelectButton.addEventListener('click', this.eventHandler.shapeTypeSelected);
|
|
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));
|
|
}
|
|
|
|
/**
|
|
* Remove event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_removeEvent',
|
|
value: function _removeEvent() {
|
|
this._els.shapeSelectButton.removeEventListener('click', this.eventHandler.shapeTypeSelected);
|
|
this._els.strokeRange.off();
|
|
this._els.fillColorpicker.off();
|
|
this._els.strokeColorpicker.off();
|
|
}
|
|
|
|
/**
|
|
* 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.strokeColorpicker.color = strokeColor;
|
|
this._els.fillColorpicker.color = fillColor;
|
|
this.options.stroke = strokeColor;
|
|
this.options.fill = fillColor;
|
|
this.options.strokeWidth = strokeWidth;
|
|
|
|
this.actions.setDrawingShape(this.type, { 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.defaultShapeStrokeValues.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
|
|
* @param {boolean} isLast - Is last change
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_changeStrokeRangeHandler',
|
|
value: function _changeStrokeRangeHandler(value, isLast) {
|
|
this.options.strokeWidth = (0, _util.toInteger)(value);
|
|
this.actions.changeShape({
|
|
strokeWidth: value
|
|
}, !isLast);
|
|
|
|
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;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/submenuBase.js":
|
|
/*!**********************************!*\
|
|
!*** ./src/js/ui/submenuBase.js ***!
|
|
\**********************************/
|
|
/*! no static exports found */
|
|
/***/ (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; }; }();
|
|
|
|
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 () {
|
|
/**
|
|
* @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
|
|
* @param {boolean} [usageStatistics=false] - template for SubMenuElement
|
|
*/
|
|
function Submenu(subMenuElement, _ref) {
|
|
var locale = _ref.locale,
|
|
name = _ref.name,
|
|
makeSvgIcon = _ref.makeSvgIcon,
|
|
menuBarPosition = _ref.menuBarPosition,
|
|
templateHtml = _ref.templateHtml,
|
|
usageStatistics = _ref.usageStatistics;
|
|
|
|
_classCallCheck(this, Submenu);
|
|
|
|
this.subMenuElement = subMenuElement;
|
|
this.menuBarPosition = menuBarPosition;
|
|
this.toggleDirection = menuBarPosition === 'top' ? 'down' : 'up';
|
|
this.colorPickerControls = [];
|
|
this.usageStatistics = usageStatistics;
|
|
this.eventHandler = {};
|
|
this._makeSubMenuElement({
|
|
locale: locale,
|
|
name: name,
|
|
makeSvgIcon: makeSvgIcon,
|
|
templateHtml: templateHtml
|
|
});
|
|
}
|
|
|
|
/**
|
|
* editor dom ui query selector
|
|
* @param {string} selectName - query selector string name
|
|
* @returns {HTMLElement}
|
|
*/
|
|
|
|
|
|
_createClass(Submenu, [{
|
|
key: 'selector',
|
|
value: function selector(selectName) {
|
|
return this.subMenuElement.querySelector(selectName);
|
|
}
|
|
|
|
/**
|
|
* change show state change for colorpicker instance
|
|
* @param {Colorpicker} occurredControl - target Colorpicker Instance
|
|
*/
|
|
|
|
}, {
|
|
key: 'colorPickerChangeShow',
|
|
value: function colorPickerChangeShow(occurredControl) {
|
|
this.colorPickerControls.forEach(function (pickerControl) {
|
|
if (occurredControl !== pickerControl) {
|
|
pickerControl.hide();
|
|
}
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Get button type
|
|
* @param {HTMLElement} button - event target element
|
|
* @param {array} buttonNames - Array of button names
|
|
* @returns {string} - button type
|
|
*/
|
|
|
|
}, {
|
|
key: 'getButtonType',
|
|
value: function getButtonType(button, buttonNames) {
|
|
return button.className.match(RegExp('(' + buttonNames.join('|') + ')'))[0];
|
|
}
|
|
|
|
/**
|
|
* Get button 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 {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(_ref2) {
|
|
var locale = _ref2.locale,
|
|
name = _ref2.name,
|
|
iconStyle = _ref2.iconStyle,
|
|
makeSvgIcon = _ref2.makeSvgIcon,
|
|
templateHtml = _ref2.templateHtml;
|
|
|
|
var iconSubMenu = document.createElement('div');
|
|
iconSubMenu.className = 'tui-image-editor-menu-' + name;
|
|
iconSubMenu.innerHTML = templateHtml({
|
|
locale: locale,
|
|
iconStyle: iconStyle,
|
|
makeSvgIcon: makeSvgIcon
|
|
});
|
|
|
|
this.subMenuElement.appendChild(iconSubMenu);
|
|
}
|
|
}]);
|
|
|
|
return Submenu;
|
|
}();
|
|
|
|
exports.default = Submenu;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/template/controls.js":
|
|
/*!****************************************!*\
|
|
!*** ./src/js/ui/template/controls.js ***!
|
|
\****************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
exports.default = function (_ref) {
|
|
var locale = _ref.locale,
|
|
biImage = _ref.biImage,
|
|
loadButtonStyle = _ref.loadButtonStyle,
|
|
downloadButtonStyle = _ref.downloadButtonStyle,
|
|
menuBarPosition = _ref.menuBarPosition;
|
|
return '\n <ul class="tui-image-editor-help-menu ' + (0, _util.getHelpMenuBarPosition)(menuBarPosition) + '"></ul>\n <div class="tui-image-editor-controls">\n <div class="tui-image-editor-controls-logo">\n <img src="' + biImage + '" />\n </div>\n <ul class="tui-image-editor-menu"></ul>\n\n <div class="tui-image-editor-controls-buttons">\n <div style="' + loadButtonStyle + '">\n ' + locale.localize('Load') + '\n <input type="file" class="tui-image-editor-load-btn" />\n </div>\n <button class="tui-image-editor-download-btn" style="' + downloadButtonStyle + '">\n ' + locale.localize('Download') + '\n </button>\n </div>\n </div>\n';
|
|
};
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/template/mainContainer.js":
|
|
/*!*********************************************!*\
|
|
!*** ./src/js/ui/template/mainContainer.js ***!
|
|
\*********************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
exports.default = function (_ref) {
|
|
var locale = _ref.locale,
|
|
biImage = _ref.biImage,
|
|
commonStyle = _ref.commonStyle,
|
|
headerStyle = _ref.headerStyle,
|
|
loadButtonStyle = _ref.loadButtonStyle,
|
|
downloadButtonStyle = _ref.downloadButtonStyle,
|
|
submenuStyle = _ref.submenuStyle;
|
|
return '\n <div class="tui-image-editor-main-container" style="' + commonStyle + '">\n <div class="tui-image-editor-header" style="' + headerStyle + '">\n <div class="tui-image-editor-header-logo">\n <img src="' + biImage + '" />\n </div>\n <div class="tui-image-editor-header-buttons">\n <div style="' + loadButtonStyle + '">\n ' + locale.localize('Load') + '\n <input type="file" class="tui-image-editor-load-btn" />\n </div>\n <button class="tui-image-editor-download-btn" style="' + downloadButtonStyle + '">\n ' + locale.localize('Download') + '\n </button>\n </div>\n </div>\n <div class="tui-image-editor-main">\n <div class="tui-image-editor-submenu">\n <div class="tui-image-editor-submenu-style" style="' + submenuStyle + '"></div>\n </div>\n <div class="tui-image-editor-wrap">\n <div class="tui-image-editor-size-wrap">\n <div class="tui-image-editor-align-wrap">\n <div class="tui-image-editor"></div>\n </div>\n </div>\n </div>\n </div>\n </div>\n';
|
|
};
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/template/style.js":
|
|
/*!*************************************!*\
|
|
!*** ./src/js/ui/template/style.js ***!
|
|
\*************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"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,
|
|
submenuDisabledRangePointer = _ref.submenuDisabledRangePointer,
|
|
submenuDisabledRangeBar = _ref.submenuDisabledRangeBar,
|
|
submenuDisabledRangeSubbar = _ref.submenuDisabledRangeSubbar,
|
|
submenuIconSize = _ref.submenuIconSize,
|
|
menuIconSize = _ref.menuIconSize,
|
|
biSize = _ref.biSize,
|
|
menuIconStyle = _ref.menuIconStyle,
|
|
submenuIconStyle = _ref.submenuIconStyle;
|
|
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-star-2 .tui-image-editor-button[data-icontype=\"icon-star-2\"] 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 label > span {\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 .tui-image-editor-container .tui-image-editor-range-wrap.tui-image-editor-newline.short label > span {\n " + subMenuLabelNormal + "\n }\n .tui-image-editor-container .tui-image-editor-range-wrap label > span {\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 label > span:before {\n " + submenuCheckbox + "\n }\n .tui-image-editor-container .tui-image-editor-checkbox label > input:checked + span: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 .tui-image-editor-menu use.normal.use-default,\n .tui-image-editor-help-menu use.normal.use-default {\n fill-rule: evenodd;\n fill: " + menuIconStyle.normal.color + ";\n stroke: " + menuIconStyle.normal.color + ";\n }\n .tui-image-editor-menu use.active.use-default,\n .tui-image-editor-help-menu use.active.use-default {\n fill-rule: evenodd;\n fill: " + menuIconStyle.active.color + ";\n stroke: " + menuIconStyle.active.color + ";\n }\n .tui-image-editor-menu use.hover.use-default,\n .tui-image-editor-help-menu use.hover.use-default {\n fill-rule: evenodd;\n fill: " + menuIconStyle.hover.color + ";\n stroke: " + menuIconStyle.hover.color + ";\n }\n .tui-image-editor-menu use.disabled.use-default,\n .tui-image-editor-help-menu use.disabled.use-default {\n fill-rule: evenodd;\n fill: " + menuIconStyle.disabled.color + ";\n stroke: " + menuIconStyle.disabled.color + ";\n }\n .tui-image-editor-submenu use.normal.use-default {\n fill-rule: evenodd;\n fill: " + submenuIconStyle.normal.color + ";\n stroke: " + submenuIconStyle.normal.color + ";\n }\n .tui-image-editor-submenu use.active.use-default {\n fill-rule: evenodd;\n fill: " + submenuIconStyle.active.color + ";\n stroke: " + submenuIconStyle.active.color + ";\n }\n";
|
|
};
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/template/submenu/crop.js":
|
|
/*!********************************************!*\
|
|
!*** ./src/js/ui/template/submenu/crop.js ***!
|
|
\********************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
/**
|
|
* @param {Object} submenuInfo - submenu info for make template
|
|
* @param {Locale} locale - Translate text
|
|
* @param {Function} makeSvgIcon - svg icon generator
|
|
* @returns {string}
|
|
*/
|
|
exports.default = function (_ref) {
|
|
var locale = _ref.locale,
|
|
makeSvgIcon = _ref.makeSvgIcon;
|
|
return '\n <ul class="tui-image-editor-submenu-item">\n <li class="tie-crop-preset-button">\n <div class="tui-image-editor-button preset preset-none active">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'shape-rectangle', true) + '\n </div>\n <label> ' + locale.localize('Custom') + ' </label>\n </div>\n <div class="tui-image-editor-button preset preset-square">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'crop', true) + '\n </div>\n <label> ' + locale.localize('Square') + ' </label>\n </div>\n <div class="tui-image-editor-button preset preset-3-2">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'crop', true) + '\n </div>\n <label> ' + locale.localize('3:2') + ' </label>\n </div>\n <div class="tui-image-editor-button preset preset-4-3">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'crop', true) + '\n </div>\n <label> ' + locale.localize('4:3') + ' </label>\n </div>\n <div class="tui-image-editor-button preset preset-5-4">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'crop', true) + '\n </div>\n <label> ' + locale.localize('5:4') + ' </label>\n </div>\n <div class="tui-image-editor-button preset preset-7-5">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'crop', true) + '\n </div>\n <label> ' + locale.localize('7:5') + ' </label>\n </div>\n <div class="tui-image-editor-button preset preset-16-9">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'crop', true) + '\n </div>\n <label> ' + locale.localize('16:9') + ' </label>\n </div>\n </li>\n <li class="tui-image-editor-partition tui-image-editor-newline">\n </li>\n <li class="tui-image-editor-partition only-left-right">\n <div></div>\n </li>\n <li class="tie-crop-button action">\n <div class="tui-image-editor-button apply">\n ' + makeSvgIcon(['normal', 'active'], 'apply') + '\n <label>\n ' + locale.localize('Apply') + '\n </label>\n </div>\n <div class="tui-image-editor-button cancel">\n ' + makeSvgIcon(['normal', 'active'], 'cancel') + '\n <label>\n ' + locale.localize('Cancel') + '\n </label>\n </div>\n </li>\n </ul>\n';
|
|
};
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/template/submenu/draw.js":
|
|
/*!********************************************!*\
|
|
!*** ./src/js/ui/template/submenu/draw.js ***!
|
|
\********************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
/**
|
|
* @param {Object} submenuInfo - submenu info for make template
|
|
* @param {Locale} locale - Translate text
|
|
* @param {Function} makeSvgIcon - svg icon generator
|
|
* @returns {string}
|
|
*/
|
|
exports.default = function (_ref) {
|
|
var locale = _ref.locale,
|
|
makeSvgIcon = _ref.makeSvgIcon;
|
|
return '\n <ul class="tui-image-editor-submenu-item">\n <li class="tie-draw-line-select-button">\n <div class="tui-image-editor-button free">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'draw-free', true) + '\n </div>\n <label>\n ' + locale.localize('Free') + '\n </label>\n </div>\n <div class="tui-image-editor-button line">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'draw-line', true) + '\n </div>\n <label>\n ' + locale.localize('Straight') + '\n </label>\n </div>\n </li>\n <li class="tui-image-editor-partition">\n <div></div>\n </li>\n <li>\n <div class="tie-draw-color" title="' + locale.localize('Color') + '"></div>\n </li>\n <li class="tui-image-editor-partition only-left-right">\n <div></div>\n </li>\n <li class="tui-image-editor-newline tui-image-editor-range-wrap">\n <label class="range">' + locale.localize('Range') + '</label>\n <div class="tie-draw-range"></div>\n <input class="tie-draw-range-value tui-image-editor-range-value" value="0" />\n </li>\n </ul>\n';
|
|
};
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/template/submenu/filter.js":
|
|
/*!**********************************************!*\
|
|
!*** ./src/js/ui/template/submenu/filter.js ***!
|
|
\**********************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
/**
|
|
* @param {Locale} locale - Translate text
|
|
* @returns {string}
|
|
*/
|
|
exports.default = function (_ref) {
|
|
var locale = _ref.locale;
|
|
return '\n <ul class="tui-image-editor-submenu-item">\n <li class="tui-image-editor-submenu-align">\n <div class="tui-image-editor-checkbox-wrap fixed-width">\n <div class="tui-image-editor-checkbox">\n <label>\n <input type="checkbox" class="tie-grayscale">\n <span>' + locale.localize('Grayscale') + '</span>\n </label>\n </div>\n <div class="tui-image-editor-checkbox">\n <label>\n <input type="checkbox" class="tie-invert">\n <span>' + locale.localize('Invert') + '</span>\n </label>\n </div>\n <div class="tui-image-editor-checkbox">\n <label>\n <input type="checkbox" class="tie-sepia">\n <span>' + locale.localize('Sepia') + '</span>\n </label>\n </div>\n <div class="tui-image-editor-checkbox">\n <label>\n <input type="checkbox" class="tie-vintage">\n <span>' + locale.localize('Sepia2') + '</span>\n </label>\n </div>\n <div class="tui-image-editor-checkbox">\n <label>\n <input type="checkbox" class="tie-blur">\n <span>' + locale.localize('Blur') + '</span>\n </label>\n </div>\n <div class="tui-image-editor-checkbox">\n <label>\n <input type="checkbox" class="tie-sharpen">\n <span>' + locale.localize('Sharpen') + '</span>\n </label>\n </div>\n <div class="tui-image-editor-checkbox">\n <label>\n <input type="checkbox" class="tie-emboss">\n <span>' + locale.localize('Emboss') + '</span>\n </label>\n </div>\n </div>\n </li>\n <li class="tui-image-editor-partition">\n <div></div>\n </li>\n <li class="tui-image-editor-submenu-align">\n <div class="tui-image-editor-checkbox-group tui-image-editor-disabled" style="margin-bottom: 7px;">\n <div class="tui-image-editor-checkbox-wrap">\n <div class="tui-image-editor-checkbox">\n <label>\n <input type="checkbox" class="tie-remove-white">\n <span>' + locale.localize('Remove White') + '</span>\n </label>\n </div>\n </div>\n <div class="tui-image-editor-newline tui-image-editor-range-wrap short">\n <label>' + locale.localize('Distance') + '</label>\n <div class="tie-removewhite-distance-range"></div>\n </div>\n </div>\n <div class="tui-image-editor-checkbox-group tui-image-editor-disabled">\n <div class="tui-image-editor-checkbox">\n <label>\n <input type="checkbox" class="tie-brightness">\n <span>' + locale.localize('Brightness') + '</span>\n </label>\n </div>\n <div class="tui-image-editor-range-wrap short">\n <div class="tie-brightness-range"></div>\n </div>\n </div>\n <div class="tui-image-editor-checkbox-group tui-image-editor-disabled">\n <div class="tui-image-editor-checkbox">\n <label>\n <input type="checkbox" class="tie-noise">\n <span>' + locale.localize('Noise') + '</span>\n </label>\n </div>\n <div class="tui-image-editor-range-wrap short">\n <div class="tie-noise-range"></div>\n </div>\n </div>\n </li>\n <li class="tui-image-editor-partition only-left-right">\n <div></div>\n </li>\n <li class="tui-image-editor-submenu-align">\n <div class="tui-image-editor-checkbox-group tui-image-editor-disabled">\n <div class="tui-image-editor-checkbox">\n <label>\n <input type="checkbox" class="tie-pixelate">\n <span>' + locale.localize('Pixelate') + '</span>\n </label>\n </div>\n <div class="tui-image-editor-range-wrap short">\n <div class="tie-pixelate-range"></div>\n </div>\n </div>\n <div class="tui-image-editor-checkbox-group tui-image-editor-disabled">\n <div class="tui-image-editor-newline tui-image-editor-checkbox-wrap">\n <div class="tui-image-editor-checkbox">\n <label>\n <input type="checkbox" class="tie-color-filter">\n <span>' + locale.localize('Color Filter') + '</span>\n </label>\n </div>\n </div>\n <div class="tui-image-editor-newline tui-image-editor-range-wrap short">\n <label>' + locale.localize('Threshold') + '</label>\n <div class="tie-colorfilter-threshold-range"></div>\n </div>\n </div>\n </li>\n <li class="tui-image-editor-partition">\n <div></div>\n </li>\n <li>\n <div class="filter-color-item">\n <div class="tie-filter-tint-color" title="' + locale.localize('Tint') + '"></div>\n <div class="tui-image-editor-checkbox">\n <label>\n <input type="checkbox" class="tie-tint">\n <span></span>\n </label>\n </div>\n </div>\n <div class="filter-color-item">\n <div class="tie-filter-multiply-color" title="' + locale.localize('Multiply') + '"></div>\n <div class="tui-image-editor-checkbox">\n <label>\n <input type="checkbox" class="tie-multiply">\n <span></span>\n </label>\n </div>\n </div>\n <div class="filter-color-item">\n <div class="tie-filter-blend-color" title="' + locale.localize('Blend') + '"></div>\n <div class="tui-image-editor-checkbox">\n <label>\n <input type="checkbox" class="tie-blend">\n <span></span>\n </label>\n </div>\n </div>\n </li>\n </ul>\n';
|
|
};
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/template/submenu/flip.js":
|
|
/*!********************************************!*\
|
|
!*** ./src/js/ui/template/submenu/flip.js ***!
|
|
\********************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
/**
|
|
* @param {Object} submenuInfo - submenu info for make template
|
|
* @param {Locale} locale - Translate text
|
|
* @param {Function} makeSvgIcon - svg icon generator
|
|
* @returns {string}
|
|
*/
|
|
exports.default = function (_ref) {
|
|
var locale = _ref.locale,
|
|
makeSvgIcon = _ref.makeSvgIcon;
|
|
return '\n <ul class="tie-flip-button tui-image-editor-submenu-item">\n <li>\n <div class="tui-image-editor-button flipX">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'flip-x', true) + '\n </div>\n <label>\n ' + locale.localize('Flip X') + '\n </label>\n </div>\n <div class="tui-image-editor-button flipY">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'flip-y', true) + '\n </div>\n <label>\n ' + locale.localize('Flip Y') + '\n </label>\n </div>\n </li>\n <li class="tui-image-editor-partition">\n <div></div>\n </li>\n <li>\n <div class="tui-image-editor-button resetFlip">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'flip-reset', true) + '\n </div>\n <label>\n ' + locale.localize('Reset') + '\n </label>\n </div>\n </li>\n </ul>\n';
|
|
};
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/template/submenu/history.js":
|
|
/*!***********************************************!*\
|
|
!*** ./src/js/ui/template/submenu/history.js ***!
|
|
\***********************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
/**
|
|
* @param {Object} submenuInfo - submenu info for make template
|
|
* @param {Locale} locale - Translate text
|
|
* @param {Function} makeSvgIcon - svg icon generator
|
|
* @param {string} name - history name
|
|
* @param {string} detail - history detail information
|
|
* @returns {string}
|
|
*/
|
|
exports.default = function (_ref) {
|
|
var locale = _ref.locale,
|
|
makeSvgIcon = _ref.makeSvgIcon,
|
|
name = _ref.name,
|
|
detail = _ref.detail;
|
|
return '\n <div class="tui-image-editor-history-item history">\n <div class="history-item-icon">\n ' + makeSvgIcon(['normal', 'active'], 'history-' + name.toLowerCase(), true) + '\n </div>\n <span>\n ' + locale.localize(name) + '\n ' + (detail ? '(' + locale.localize(detail) + ')' : '') + '\n </span>\n <div class="history-item-checkbox">\n ' + makeSvgIcon(['normal'], 'history-check', true) + '\n </div>\n </div>\n';
|
|
};
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/template/submenu/icon.js":
|
|
/*!********************************************!*\
|
|
!*** ./src/js/ui/template/submenu/icon.js ***!
|
|
\********************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
/**
|
|
* @param {Object} submenuInfo - submenu info for make template
|
|
* @param {Locale} locale - Translate text
|
|
* @param {Function} makeSvgIcon - svg icon generator
|
|
* @returns {string}
|
|
*/
|
|
exports.default = function (_ref) {
|
|
var locale = _ref.locale,
|
|
makeSvgIcon = _ref.makeSvgIcon;
|
|
return '\n <ul class="tui-image-editor-submenu-item">\n <li class="tie-icon-add-button">\n <div class="tui-image-editor-button" data-icontype="icon-arrow">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'icon-arrow', true) + '\n </div>\n <label>\n ' + locale.localize('Arrow') + '\n </label>\n </div>\n <div class="tui-image-editor-button" data-icontype="icon-arrow-2">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'icon-arrow-2', true) + '\n </div>\n <label>\n ' + locale.localize('Arrow-2') + '\n </label>\n </div>\n <div class="tui-image-editor-button" data-icontype="icon-arrow-3">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'icon-arrow-3', true) + '\n </div>\n <label>\n ' + locale.localize('Arrow-3') + '\n </label>\n </div>\n <div class="tui-image-editor-button" data-icontype="icon-star">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'icon-star', true) + '\n </div>\n <label>\n ' + locale.localize('Star-1') + '\n </label>\n </div>\n <div class="tui-image-editor-button" data-icontype="icon-star-2">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'icon-star-2', true) + '\n </div>\n <label>\n ' + locale.localize('Star-2') + '\n </label>\n </div>\n\n <div class="tui-image-editor-button" data-icontype="icon-polygon">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'icon-polygon', true) + '\n </div>\n <label>\n ' + locale.localize('Polygon') + '\n </label>\n </div>\n\n <div class="tui-image-editor-button" data-icontype="icon-location">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'icon-location', true) + '\n </div>\n <label>\n ' + locale.localize('Location') + '\n </label>\n </div>\n\n <div class="tui-image-editor-button" data-icontype="icon-heart">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'icon-heart', true) + '\n </div>\n <label>\n ' + locale.localize('Heart') + '\n </label>\n </div>\n\n <div class="tui-image-editor-button" data-icontype="icon-bubble">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'icon-bubble', true) + '\n </div>\n <label>\n ' + locale.localize('Bubble') + '\n </label>\n </div>\n </li>\n <li class="tui-image-editor-partition">\n <div></div>\n </li>\n <li class="tie-icon-add-button">\n <div class="tui-image-editor-button" style="margin:0">\n <div>\n <input type="file" accept="image/*" class="tie-icon-image-file">\n ' + makeSvgIcon(['normal', 'active'], 'icon-load', true) + '\n </div>\n <label>\n ' + locale.localize('Custom icon') + '\n </label>\n </div>\n </li>\n <li class="tui-image-editor-partition">\n <div></div>\n </li>\n <li>\n <div class="tie-icon-color" title="' + locale.localize('Color') + '"></div>\n </li>\n </ul>\n';
|
|
};
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/template/submenu/mask.js":
|
|
/*!********************************************!*\
|
|
!*** ./src/js/ui/template/submenu/mask.js ***!
|
|
\********************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
/**
|
|
* @param {Object} submenuInfo - submenu info for make template
|
|
* @param {Locale} locale - Translate text
|
|
* @param {Function} makeSvgIcon - svg icon generator
|
|
* @returns {string}
|
|
*/
|
|
exports.default = function (_ref) {
|
|
var locale = _ref.locale,
|
|
makeSvgIcon = _ref.makeSvgIcon;
|
|
return '\n <ul class="tui-image-editor-submenu-item">\n <li>\n <div class="tui-image-editor-button">\n <div>\n <input type="file" accept="image/*" class="tie-mask-image-file">\n ' + makeSvgIcon(['normal', 'active'], 'mask-load', true) + '\n </div>\n <label> ' + locale.localize('Load Mask Image') + ' </label>\n </div>\n </li>\n <li class="tui-image-editor-partition only-left-right">\n <div></div>\n </li>\n <li class="tie-mask-apply tui-image-editor-newline apply" style="margin-top: 22px;margin-bottom: 5px">\n <div class="tui-image-editor-button apply">\n ' + makeSvgIcon(['normal', 'active'], 'apply') + '\n <label>\n ' + locale.localize('Apply') + '\n </label>\n </div>\n </li>\n </ul>\n';
|
|
};
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/template/submenu/rotate.js":
|
|
/*!**********************************************!*\
|
|
!*** ./src/js/ui/template/submenu/rotate.js ***!
|
|
\**********************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
/**
|
|
* @param {Object} submenuInfo - submenu info for make template
|
|
* @param {Locale} locale - Translate text
|
|
* @param {Function} makeSvgIcon - svg icon generator
|
|
* @returns {string}
|
|
*/
|
|
exports.default = function (_ref) {
|
|
var locale = _ref.locale,
|
|
makeSvgIcon = _ref.makeSvgIcon;
|
|
return '\n <ul class="tui-image-editor-submenu-item">\n <li class="tie-rotate-button">\n <div class="tui-image-editor-button clockwise">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'rotate-clockwise', true) + '\n </div>\n <label> 30 </label>\n </div>\n <div class="tui-image-editor-button counterclockwise">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'rotate-counterclockwise', true) + '\n </div>\n <label> -30 </label>\n </div>\n </li>\n <li class="tui-image-editor-partition only-left-right">\n <div></div>\n </li>\n <li class="tui-image-editor-newline tui-image-editor-range-wrap">\n <label class="range">' + locale.localize('Range') + '</label>\n <div class="tie-rotate-range"></div>\n <input class="tie-rotate-range-value tui-image-editor-range-value" value="0" />\n </li>\n </ul>\n';
|
|
};
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/template/submenu/shape.js":
|
|
/*!*********************************************!*\
|
|
!*** ./src/js/ui/template/submenu/shape.js ***!
|
|
\*********************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
/**
|
|
* @param {Object} submenuInfo - submenu info for make template
|
|
* @param {Locale} locale - Translate text
|
|
* @param {Function} makeSvgIcon - svg icon generator
|
|
* @returns {string}
|
|
*/
|
|
exports.default = function (_ref) {
|
|
var locale = _ref.locale,
|
|
makeSvgIcon = _ref.makeSvgIcon;
|
|
return '\n <ul class="tui-image-editor-submenu-item">\n <li class="tie-shape-button">\n <div class="tui-image-editor-button rect">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'shape-rectangle', true) + '\n </div>\n <label> ' + locale.localize('Rectangle') + ' </label>\n </div>\n <div class="tui-image-editor-button circle">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'shape-circle', true) + '\n </div>\n <label> ' + locale.localize('Circle') + ' </label>\n </div>\n <div class="tui-image-editor-button triangle">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'shape-triangle', true) + '\n </div>\n <label> ' + locale.localize('Triangle') + ' </label>\n </div>\n </li>\n <li class="tui-image-editor-partition">\n <div></div>\n </li>\n <li class="tie-shape-color-button">\n <div class="tie-color-fill" title="' + locale.localize('Fill') + '"></div>\n <div class="tie-color-stroke" title="' + locale.localize('Stroke') + '"></div>\n </li>\n <li class="tui-image-editor-partition only-left-right">\n <div></div>\n </li>\n <li class="tui-image-editor-newline tui-image-editor-range-wrap">\n <label class="range">' + locale.localize('Stroke') + '</label>\n <div class="tie-stroke-range"></div>\n <input class="tie-stroke-range-value tui-image-editor-range-value" value="0" />\n </li>\n </ul>\n';
|
|
};
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/template/submenu/text.js":
|
|
/*!********************************************!*\
|
|
!*** ./src/js/ui/template/submenu/text.js ***!
|
|
\********************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
/**
|
|
* @param {Object} submenuInfo - submenu info for make template
|
|
* @param {Locale} locale - Translate text
|
|
* @param {Function} makeSvgIcon - svg icon generator
|
|
* @returns {string}
|
|
*/
|
|
exports.default = function (_ref) {
|
|
var locale = _ref.locale,
|
|
makeSvgIcon = _ref.makeSvgIcon;
|
|
return '\n <ul class="tui-image-editor-submenu-item">\n <li class="tie-text-effect-button">\n <div class="tui-image-editor-button bold">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'text-bold', true) + '\n </div>\n <label> ' + locale.localize('Bold') + ' </label>\n </div>\n <div class="tui-image-editor-button italic">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'text-italic', true) + '\n </div>\n <label> ' + locale.localize('Italic') + ' </label>\n </div>\n <div class="tui-image-editor-button underline">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'text-underline', true) + '\n </div>\n <label> ' + locale.localize('Underline') + ' </label>\n </div>\n </li>\n <li class="tui-image-editor-partition">\n <div></div>\n </li>\n <li class="tie-text-align-button">\n <div class="tui-image-editor-button left">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'text-align-left', true) + '\n </div>\n <label> ' + locale.localize('Left') + ' </label>\n </div>\n <div class="tui-image-editor-button center">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'text-align-center', true) + '\n </div>\n <label> ' + locale.localize('Center') + ' </label>\n </div>\n <div class="tui-image-editor-button right">\n <div>\n ' + makeSvgIcon(['normal', 'active'], 'text-align-right', true) + '\n </div>\n <label> ' + locale.localize('Right') + ' </label>\n </div>\n </li>\n <li class="tui-image-editor-partition">\n <div></div>\n </li>\n <li>\n <div class="tie-text-color" title="' + locale.localize('Color') + '"></div>\n </li>\n <li class="tui-image-editor-partition only-left-right">\n <div></div>\n </li>\n <li class="tui-image-editor-newline tui-image-editor-range-wrap">\n <label class="range">' + locale.localize('Text size') + '</label>\n <div class="tie-text-range"></div>\n <input class="tie-text-range-value tui-image-editor-range-value" value="0" />\n </li>\n </ul>\n';
|
|
};
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/text.js":
|
|
/*!***************************!*\
|
|
!*** ./src/js/ui/text.js ***!
|
|
\***************************/
|
|
/*! no static exports found */
|
|
/***/ (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__(/*! @/ui/tools/range */ "./src/js/ui/tools/range.js");
|
|
|
|
var _range2 = _interopRequireDefault(_range);
|
|
|
|
var _colorpicker = __webpack_require__(/*! @/ui/tools/colorpicker */ "./src/js/ui/tools/colorpicker.js");
|
|
|
|
var _colorpicker2 = _interopRequireDefault(_colorpicker);
|
|
|
|
var _submenuBase = __webpack_require__(/*! @/ui/submenuBase */ "./src/js/ui/submenuBase.js");
|
|
|
|
var _submenuBase2 = _interopRequireDefault(_submenuBase);
|
|
|
|
var _text = __webpack_require__(/*! @/ui/template/submenu/text */ "./src/js/ui/template/submenu/text.js");
|
|
|
|
var _text2 = _interopRequireDefault(_text);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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 locale = _ref.locale,
|
|
makeSvgIcon = _ref.makeSvgIcon,
|
|
menuBarPosition = _ref.menuBarPosition,
|
|
usageStatistics = _ref.usageStatistics;
|
|
|
|
_classCallCheck(this, Text);
|
|
|
|
var _this = _possibleConstructorReturn(this, (Text.__proto__ || Object.getPrototypeOf(Text)).call(this, subMenuElement, {
|
|
locale: locale,
|
|
name: 'text',
|
|
makeSvgIcon: makeSvgIcon,
|
|
menuBarPosition: menuBarPosition,
|
|
templateHtml: _text2.default,
|
|
usageStatistics: usageStatistics
|
|
}));
|
|
|
|
_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, _this.usageStatistics),
|
|
textRange: new _range2.default({
|
|
slider: _this.selector('.tie-text-range'),
|
|
input: _this.selector('.tie-text-range-value')
|
|
}, _consts.defaultTextRangeValues)
|
|
};
|
|
return _this;
|
|
}
|
|
|
|
/**
|
|
* Destroys the instance.
|
|
*/
|
|
|
|
|
|
_createClass(Text, [{
|
|
key: 'destroy',
|
|
value: function destroy() {
|
|
this._removeEvent();
|
|
this._els.textColorpicker.destroy();
|
|
this._els.textRange.destroy();
|
|
|
|
(0, _util.assignmentForDestroy)(this);
|
|
}
|
|
|
|
/**
|
|
* Add event for text
|
|
* @param {Object} actions - actions for text
|
|
* @param {Function} actions.changeTextStyle - change text style
|
|
*/
|
|
|
|
}, {
|
|
key: 'addEvent',
|
|
value: function addEvent(actions) {
|
|
var setTextEffect = this._setTextEffectHandler.bind(this);
|
|
var setTextAlign = this._setTextAlignHandler.bind(this);
|
|
|
|
this.eventHandler = {
|
|
setTextEffect: setTextEffect,
|
|
setTextAlign: setTextAlign
|
|
};
|
|
|
|
this.actions = actions;
|
|
this._els.textEffectButton.addEventListener('click', setTextEffect);
|
|
this._els.textAlignButton.addEventListener('click', setTextAlign);
|
|
this._els.textRange.on('change', this._changeTextRnageHandler.bind(this));
|
|
this._els.textColorpicker.on('change', this._changeColorHandler.bind(this));
|
|
}
|
|
|
|
/**
|
|
* Remove event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_removeEvent',
|
|
value: function _removeEvent() {
|
|
var _eventHandler = this.eventHandler,
|
|
setTextEffect = _eventHandler.setTextEffect,
|
|
setTextAlign = _eventHandler.setTextAlign;
|
|
|
|
|
|
this._els.textEffectButton.removeEventListener('click', setTextEffect);
|
|
this._els.textAlignButton.removeEventListener('click', setTextAlign);
|
|
this._els.textRange.off();
|
|
this._els.textColorpicker.off();
|
|
}
|
|
|
|
/**
|
|
* 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');
|
|
}
|
|
}, {
|
|
key: 'setTextStyleStateOnAction',
|
|
value: function setTextStyleStateOnAction() {
|
|
var textStyle = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
var fill = textStyle.fill,
|
|
fontSize = textStyle.fontSize,
|
|
fontStyle = textStyle.fontStyle,
|
|
fontWeight = textStyle.fontWeight,
|
|
textDecoration = textStyle.textDecoration,
|
|
textAlign = textStyle.textAlign;
|
|
|
|
|
|
this.textColor = fill;
|
|
this.fontSize = fontSize;
|
|
this.setEffectState('italic', fontStyle);
|
|
this.setEffectState('bold', fontWeight);
|
|
this.setEffectState('underline', textDecoration);
|
|
this.setAlignState(textAlign);
|
|
}
|
|
}, {
|
|
key: 'setEffectState',
|
|
value: function setEffectState(effectName, value) {
|
|
var effectValue = value === 'italic' || value === 'bold' || value === 'underline';
|
|
var button = this._els.textEffectButton.querySelector('.tui-image-editor-button.' + effectName);
|
|
|
|
this.effect[effectName] = effectValue;
|
|
|
|
button.classList[effectValue ? 'add' : 'remove']('active');
|
|
}
|
|
}, {
|
|
key: 'setAlignState',
|
|
value: function setAlignState(value) {
|
|
var button = this._els.textAlignButton;
|
|
button.classList.remove(this.align);
|
|
button.classList.add(value);
|
|
this.align = value;
|
|
}
|
|
|
|
/**
|
|
* text effect set handler
|
|
* @param {object} event - add button event object
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_setTextEffectHandler',
|
|
value: function _setTextEffectHandler(event) {
|
|
var button = event.target.closest('.tui-image-editor-button');
|
|
if (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
|
|
* @param {boolean} isLast - Is last change
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_changeTextRnageHandler',
|
|
value: function _changeTextRnageHandler(value, isLast) {
|
|
this.actions.changeTextStyle({
|
|
fontSize: value
|
|
}, !isLast);
|
|
}
|
|
|
|
/**
|
|
* 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',
|
|
set: function set(color) {
|
|
this._els.textColorpicker.color = color;
|
|
}
|
|
|
|
/**
|
|
* Get text color
|
|
* @returns {string} - text color
|
|
*/
|
|
,
|
|
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;
|
|
}
|
|
|
|
/**
|
|
* get font style
|
|
* @returns {string} - font style
|
|
*/
|
|
|
|
}, {
|
|
key: 'fontStyle',
|
|
get: function get() {
|
|
return this.effect.italic ? 'italic' : 'normal';
|
|
}
|
|
|
|
/**
|
|
* get font weight
|
|
* @returns {string} - font weight
|
|
*/
|
|
|
|
}, {
|
|
key: 'fontWeight',
|
|
get: function get() {
|
|
return this.effect.bold ? 'bold' : 'normal';
|
|
}
|
|
|
|
/**
|
|
* get text underline text underline
|
|
* @returns {boolean} - true or false
|
|
*/
|
|
|
|
}, {
|
|
key: 'underline',
|
|
get: function get() {
|
|
return this.effect.underline;
|
|
}
|
|
}]);
|
|
|
|
return Text;
|
|
}(_submenuBase2.default);
|
|
|
|
exports.default = Text;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/theme/standard.js":
|
|
/*!*************************************!*\
|
|
!*** ./src/js/ui/theme/standard.js ***!
|
|
\*************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
/**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview The standard theme
|
|
*/
|
|
|
|
/**
|
|
* Full configuration for theme.<br>
|
|
* @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.color - Menu normal color for default icon
|
|
* @property {string} menu.normalIcon.path - Menu normal icon svg bundle file path
|
|
* @property {string} menu.normalIcon.name - Menu normal icon svg bundle name
|
|
* @property {string} menu.activeIcon.color - Menu active color for default icon
|
|
* @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.disabled.color - Menu disabled color for default icon
|
|
* @property {string} menu.disabled.path - Menu disabled icon svg bundle file path
|
|
* @property {string} menu.disabled.name - Menu disabled icon svg bundle name
|
|
* @property {string} menu.hover.color - Menu default icon hover color
|
|
* @property {string} menu.hover.path - Menu hover icon svg bundle file path
|
|
* @property {string} menu.hover.name - Menu hover 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.color - Submenu normal color for default icon
|
|
* @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.color - Submenu active color for default icon
|
|
* @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',
|
|
|
|
// icons default
|
|
'menu.normalIcon.color': '#8a8a8a',
|
|
'menu.activeIcon.color': '#555555',
|
|
'menu.disabledIcon.color': '#434343',
|
|
'menu.hoverIcon.color': '#e9e9e9',
|
|
'submenu.normalIcon.color': '#8a8a8a',
|
|
'submenu.activeIcon.color': '#e9e9e9',
|
|
|
|
'menu.iconSize.width': '24px',
|
|
'menu.iconSize.height': '24px',
|
|
'submenu.iconSize.width': '32px',
|
|
'submenu.iconSize.height': '32px',
|
|
|
|
// submenu primary color
|
|
'submenu.backgroundColor': '#1e1e1e',
|
|
'submenu.partition.color': '#858585',
|
|
|
|
// 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.disabledPointer.color': '#414141',
|
|
'range.disabledBar.color': '#282828',
|
|
'range.disabledSubbar.color': '#414141',
|
|
|
|
'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': "'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.fontSize': '12px',
|
|
|
|
// main icons
|
|
'menu.normalIcon.color': '#8a8a8a',
|
|
'menu.activeIcon.color': '#555555',
|
|
'menu.disabledIcon.color': '#434343',
|
|
'menu.hoverIcon.color': '#e9e9e9',
|
|
|
|
// submenu icons
|
|
'submenu.normalIcon.color': '#8a8a8a',
|
|
'submenu.activeIcon.color': '#e9e9e9',
|
|
|
|
'menu.iconSize.width': '24px',
|
|
'menu.iconSize.height': '24px',
|
|
|
|
'submenu.iconSize.width': '32px',
|
|
'submenu.iconSize.height': '32px',
|
|
|
|
// submenu primary color
|
|
'submenu.backgroundColor': '#1e1e1e',
|
|
'submenu.partition.color': '#3c3c3c',
|
|
|
|
// submenu labels
|
|
'submenu.normalLabel.color': '#8a8a8a',
|
|
'submenu.normalLabel.fontWeight': 'lighter',
|
|
'submenu.activeLabel.color': '#fff',
|
|
'submenu.activeLabel.fontWeight': 'lighter',
|
|
|
|
// checkbox style
|
|
'checkbox.border': '0px',
|
|
'checkbox.backgroundColor': '#fff',
|
|
|
|
// range style
|
|
'range.pointer.color': '#fff',
|
|
'range.bar.color': '#666',
|
|
'range.subbar.color': '#d1d1d1',
|
|
|
|
'range.disabledPointer.color': '#414141',
|
|
'range.disabledBar.color': '#282828',
|
|
'range.disabledSubbar.color': '#414141',
|
|
|
|
'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'
|
|
};
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/theme/theme.js":
|
|
/*!**********************************!*\
|
|
!*** ./src/js/ui/theme/theme.js ***!
|
|
\**********************************/
|
|
/*! no static exports found */
|
|
/***/ (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__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _style = __webpack_require__(/*! @/ui/template/style */ "./src/js/ui/template/style.js");
|
|
|
|
var _style2 = _interopRequireDefault(_style);
|
|
|
|
var _standard = __webpack_require__(/*! @/ui/theme/standard */ "./src/js/ui/theme/standard.js");
|
|
|
|
var _standard2 = _interopRequireDefault(_standard);
|
|
|
|
var _default = __webpack_require__(/*! @svg/default.svg */ "./src/svg/default.svg");
|
|
|
|
var _default2 = _interopRequireDefault(_default);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
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());
|
|
|
|
this._loadDefaultSvgIcon();
|
|
}
|
|
|
|
/**
|
|
* Get a Style cssText or StyleObject
|
|
* @param {string} type - style type
|
|
* @returns {string|object} - cssText or StyleObject
|
|
*/
|
|
// eslint-disable-next-line complexity
|
|
|
|
|
|
_createClass(Theme, [{
|
|
key: 'getStyle',
|
|
value: function getStyle(type) {
|
|
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':
|
|
result = {
|
|
active: this.styles[firstProperty + '.activeIcon'],
|
|
normal: this.styles[firstProperty + '.normalIcon'],
|
|
hover: this.styles[firstProperty + '.hoverIcon'],
|
|
disabled: this.styles[firstProperty + '.disabledIcon']
|
|
};
|
|
break;
|
|
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.disabledPointer':
|
|
case 'range.disabledBar':
|
|
case 'range.disabledSubbar':
|
|
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'),
|
|
|
|
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'),
|
|
submenuCheckbox: this.getStyle('checkbox'),
|
|
menuIconSize: this.getStyle('menu.iconSize'),
|
|
submenuIconSize: this.getStyle('submenu.iconSize'),
|
|
menuIconStyle: this.getStyle('menu.icon'),
|
|
submenuIconStyle: this.getStyle('submenu.icon')
|
|
});
|
|
}
|
|
|
|
/**
|
|
* 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();
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Load default svg icon
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_loadDefaultSvgIcon',
|
|
value: function _loadDefaultSvgIcon() {
|
|
if (!document.getElementById('tui-image-editor-svg-default-icons')) {
|
|
var parser = new DOMParser();
|
|
var dom = parser.parseFromString(_default2.default, 'text/xml');
|
|
|
|
document.body.appendChild(dom.documentElement);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Make className for svg icon
|
|
* @param {string} iconType - normal' or 'active' or 'hover' or 'disabled
|
|
* @param {boolean} isSubmenu - submenu icon or not.
|
|
* @returns {string}
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_makeIconClassName',
|
|
value: function _makeIconClassName(iconType, isSubmenu) {
|
|
var iconStyleInfo = isSubmenu ? this.getStyle('submenu.icon') : this.getStyle('menu.icon');
|
|
var _iconStyleInfo$iconTy = iconStyleInfo[iconType],
|
|
path = _iconStyleInfo$iconTy.path,
|
|
name = _iconStyleInfo$iconTy.name;
|
|
|
|
|
|
return path && name ? iconType : iconType + ' use-default';
|
|
}
|
|
|
|
/**
|
|
* Make svg use link path name
|
|
* @param {string} iconType - normal' or 'active' or 'hover' or 'disabled
|
|
* @param {boolean} isSubmenu - submenu icon or not.
|
|
* @returns {string}
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_makeSvgIconPrefix',
|
|
value: function _makeSvgIconPrefix(iconType, isSubmenu) {
|
|
var iconStyleInfo = isSubmenu ? this.getStyle('submenu.icon') : this.getStyle('menu.icon');
|
|
var _iconStyleInfo$iconTy2 = iconStyleInfo[iconType],
|
|
path = _iconStyleInfo$iconTy2.path,
|
|
name = _iconStyleInfo$iconTy2.name;
|
|
|
|
|
|
return path && name ? path + '#' + name + '-' : '#';
|
|
}
|
|
|
|
/**
|
|
* Make svg use link path name
|
|
* @param {Array.<string>} useIconTypes - normal' or 'active' or 'hover' or 'disabled
|
|
* @param {string} menuName - menu name
|
|
* @param {boolean} isSubmenu - submenu icon or not.
|
|
* @returns {string}
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_makeSvgItem',
|
|
value: function _makeSvgItem(useIconTypes, menuName, isSubmenu) {
|
|
var _this2 = this;
|
|
|
|
return (0, _tuiCodeSnippet.map)(useIconTypes, function (iconType) {
|
|
var svgIconPrefix = _this2._makeSvgIconPrefix(iconType, isSubmenu);
|
|
var iconName = _this2._toUnderScore(menuName);
|
|
var svgIconClassName = _this2._makeIconClassName(iconType, isSubmenu);
|
|
|
|
return '<use xlink:href="' + svgIconPrefix + 'ic-' + iconName + '" class="' + svgIconClassName + '"/>';
|
|
}).join('');
|
|
}
|
|
|
|
/**
|
|
* Make svg icon set
|
|
* @param {Array.<string>} useIconTypes - normal' or 'active' or 'hover' or 'disabled
|
|
* @param {string} menuName - menu name
|
|
* @param {boolean} isSubmenu - submenu icon or not.
|
|
* @returns {string}
|
|
*/
|
|
|
|
}, {
|
|
key: 'makeMenSvgIconSet',
|
|
value: function makeMenSvgIconSet(useIconTypes, menuName) {
|
|
var isSubmenu = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
|
|
|
|
return '<svg class="svg_ic-' + (isSubmenu ? 'submenu' : 'menu') + '">' + this._makeSvgItem(useIconTypes, menuName, isSubmenu) + '</svg>';
|
|
}
|
|
}]);
|
|
|
|
return Theme;
|
|
}();
|
|
|
|
exports.default = Theme;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/tools/colorpicker.js":
|
|
/*!****************************************!*\
|
|
!*** ./src/js/ui/tools/colorpicker.js ***!
|
|
\****************************************/
|
|
/*! no static exports found */
|
|
/***/ (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__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _tuiColorPicker = __webpack_require__(/*! tui-color-picker */ "tui-color-picker");
|
|
|
|
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';
|
|
var usageStatistics = arguments[3];
|
|
|
|
_classCallCheck(this, Colorpicker);
|
|
|
|
this.colorpickerElement = colorpickerElement;
|
|
this.usageStatistics = usageStatistics;
|
|
|
|
this._show = false;
|
|
|
|
this._colorpickerElement = colorpickerElement;
|
|
this._toggleDirection = toggleDirection;
|
|
this._makePickerButtonElement(defaultColor);
|
|
this._makePickerLayerElement(colorpickerElement, colorpickerElement.getAttribute('title'));
|
|
this._color = defaultColor;
|
|
this.picker = _tuiColorPicker2.default.create({
|
|
container: this.pickerElement,
|
|
preset: PICKER_COLOR,
|
|
color: defaultColor,
|
|
usageStatistics: this.usageStatistics
|
|
});
|
|
|
|
this._addEvent();
|
|
}
|
|
|
|
/**
|
|
* Destroys the instance.
|
|
*/
|
|
|
|
|
|
_createClass(Colorpicker, [{
|
|
key: 'destroy',
|
|
value: function destroy() {
|
|
var _this = this;
|
|
|
|
this._removeEvent();
|
|
this.picker.destroy();
|
|
this.colorpickerElement.innerHTML = '';
|
|
_tuiCodeSnippet2.default.forEach(this, function (value, key) {
|
|
_this[key] = null;
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Get color
|
|
* @returns {Number} color value
|
|
*/
|
|
|
|
}, {
|
|
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 {string} defaultColor color value
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_makePickerButtonElement',
|
|
value: function _makePickerButtonElement(defaultColor) {
|
|
this.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);
|
|
}
|
|
|
|
/**
|
|
* Add event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_addEvent',
|
|
value: function _addEvent() {
|
|
var _this2 = this;
|
|
|
|
this.picker.on('selectColor', function (value) {
|
|
_this2._changeColorElement(value.color);
|
|
_this2._color = value.color;
|
|
_this2.fire('change', value.color);
|
|
});
|
|
|
|
this.eventHandler = {
|
|
pickerToggle: this._pickerToggleEventHandler.bind(this),
|
|
pickerHide: function pickerHide() {
|
|
return _this2.hide();
|
|
}
|
|
};
|
|
|
|
this.colorpickerElement.addEventListener('click', this.eventHandler.pickerToggle);
|
|
document.body.addEventListener('click', this.eventHandler.pickerHide);
|
|
}
|
|
|
|
/**
|
|
* Remove event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_removeEvent',
|
|
value: function _removeEvent() {
|
|
this.colorpickerElement.removeEventListener('click', this.eventHandler.pickerToggle);
|
|
document.body.removeEventListener('click', this.eventHandler.pickerHide);
|
|
this.picker.off();
|
|
}
|
|
|
|
/**
|
|
* Picker toggle event handler
|
|
* @param {object} event - change event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_pickerToggleEventHandler',
|
|
value: function _pickerToggleEventHandler(event) {
|
|
var target = event.target;
|
|
|
|
var isInPickerControl = target && this._isElementInColorPickerControl(target);
|
|
|
|
if (!isInPickerControl || isInPickerControl && this._isPaletteButton(target)) {
|
|
this._show = !this._show;
|
|
this.pickerControl.style.display = this._show ? 'block' : 'none';
|
|
this._setPickerControlPosition();
|
|
this.fire('changeShow', this);
|
|
}
|
|
event.stopPropagation();
|
|
}
|
|
|
|
/**
|
|
* Check hex input or not
|
|
* @param {Element} target - Event target element
|
|
* @returns {boolean}
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_isPaletteButton',
|
|
value: function _isPaletteButton(target) {
|
|
return target.className === 'tui-colorpicker-palette-button';
|
|
}
|
|
|
|
/**
|
|
* Check given element is in pickerControl element
|
|
* @param {Element} element - element to check
|
|
* @returns {boolean}
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_isElementInColorPickerControl',
|
|
value: function _isElementInColorPickerControl(element) {
|
|
var parentNode = element;
|
|
|
|
while (parentNode !== document.body) {
|
|
if (!parentNode) {
|
|
break;
|
|
}
|
|
|
|
if (parentNode === this.pickerControl) {
|
|
return true;
|
|
}
|
|
|
|
parentNode = parentNode.parentNode;
|
|
}
|
|
|
|
return false;
|
|
}
|
|
}, {
|
|
key: 'hide',
|
|
value: function hide() {
|
|
this._show = false;
|
|
this.pickerControl.style.display = 'none';
|
|
}
|
|
|
|
/**
|
|
* Set picker control position
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_setPickerControlPosition',
|
|
value: function _setPickerControlPosition() {
|
|
var controlStyle = this.pickerControl.style;
|
|
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;
|
|
}
|
|
|
|
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;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/ui/tools/range.js":
|
|
/*!**********************************!*\
|
|
!*** ./src/js/ui/tools/range.js ***!
|
|
\**********************************/
|
|
/*! no static exports found */
|
|
/***/ (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__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _tuiCodeSnippet2 = _interopRequireDefault(_tuiCodeSnippet);
|
|
|
|
var _util = __webpack_require__(/*! @/util */ "./src/js/util.js");
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
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 INPUT_FILTER_REGEXP = /(-?)([0-9]*)[^0-9]*([0-9]*)/g;
|
|
|
|
/**
|
|
* Range control class
|
|
* @class
|
|
* @ignore
|
|
*/
|
|
|
|
var Range = function () {
|
|
/**
|
|
* @constructor
|
|
* @extends {View}
|
|
* @param {Object} rangeElements - Html resources for creating sliders
|
|
* @param {HTMLElement} rangeElements.slider - b
|
|
* @param {HTMLElement} [rangeElements.input] - c
|
|
* @param {Object} options - Slider make options
|
|
* @param {number} options.min - min value
|
|
* @param {number} options.max - max value
|
|
* @param {number} options.value - default value
|
|
* @param {number} [options.useDecimal] - Decimal point processing.
|
|
* @param {boolean} [options.realTimeEvent] - Reflect live events.
|
|
*/
|
|
function Range(rangeElements) {
|
|
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
|
|
_classCallCheck(this, Range);
|
|
|
|
this._value = options.value || 0;
|
|
|
|
this.rangeElement = rangeElements.slider;
|
|
this.rangeInputElement = rangeElements.input;
|
|
|
|
this._drawRangeElement();
|
|
|
|
this.rangeWidth = this._getRangeWidth();
|
|
this._min = options.min || 0;
|
|
this._max = options.max || 100;
|
|
this._useDecimal = options.useDecimal;
|
|
this._absMax = this._min * -1 + this._max;
|
|
this.realTimeEvent = options.realTimeEvent || false;
|
|
|
|
this.eventHandler = {
|
|
startChangingSlide: this._startChangingSlide.bind(this),
|
|
stopChangingSlide: this._stopChangingSlide.bind(this),
|
|
changeSlide: this._changeSlide.bind(this),
|
|
changeSlideFinally: this._changeSlideFinally.bind(this),
|
|
changeInput: this._changeValueWithInput.bind(this, false),
|
|
changeInputFinally: this._changeValueWithInput.bind(this, true),
|
|
changeInputWithArrow: this._changeValueWithInputKeyEvent.bind(this)
|
|
};
|
|
|
|
this._addClickEvent();
|
|
this._addDragEvent();
|
|
this._addInputEvent();
|
|
this.value = options.value;
|
|
this.trigger('change');
|
|
}
|
|
|
|
/**
|
|
* Destroys the instance.
|
|
*/
|
|
|
|
|
|
_createClass(Range, [{
|
|
key: 'destroy',
|
|
value: function destroy() {
|
|
var _this = this;
|
|
|
|
this._removeClickEvent();
|
|
this._removeDragEvent();
|
|
this._removeInputEvent();
|
|
this.rangeElement.innerHTML = '';
|
|
_tuiCodeSnippet2.default.forEach(this, function (value, key) {
|
|
_this[key] = null;
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Set range max value and re position cursor
|
|
* @param {number} maxValue - max value
|
|
*/
|
|
|
|
}, {
|
|
key: 'trigger',
|
|
|
|
|
|
/**
|
|
* event trigger
|
|
* @param {string} type - type
|
|
*/
|
|
value: function trigger(type) {
|
|
this.fire(type, this._value);
|
|
}
|
|
|
|
/**
|
|
* Calculate slider width
|
|
* @returns {number} - slider width
|
|
*/
|
|
|
|
}, {
|
|
key: '_getRangeWidth',
|
|
value: function _getRangeWidth() {
|
|
var getElementWidth = function getElementWidth(element) {
|
|
return (0, _util.toInteger)(window.getComputedStyle(element, null).width);
|
|
};
|
|
|
|
return getElementWidth(this.rangeElement) - getElementWidth(this.pointer);
|
|
}
|
|
|
|
/**
|
|
* 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 input editing event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_addInputEvent',
|
|
value: function _addInputEvent() {
|
|
if (this.rangeInputElement) {
|
|
this.rangeInputElement.addEventListener('keydown', this.eventHandler.changeInputWithArrow);
|
|
this.rangeInputElement.addEventListener('keyup', this.eventHandler.changeInput);
|
|
this.rangeInputElement.addEventListener('blur', this.eventHandler.changeInputFinally);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Remove range input editing event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_removeInputEvent',
|
|
value: function _removeInputEvent() {
|
|
if (this.rangeInputElement) {
|
|
this.rangeInputElement.removeEventListener('keydown', this.eventHandler.changeInputWithArrow);
|
|
this.rangeInputElement.removeEventListener('keyup', this.eventHandler.changeInput);
|
|
this.rangeInputElement.removeEventListener('blur', this.eventHandler.changeInputFinally);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* change angle event
|
|
* @param {object} event - key event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_changeValueWithInputKeyEvent',
|
|
value: function _changeValueWithInputKeyEvent(event) {
|
|
var keyCode = event.keyCode,
|
|
target = event.target;
|
|
|
|
|
|
if ([_consts.keyCodes.ARROW_UP, _consts.keyCodes.ARROW_DOWN].indexOf(keyCode) < 0) {
|
|
return;
|
|
}
|
|
|
|
var value = Number(target.value);
|
|
|
|
value = this._valueUpDownForKeyEvent(value, keyCode);
|
|
|
|
var unChanged = value < this._min || value > this._max;
|
|
|
|
if (!unChanged) {
|
|
var clampValue = (0, _util.clamp)(value, this._min, this.max);
|
|
this.value = clampValue;
|
|
this.fire('change', clampValue, false);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* value up down for input
|
|
* @param {number} value - original value number
|
|
* @param {number} keyCode - input event key code
|
|
* @returns {number} value - changed value
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_valueUpDownForKeyEvent',
|
|
value: function _valueUpDownForKeyEvent(value, keyCode) {
|
|
var step = this._useDecimal ? 0.1 : 1;
|
|
|
|
if (keyCode === _consts.keyCodes.ARROW_UP) {
|
|
value += step;
|
|
} else if (keyCode === _consts.keyCodes.ARROW_DOWN) {
|
|
value -= step;
|
|
}
|
|
|
|
return value;
|
|
}
|
|
|
|
/**
|
|
* change angle event
|
|
* @param {boolean} isLast - Is last change
|
|
* @param {object} event - key event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_changeValueWithInput',
|
|
value: function _changeValueWithInput(isLast, event) {
|
|
var keyCode = event.keyCode,
|
|
target = event.target;
|
|
|
|
|
|
if ([_consts.keyCodes.ARROW_UP, _consts.keyCodes.ARROW_DOWN].indexOf(keyCode) >= 0) {
|
|
return;
|
|
}
|
|
|
|
var stringValue = this._filterForInputText(target.value);
|
|
var waitForChange = !stringValue || isNaN(stringValue);
|
|
target.value = stringValue;
|
|
|
|
if (!waitForChange) {
|
|
var value = this._useDecimal ? Number(stringValue) : (0, _util.toInteger)(stringValue);
|
|
value = (0, _util.clamp)(value, this._min, this.max);
|
|
|
|
this.value = value;
|
|
this.fire('change', value, isLast);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Add Range click event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_addClickEvent',
|
|
value: function _addClickEvent() {
|
|
this.rangeElement.addEventListener('click', this.eventHandler.changeSlideFinally);
|
|
}
|
|
|
|
/**
|
|
* Remove Range click event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_removeClickEvent',
|
|
value: function _removeClickEvent() {
|
|
this.rangeElement.removeEventListener('click', this.eventHandler.changeSlideFinally);
|
|
}
|
|
|
|
/**
|
|
* Add Range drag event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_addDragEvent',
|
|
value: function _addDragEvent() {
|
|
this.pointer.addEventListener('mousedown', this.eventHandler.startChangingSlide);
|
|
}
|
|
|
|
/**
|
|
* Remove Range drag event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_removeDragEvent',
|
|
value: function _removeDragEvent() {
|
|
this.pointer.removeEventListener('mousedown', this.eventHandler.startChangingSlide);
|
|
}
|
|
|
|
/**
|
|
* change angle event
|
|
* @param {object} event - change event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_changeSlide',
|
|
value: function _changeSlide(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 resultValue = this._absMax * ratio + this._min;
|
|
var value = this._useDecimal ? resultValue : (0, _util.toInteger)(resultValue);
|
|
var isValueChanged = this.value !== value;
|
|
|
|
if (isValueChanged) {
|
|
this.value = value;
|
|
if (this.realTimeEvent) {
|
|
this.fire('change', this._value, false);
|
|
}
|
|
}
|
|
}
|
|
}, {
|
|
key: '_changeSlideFinally',
|
|
value: function _changeSlideFinally(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, true);
|
|
}
|
|
}, {
|
|
key: '_startChangingSlide',
|
|
value: function _startChangingSlide(event) {
|
|
this.firstPosition = event.screenX;
|
|
this.firstLeft = (0, _util.toInteger)(this.pointer.style.left) || 0;
|
|
|
|
document.addEventListener('mousemove', this.eventHandler.changeSlide);
|
|
document.addEventListener('mouseup', this.eventHandler.stopChangingSlide);
|
|
}
|
|
|
|
/**
|
|
* stop change angle event
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_stopChangingSlide',
|
|
value: function _stopChangingSlide() {
|
|
this.fire('change', this._value, true);
|
|
|
|
document.removeEventListener('mousemove', this.eventHandler.changeSlide);
|
|
document.removeEventListener('mouseup', this.eventHandler.stopChangingSlide);
|
|
}
|
|
|
|
/**
|
|
* Unnecessary string filtering.
|
|
* @param {string} inputValue - origin string of input
|
|
* @returns {string} filtered string
|
|
* @private
|
|
*/
|
|
|
|
}, {
|
|
key: '_filterForInputText',
|
|
value: function _filterForInputText(inputValue) {
|
|
return inputValue.replace(INPUT_FILTER_REGEXP, '$1$2$3');
|
|
}
|
|
}, {
|
|
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
|
|
*/
|
|
,
|
|
set: function set(value) {
|
|
value = this._useDecimal ? value : (0, _util.toInteger)(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;
|
|
if (this.rangeInputElement) {
|
|
this.rangeInputElement.value = value;
|
|
}
|
|
}
|
|
}]);
|
|
|
|
return Range;
|
|
}();
|
|
|
|
_tuiCodeSnippet2.default.CustomEvents.mixin(Range);
|
|
|
|
exports.default = Range;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/js/util.js":
|
|
/*!************************!*\
|
|
!*** ./src/js/util.js ***!
|
|
\************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
exports.Promise = undefined;
|
|
exports.clamp = clamp;
|
|
exports.keyMirror = keyMirror;
|
|
exports.makeStyleText = makeStyleText;
|
|
exports.getProperties = getProperties;
|
|
exports.toInteger = toInteger;
|
|
exports.toCamelCase = toCamelCase;
|
|
exports.isSupportFileApi = isSupportFileApi;
|
|
exports.getRgb = getRgb;
|
|
exports.sendHostName = sendHostName;
|
|
exports.styleLoad = styleLoad;
|
|
exports.getSelector = getSelector;
|
|
exports.base64ToBlob = base64ToBlob;
|
|
exports.fixFloatingPoint = fixFloatingPoint;
|
|
exports.assignmentForDestroy = assignmentForDestroy;
|
|
exports.cls = cls;
|
|
exports.changeOrigin = changeOrigin;
|
|
exports.flipObject = flipObject;
|
|
exports.setCustomProperty = setCustomProperty;
|
|
exports.getCustomProperty = getCustomProperty;
|
|
exports.capitalizeString = capitalizeString;
|
|
exports.includes = includes;
|
|
exports.getFillTypeFromOption = getFillTypeFromOption;
|
|
exports.getFillTypeFromObject = getFillTypeFromObject;
|
|
exports.isShape = isShape;
|
|
exports.getObjectType = getObjectType;
|
|
exports.isSilentCommand = isSilentCommand;
|
|
exports.getHistoryTitle = getHistoryTitle;
|
|
exports.getHelpMenuBarPosition = getHelpMenuBarPosition;
|
|
exports.isEmptyCropzone = isEmptyCropzone;
|
|
|
|
var _tuiCodeSnippet = __webpack_require__(/*! tui-code-snippet */ "tui-code-snippet");
|
|
|
|
var _promise = __webpack_require__(/*! core-js-pure/features/promise */ "./node_modules/core-js-pure/features/promise/index.js");
|
|
|
|
var _promise2 = _interopRequireDefault(_promise);
|
|
|
|
var _consts = __webpack_require__(/*! @/consts */ "./src/js/consts.js");
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
|
|
var FLOATING_POINT_DIGIT = 2; /**
|
|
* @author NHN. FE Development Team <dl_javascript@nhn.com>
|
|
* @fileoverview Util
|
|
*/
|
|
|
|
var CSS_PREFIX = 'tui-image-editor-';
|
|
var min = Math.min,
|
|
max = Math.max;
|
|
|
|
var hostnameSent = false;
|
|
|
|
/**
|
|
* Export Promise Class (for simplified module path)
|
|
* @returns {Promise} promise class
|
|
*/
|
|
exports.Promise = _promise2.default;
|
|
|
|
/**
|
|
* Clamp value
|
|
* @param {number} value - Value
|
|
* @param {number} minValue - Minimum value
|
|
* @param {number} maxValue - Maximum value
|
|
* @returns {number} clamped value
|
|
*/
|
|
|
|
function clamp(value, minValue, maxValue) {
|
|
if (minValue > maxValue) {
|
|
var _ref = [maxValue, minValue];
|
|
minValue = _ref[0];
|
|
maxValue = _ref[1];
|
|
}
|
|
|
|
return max(minValue, min(value, maxValue));
|
|
}
|
|
|
|
/**
|
|
* Make key-value object from arguments
|
|
* @returns {object.<string, string>}
|
|
*/
|
|
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
|
|
*/
|
|
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
|
|
*/
|
|
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}
|
|
*/
|
|
function toInteger(value) {
|
|
return parseInt(value, 10);
|
|
}
|
|
|
|
/**
|
|
* String to camelcase string
|
|
* @param {string} targetString - change target
|
|
* @returns {string}
|
|
* @private
|
|
*/
|
|
function toCamelCase(targetString) {
|
|
return targetString.replace(/-([a-z])/g, function ($0, $1) {
|
|
return $1.toUpperCase();
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Check browser file api support
|
|
* @returns {boolean}
|
|
* @private
|
|
*/
|
|
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
|
|
*/
|
|
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
|
|
*/
|
|
function sendHostName() {
|
|
if (hostnameSent) {
|
|
return;
|
|
}
|
|
hostnameSent = true;
|
|
|
|
(0, _tuiCodeSnippet.sendHostname)('image-editor', 'UA-129999381-1');
|
|
}
|
|
|
|
/**
|
|
* Apply css resource
|
|
* @param {string} styleBuffer - serialized css text
|
|
* @param {string} tagId - style tag id
|
|
*/
|
|
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
|
|
*/
|
|
function getSelector(targetElement) {
|
|
return function (str) {
|
|
return targetElement.querySelector(str);
|
|
};
|
|
}
|
|
|
|
/**
|
|
* Change base64 to blob
|
|
* @param {String} data - base64 string data
|
|
* @returns {Blob} Blob Data
|
|
*/
|
|
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 });
|
|
}
|
|
|
|
/**
|
|
* Fix floating point diff.
|
|
* @param {number} value - original value
|
|
* @returns {number} fixed value
|
|
*/
|
|
function fixFloatingPoint(value) {
|
|
return Number(value.toFixed(FLOATING_POINT_DIGIT));
|
|
}
|
|
|
|
/**
|
|
* Assignment for destroying objects.
|
|
* @param {Object} targetObject - object to be removed.
|
|
*/
|
|
function assignmentForDestroy(targetObject) {
|
|
(0, _tuiCodeSnippet.forEach)(targetObject, function (value, key) {
|
|
targetObject[key] = null;
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Make class name for ui
|
|
* @param {String} str - main string of className
|
|
* @param {String} prefix - prefix string of className
|
|
* @returns {String} class name
|
|
*/
|
|
function cls() {
|
|
var str = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
|
|
var prefix = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
|
|
|
|
if (str.charAt(0) === '.') {
|
|
return '.' + CSS_PREFIX + prefix + str.slice(1);
|
|
}
|
|
|
|
return '' + CSS_PREFIX + prefix + str;
|
|
}
|
|
|
|
/**
|
|
* Change object origin
|
|
* @param {fabric.Object} fObject - fabric object
|
|
* @param {Object} origin - origin of fabric object
|
|
* @param {string} originX - horizontal basis.
|
|
* @param {string} originY - vertical basis.
|
|
*/
|
|
function changeOrigin(fObject, origin) {
|
|
var originX = origin.originX,
|
|
originY = origin.originY;
|
|
|
|
var _fObject$getPointByOr = fObject.getPointByOrigin(originX, originY),
|
|
left = _fObject$getPointByOr.x,
|
|
top = _fObject$getPointByOr.y;
|
|
|
|
fObject.set({
|
|
left: left,
|
|
top: top,
|
|
originX: originX,
|
|
originY: originY
|
|
});
|
|
|
|
fObject.setCoords();
|
|
}
|
|
|
|
/**
|
|
* Object key value flip
|
|
* @param {Object} targetObject - The data object of the key value.
|
|
* @returns {Object}
|
|
*/
|
|
function flipObject(targetObject) {
|
|
var result = {};
|
|
|
|
Object.keys(targetObject).forEach(function (key) {
|
|
result[targetObject[key]] = key;
|
|
});
|
|
|
|
return result;
|
|
}
|
|
|
|
/**
|
|
* Set custom properties
|
|
* @param {Object} targetObject - target object
|
|
* @param {Object} props - custom props object
|
|
*/
|
|
function setCustomProperty(targetObject, props) {
|
|
targetObject.customProps = targetObject.customProps || {};
|
|
(0, _tuiCodeSnippet.extend)(targetObject.customProps, props);
|
|
}
|
|
|
|
/**
|
|
* Get custom property
|
|
* @param {fabric.Object} fObject - fabric object
|
|
* @param {Array|string} propNames - prop name array
|
|
* @returns {object | number | string}
|
|
*/
|
|
function getCustomProperty(fObject, propNames) {
|
|
var resultObject = {};
|
|
if ((0, _tuiCodeSnippet.isString)(propNames)) {
|
|
propNames = [propNames];
|
|
}
|
|
(0, _tuiCodeSnippet.forEach)(propNames, function (propName) {
|
|
resultObject[propName] = fObject.customProps[propName];
|
|
});
|
|
|
|
return resultObject;
|
|
}
|
|
|
|
/**
|
|
* Capitalize string
|
|
* @param {string} targetString - target string
|
|
* @returns {string}
|
|
*/
|
|
function capitalizeString(targetString) {
|
|
return targetString.charAt(0).toUpperCase() + targetString.slice(1);
|
|
}
|
|
|
|
/**
|
|
* Array includes check
|
|
* @param {Array} targetArray - target array
|
|
* @param {string|number} compareValue - compare value
|
|
* @returns {boolean}
|
|
*/
|
|
function includes(targetArray, compareValue) {
|
|
return targetArray.indexOf(compareValue) >= 0;
|
|
}
|
|
|
|
/**
|
|
* Get fill type
|
|
* @param {Object | string} fillOption - shape fill option
|
|
* @returns {string} 'color' or 'filter'
|
|
*/
|
|
function getFillTypeFromOption() {
|
|
var fillOption = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
|
|
return (0, _tuiCodeSnippet.pick)(fillOption, 'type') || _consts.SHAPE_FILL_TYPE.COLOR;
|
|
}
|
|
|
|
/**
|
|
* Get fill type of shape type object
|
|
* @param {fabric.Object} shapeObj - fabric object
|
|
* @returns {string} 'transparent' or 'color' or 'filter'
|
|
*/
|
|
function getFillTypeFromObject(shapeObj) {
|
|
var _shapeObj$fill = shapeObj.fill,
|
|
fill = _shapeObj$fill === undefined ? {} : _shapeObj$fill;
|
|
|
|
if (fill.source) {
|
|
return _consts.SHAPE_FILL_TYPE.FILTER;
|
|
}
|
|
|
|
return _consts.SHAPE_FILL_TYPE.COLOR;
|
|
}
|
|
|
|
/**
|
|
* Check if the object is a shape object.
|
|
* @param {fabric.Object} obj - fabric object
|
|
* @returns {boolean}
|
|
*/
|
|
function isShape(obj) {
|
|
return (0, _tuiCodeSnippet.inArray)(obj.get('type'), _consts.SHAPE_TYPE) >= 0;
|
|
}
|
|
|
|
/**
|
|
* Get object type
|
|
* @param {string} type - fabric object type
|
|
* @returns {string} type of object (ex: shape, icon, ...)
|
|
*/
|
|
function getObjectType(type) {
|
|
if (includes(_consts.SHAPE_TYPE, type)) {
|
|
return 'Shape';
|
|
}
|
|
|
|
switch (type) {
|
|
case 'i-text':
|
|
return 'Text';
|
|
case 'path':
|
|
case 'line':
|
|
return 'Draw';
|
|
case 'activeSelection':
|
|
return 'Group';
|
|
default:
|
|
return toStartOfCapital(type);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Get filter type
|
|
* @param {string} type - fabric filter type
|
|
* @param {object} [options] - filter type options
|
|
* @param {boolean} [options.useAlpha=true] - usage of alpha(true is 'color filter', false is 'remove white')
|
|
* @param {string} [options.mode] - mode of blendColor
|
|
* @returns {string} type of filter (ex: sepia, blur, ...)
|
|
*/
|
|
function getFilterType(type) {
|
|
var _ref2 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
|
|
_ref2$useAlpha = _ref2.useAlpha,
|
|
useAlpha = _ref2$useAlpha === undefined ? true : _ref2$useAlpha,
|
|
mode = _ref2.mode;
|
|
|
|
var VINTAGE = _consts.filterType.VINTAGE,
|
|
REMOVE_COLOR = _consts.filterType.REMOVE_COLOR,
|
|
BLEND_COLOR = _consts.filterType.BLEND_COLOR,
|
|
SEPIA2 = _consts.filterType.SEPIA2,
|
|
COLOR_FILTER = _consts.filterType.COLOR_FILTER,
|
|
REMOVE_WHITE = _consts.filterType.REMOVE_WHITE,
|
|
BLEND = _consts.filterType.BLEND;
|
|
|
|
|
|
var filterName = void 0;
|
|
|
|
switch (type) {
|
|
case VINTAGE:
|
|
filterName = SEPIA2;
|
|
break;
|
|
case REMOVE_COLOR:
|
|
filterName = useAlpha ? COLOR_FILTER : REMOVE_WHITE;
|
|
break;
|
|
case BLEND_COLOR:
|
|
filterName = mode === 'add' ? BLEND : mode;
|
|
break;
|
|
default:
|
|
filterName = type;
|
|
}
|
|
|
|
return toStartOfCapital(filterName);
|
|
}
|
|
|
|
/**
|
|
* Check if command is silent command
|
|
* @param {Command|string} command - command or command name
|
|
* @returns {boolean}
|
|
*/
|
|
function isSilentCommand(command) {
|
|
var LOAD_IMAGE = _consts.commandNames.LOAD_IMAGE;
|
|
|
|
|
|
return typeof command === 'string' ? LOAD_IMAGE === command : LOAD_IMAGE === command.name;
|
|
}
|
|
|
|
/**
|
|
* Get command name
|
|
* @param {Command|string} command - command or command name
|
|
* @returns {{name: string, ?detail: string}}
|
|
*/
|
|
// eslint-disable-next-line complexity, require-jsdoc
|
|
function getHistoryTitle(command) {
|
|
var FLIP_IMAGE = _consts.commandNames.FLIP_IMAGE,
|
|
ROTATE_IMAGE = _consts.commandNames.ROTATE_IMAGE,
|
|
ADD_TEXT = _consts.commandNames.ADD_TEXT,
|
|
APPLY_FILTER = _consts.commandNames.APPLY_FILTER,
|
|
REMOVE_FILTER = _consts.commandNames.REMOVE_FILTER,
|
|
CHANGE_SHAPE = _consts.commandNames.CHANGE_SHAPE,
|
|
CHANGE_ICON_COLOR = _consts.commandNames.CHANGE_ICON_COLOR,
|
|
CHANGE_TEXT_STYLE = _consts.commandNames.CHANGE_TEXT_STYLE,
|
|
CLEAR_OBJECTS = _consts.commandNames.CLEAR_OBJECTS,
|
|
ADD_IMAGE_OBJECT = _consts.commandNames.ADD_IMAGE_OBJECT,
|
|
REMOVE_OBJECT = _consts.commandNames.REMOVE_OBJECT;
|
|
var name = command.name,
|
|
args = command.args;
|
|
|
|
var historyInfo = void 0;
|
|
|
|
switch (name) {
|
|
case FLIP_IMAGE:
|
|
historyInfo = { name: name, detail: args[1] === 'reset' ? args[1] : args[1].slice(4) };
|
|
break;
|
|
case ROTATE_IMAGE:
|
|
historyInfo = { name: name, detail: args[2] };
|
|
break;
|
|
case APPLY_FILTER:
|
|
historyInfo = { name: _consts.historyNames.APPLY_FILTER, detail: getFilterType(args[1], args[2]) };
|
|
break;
|
|
case REMOVE_FILTER:
|
|
historyInfo = { name: _consts.historyNames.REMOVE_FILTER, detail: 'Remove' };
|
|
break;
|
|
case CHANGE_SHAPE:
|
|
historyInfo = { name: _consts.historyNames.CHANGE_SHAPE, detail: 'Change' };
|
|
break;
|
|
case CHANGE_ICON_COLOR:
|
|
historyInfo = { name: _consts.historyNames.CHANGE_ICON_COLOR, detail: 'Change' };
|
|
break;
|
|
case CHANGE_TEXT_STYLE:
|
|
historyInfo = { name: _consts.historyNames.CHANGE_TEXT_STYLE, detail: 'Change' };
|
|
break;
|
|
case REMOVE_OBJECT:
|
|
historyInfo = { name: _consts.historyNames.REMOVE_OBJECT, detail: args[2] };
|
|
break;
|
|
case CLEAR_OBJECTS:
|
|
historyInfo = { name: _consts.historyNames.CLEAR_OBJECTS, detail: 'All' };
|
|
break;
|
|
case ADD_IMAGE_OBJECT:
|
|
historyInfo = { name: _consts.historyNames.ADD_IMAGE_OBJECT, detail: 'Add' };
|
|
break;
|
|
case ADD_TEXT:
|
|
historyInfo = { name: _consts.historyNames.ADD_TEXT };
|
|
break;
|
|
|
|
default:
|
|
historyInfo = { name: name };
|
|
break;
|
|
}
|
|
|
|
if (args[1] === 'mask') {
|
|
historyInfo = { name: _consts.historyNames.LOAD_MASK_IMAGE, detail: 'Apply' };
|
|
}
|
|
|
|
return historyInfo;
|
|
}
|
|
|
|
/**
|
|
* Get help menubar position(opposite of menubar)
|
|
* @param {string} position - position of menubar
|
|
* @returns {string} position of help menubar
|
|
*/
|
|
function getHelpMenuBarPosition(position) {
|
|
if (position === 'top') {
|
|
return 'bottom';
|
|
}
|
|
if (position === 'left') {
|
|
return 'right';
|
|
}
|
|
if (position === 'right') {
|
|
return 'left';
|
|
}
|
|
|
|
return 'top';
|
|
}
|
|
|
|
/**
|
|
* Change to capital start letter
|
|
* @param {string} str - string to change
|
|
* @returns {string}
|
|
*/
|
|
function toStartOfCapital(str) {
|
|
return str.replace(/[a-z]/, function (first) {
|
|
return first.toUpperCase();
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Check if cropRect is Empty.
|
|
* @param {Object} cropRect - cropRect object
|
|
* @param {Number} cropRect.left - cropRect left position value
|
|
* @param {Number} cropRect.top - cropRect top position value
|
|
* @param {Number} cropRect.width - cropRect width value
|
|
* @param {Number} cropRect.height - cropRect height value
|
|
* @returns {boolean}
|
|
*/
|
|
function isEmptyCropzone(cropRect) {
|
|
var left = cropRect.left,
|
|
top = cropRect.top,
|
|
width = cropRect.width,
|
|
height = cropRect.height;
|
|
var LEFT = _consts.emptyCropRectValues.LEFT,
|
|
TOP = _consts.emptyCropRectValues.TOP,
|
|
WIDTH = _consts.emptyCropRectValues.WIDTH,
|
|
HEIGHT = _consts.emptyCropRectValues.HEIGHT;
|
|
|
|
|
|
return left === LEFT && top === TOP && width === WIDTH && height === HEIGHT;
|
|
}
|
|
|
|
/***/ }),
|
|
|
|
/***/ "./src/svg/default.svg":
|
|
/*!*****************************!*\
|
|
!*** ./src/svg/default.svg ***!
|
|
\*****************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
module.exports = "<svg display=\"none\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\"><defs id=\"tui-image-editor-svg-default-icons\"><symbol id=\"ic-apply\" viewBox=\"0 0 24 24\"><path d=\"M0 0h24v24H0z\" stroke=\"none\" fill=\"none\"></path><path fill=\"none\" stroke=\"inherit\" d=\"M4 12.011l5 5L20.011 6\"></path></symbol><symbol id=\"ic-cancel\" viewBox=\"0 0 24 24\"><path d=\"M0 0h24v24H0z\" fill=\"none\" stroke=\"none\"></path><path fill=\"none\" stroke=\"inherit\" d=\"M6 6l12 12M18 6L6 18\"></path></symbol><symbol id=\"ic-crop\" viewBox=\"0 0 24 24\"><path d=\"M0 0h24v24H0z\" stroke=\"none\" fill=\"none\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M4 0h1v20a1 1 0 0 1-1-1V0zM20 17h-1V5h1v12zm0 2v5h-1v-5h1z\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M5 19h19v1H5zM4.762 4v1H0V4h4.762zM7 4h12a1 1 0 0 1 1 1H7V4z\"></path></symbol><symbol id=\"ic-delete-all\" viewBox=\"0 0 24 24\"><path stroke=\"none\" fill=\"inherit\" d=\"M5 23H3a1 1 0 0 1-1-1V6h1v16h2v1zm16-10h-1V6h1v7zM9 13H8v-3h1v3zm3 0h-1v-3h1v3zm3 0h-1v-3h1v3zM14.794 3.794L13 2h-3L8.206 3.794A.963.963 0 0 1 8 2.5l.703-1.055A1 1 0 0 1 9.535 1h3.93a1 1 0 0 1 .832.445L15 2.5a.965.965 0 0 1-.206 1.294zM14.197 4H8.803h5.394z\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M0 3h23v1H0zM11.286 21H8.714L8 23H7l1-2.8V20h.071L9.5 16h1l1.429 4H12v.2l1 2.8h-1l-.714-2zm-.357-1L10 17.4 9.071 20h1.858zM20 22h3v1h-4v-7h1v6zm-5 0h3v1h-4v-7h1v6z\"></path></symbol><symbol id=\"ic-delete\" viewBox=\"0 0 24 24\"><path stroke=\"none\" fill=\"inherit\" d=\"M3 6v16h17V6h1v16a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V6h1zM14.794 3.794L13 2h-3L8.206 3.794A.963.963 0 0 1 8 2.5l.703-1.055A1 1 0 0 1 9.535 1h3.93a1 1 0 0 1 .832.445L15 2.5a.965.965 0 0 1-.206 1.294zM14.197 4H8.803h5.394z\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M0 3h23v1H0zM8 10h1v6H8v-6zm3 0h1v6h-1v-6zm3 0h1v6h-1v-6z\"></path></symbol><symbol id=\"ic-draw-free\" viewBox=\"0 0 32 32\"><path fill=\"none\" stroke=\"inherit\" d=\"M2.5 20.929C2.594 10.976 4.323 6 7.686 6c5.872 0 2.524 19 7.697 19s1.89-14.929 6.414-14.929 1.357 10.858 5.13 10.858c1.802 0 2.657-2.262 2.566-6.786\"></path></symbol><symbol id=\"ic-draw-line\" viewBox=\"0 0 32 32\"><path fill=\"none\" stroke=\"inherit\" d=\"M2 15.5h28\"></path></symbol><symbol id=\"ic-draw\" viewBox=\"0 0 24 24\"><path fill=\"none\" stroke=\"inherit\" d=\"M2.5 21.5H5c.245 0 .48-.058.691-.168l.124-.065.14.01c.429.028.85-.127 1.16-.437L22.55 5.405a.5.5 0 0 0 0-.707l-3.246-3.245a.5.5 0 0 0-.707 0L3.162 16.888a1.495 1.495 0 0 0-.437 1.155l.01.14-.065.123c-.111.212-.17.448-.17.694v2.5z\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M16.414 3.707l3.89 3.89-.708.706-3.889-3.889z\"></path></symbol><symbol id=\"ic-filter\" viewBox=\"0 0 24 24\"><path d=\"M0 0h24v24H0z\" fill=\"none\" stroke=\"none\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M12 7v1H2V7h10zm6 0h4v1h-4V7zM12 16v1h10v-1H12zm-6 0H2v1h4v-1z\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M8.5 20a3.5 3.5 0 1 1 0-7 3.5 3.5 0 0 1 0 7zm0-1a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5zM15.5 11a3.5 3.5 0 1 1 0-7 3.5 3.5 0 0 1 0 7zm0-1a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5z\"></path></symbol><symbol id=\"ic-flip-reset\" viewBox=\"0 0 31 32\"><path fill=\"none\" stroke=\"none\" d=\"M31 0H0v32h31z\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M28 16a8 8 0 0 1-8 8H3v-1h1v-7H3a8 8 0 0 1 8-8h17v1h-1v7h1zM11 9a7 7 0 0 0-7 7v7h16a7 7 0 0 0 7-7V9H11z\"></path><path fill=\"none\" stroke=\"inherit\" stroke-linecap=\"square\" d=\"M24 5l3.5 3.5L24 12M7 20l-3.5 3.5L7 27\"></path></symbol><symbol id=\"ic-flip-x\" viewBox=\"0 0 32 32\"><path fill=\"none\" stroke=\"none\" d=\"M32 32H0V0h32z\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M17 32h-1V0h1zM27.167 11l.5 3h-1.03l-.546-3h1.076zm-.5-3h-1.122L25 5h-5V4h5.153a1 1 0 0 1 .986.836L26.667 8zm1.5 9l.5 3h-.94l-.545-3h.985zm1 6l.639 3.836A1 1 0 0 1 28.819 28H26v-1h3l-.726-4h.894zM23 28h-3v-1h3v1zM13 4v1H7L3 27h10v1H3.18a1 1 0 0 1-.986-1.164l3.666-22A1 1 0 0 1 6.847 4H13z\"></path></symbol><symbol id=\"ic-flip-y\" viewBox=\"0 0 32 32\"><path fill=\"none\" stroke=\"none\" d=\"M0 0v32h32V0z\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M0 16v1h32v-1zM11 27.167l3 .5v-1.03l-3-.546v1.076zm-3-.5v-1.122L5 25v-5H4v5.153a1 1 0 0 0 .836.986L8 26.667zm9 1.5l3 .5v-.94l-3-.545v.985zm6 1l3.836.639A1 1 0 0 0 28 28.82V26h-1v3l-4-.727v.894zM28 23v-3h-1v3h1zM4 13h1V7l22-4v10h1V3.18a1 1 0 0 0-1.164-.986l-22 3.667A1 1 0 0 0 4 6.847V13z\"></path></symbol><symbol id=\"ic-flip\" viewBox=\"0 0 24 24\"><path d=\"M0 0h24v24H0z\" fill=\"none\" stroke=\"none\"></path><path fill=\"inherit\" stroke=\"none\" d=\"M11 0h1v24h-1zM19 21v-1h2v-2h1v2a1 1 0 0 1-1 1h-2zm-2 0h-3v-1h3v1zm5-5h-1v-3h1v3zm0-5h-1V8h1v3zm0-5h-1V4h-2V3h2a1 1 0 0 1 1 1v2zm-5-3v1h-3V3h3zM9 3v1H2v16h7v1H2a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h7z\"></path></symbol><symbol id=\"ic-history\" viewBox=\"0 0 24 24\"><path fill=\"none\" stroke=\"none\" d=\"M0 0H24V24H0z\" transform=\"translate(-740 -16) translate(547 8) translate(193 8)\"></path><path fill=\"inherit\" stroke=\"none\" d=\"M12.5 1C18.299 1 23 5.701 23 11.5S18.299 22 12.5 22c-5.29 0-9.665-3.911-10.394-8.999h1.012C3.838 17.534 7.764 21 12.5 21c5.247 0 9.5-4.253 9.5-9.5S17.747 2 12.5 2C8.49 2 5.06 4.485 3.666 8H3h4v1H2V4h1v3.022C4.68 3.462 8.303 1 12.5 1zm.5 5l-.001 5.291 2.537 2.537-.708.708L12.292 12H12V6h1z\" transform=\"translate(-740 -16) translate(547 8) translate(193 8)\"></path></symbol><symbol id=\"ic-history-check\" viewBox=\"0 0 24 24\"><g fill=\"none\" fill-rule=\"evenodd\"><path stroke=\"#555555\" d=\"M4.5 -1L1.5 2 6.5 7\" transform=\"translate(-60 -804) translate(60 804) translate(2 3) rotate(-90 4 3)\"></path></g></symbol><symbol id=\"ic-history-crop\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"none\" fill-rule=\"evenodd\"><path d=\"M0 0H12V12H0z\" transform=\"translate(-84 -804) translate(84 804)\"></path><path fill=\"#434343\" d=\"M2 0h1v10c-.552 0-1-.448-1-1V0zM10 9v3H9V9h1zM9 2h1v6H9V2z\" transform=\"translate(-84 -804) translate(84 804)\"></path><path fill=\"#434343\" d=\"M2 9H12V10H2zM9 2c.513 0 .936.386.993.883L10 3H3V2h6zM2 3H0V2h2v1z\" transform=\"translate(-84 -804) translate(84 804)\"></path></g></symbol><symbol id=\"ic-history-draw\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"none\" fill-rule=\"evenodd\"><path d=\"M0 1H12V13H0z\" transform=\"translate(-156 -804) translate(156 803)\"></path><path stroke=\"#434343\" d=\"M9.622 1.584l1.835 1.658-8.31 8.407L.5 12.5V11l9.122-9.416z\" transform=\"translate(-156 -804) translate(156 803)\"></path><path fill=\"#434343\" d=\"M7.628 3.753L10.378 3.753 10.378 4.253 7.628 4.253z\" transform=\"translate(-156 -804) translate(156 803) rotate(45 9.003 4.003)\"></path></g></symbol><symbol id=\"ic-history-filter\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"none\" fill-rule=\"evenodd\"><path d=\"M0 0H12V12H0z\" transform=\"translate(-276 -804) translate(276 804)\"></path><path fill=\"#434343\" d=\"M12 3v1H9V3h3zM7 4H0V3h7v1z\" transform=\"translate(-276 -804) translate(276 804)\"></path><path fill=\"#434343\" d=\"M12 8v1H9V8h3zM7 9H0V8h7v1z\" transform=\"translate(-276 -804) translate(276 804) matrix(-1 0 0 1 12 0)\"></path><path fill=\"#434343\" d=\"M8 1c1.105 0 2 .895 2 2s-.895 2-2 2-2-.895-2-2 .895-2 2-2zm0 1c-.552 0-1 .448-1 1s.448 1 1 1 1-.448 1-1-.448-1-1-1zM4 7c1.105 0 2 .895 2 2s-.895 2-2 2-2-.895-2-2 .895-2 2-2zm0 1c-.552 0-1 .448-1 1s.448 1 1 1 1-.448 1-1-.448-1-1-1z\" transform=\"translate(-276 -804) translate(276 804)\"></path></g></symbol><symbol id=\"ic-history-flip\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"none\" fill-rule=\"evenodd\"><path d=\"M0 0H12V12H0z\" transform=\"translate(-108 -804) translate(108 804)\"></path><path fill=\"#434343\" d=\"M6 0L7 0 7 12 6 12zM11 10V9h1v1.5c0 .276-.224.5-.5.5H10v-1h1zM5 1v1H1v8h4v1H.5c-.276 0-.5-.224-.5-.5v-9c0-.276.224-.5.5-.5H5zm7 5v2h-1V6h1zm0-3v2h-1V3h1zM9 1v1H7V1h2zm2.5 0c.276 0 .5.224.5.5V2h-2V1h1.5zM9 11H7v-1h2v1z\" transform=\"translate(-108 -804) translate(108 804)\"></path></g></symbol><symbol id=\"ic-history-icon\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"none\" fill-rule=\"evenodd\"><path d=\"M0 0H12V12H0z\" transform=\"translate(-204 -804) translate(204 804)\"></path><path stroke=\"#434343\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.1\" d=\"M6 9.568L2.601 11 2.975 7.467 0.5 4.82 4.13 4.068 6 1 7.87 4.068 11.5 4.82 9.025 7.467 9.399 11z\" transform=\"translate(-204 -804) translate(204 804)\"></path></g></symbol><symbol id=\"ic-history-mask\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"none\" fill-rule=\"evenodd\"><g transform=\"translate(-252 -804) translate(252 804)\"><path d=\"M0 0H12V12H0z\"></path><circle cx=\"6\" cy=\"6\" r=\"2.5\" stroke=\"#444\"></circle><path fill=\"#434343\" d=\"M11.5 0c.276 0 .5.224.5.5v11c0 .276-.224.5-.5.5H.5c-.276 0-.5-.224-.5-.5V.5C0 .224.224 0 .5 0h11zM11 1H1v10h10V1z\"></path></g></g></symbol><symbol id=\"ic-history-rotate\" viewBox=\"0 0 24 24\"><defs><path id=\"rfn4rylffa\" d=\"M7 12c-.335 0-.663-.025-.983-.074C3.171 11.492 1 9.205 1 6.444c0-1.363.534-2.613 1.415-3.58\"></path><mask id=\"6f9gn2dysb\" width=\"6\" height=\"9.136\" x=\"0\" y=\"0\" maskUnits=\"objectBoundingBox\"><use xlink:href=\"#rfn4rylffa\" stroke=\"434343\"></use></mask></defs><g fill=\"none\" stroke=\"none\" fill-rule=\"evenodd\"><g transform=\"translate(-132 -804) translate(132 804)\"><path d=\"M0 0.5H12V12.5H0z\"></path><path fill=\"#434343\" d=\"M6.5 1C9.538 1 12 3.462 12 6.5c0 2.37-1.5 4.39-3.6 5.163l-.407-.916C9.744 10.13 11 8.462 11 6.5 11 4.015 8.985 2 6.5 2c-.777 0-1.509.197-2.147.544L4 1.75l-.205-.04C4.594 1.258 5.517 1 6.5 1z\"></path><use stroke=\"#434343\" stroke-dasharray=\"2 1.25\" stroke-width=\"1\" mask=\"url(#6f9gn2dysb)\" xlink:href=\"#rfn4rylffa\"></use><path fill=\"#434343\" d=\"M4.279 0L6 1.75 4.25 3.571 3.543 2.864 4.586 1.75 3.572 0.707z\" transform=\"matrix(-1 0 0 1 9.543 0)\"></path></g></g></symbol><symbol id=\"ic-history-shape\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"none\" fill-rule=\"evenodd\"><path d=\"M0 0H12V12H0z\" transform=\"translate(-180 -804) translate(180 804)\"></path><path fill=\"#434343\" d=\"M11.5 4c.276 0 .5.224.5.5v7c0 .276-.224.5-.5.5h-7c-.276 0-.5-.224-.5-.5V8.8h1V11h6V5H8.341l-.568-1H11.5z\" transform=\"translate(-180 -804) translate(180 804)\"></path><path stroke=\"#434343\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M4.5 0.5L8.5 7.611 0.5 7.611z\" transform=\"translate(-180 -804) translate(180 804)\"></path></g></symbol><symbol id=\"ic-history-text\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"none\" fill-rule=\"evenodd\"><path d=\"M0 0H12V12H0z\" transform=\"translate(-228 -804) translate(228 804)\"></path><path fill=\"#434343\" d=\"M2 1h8c.552 0 1 .448 1 1H1c0-.552.448-1 1-1z\" transform=\"translate(-228 -804) translate(228 804)\"></path><path fill=\"#434343\" d=\"M1 1H2V3H1zM10 1H11V3H10zM5.5 1L6.5 1 6.5 11 5.5 11z\" transform=\"translate(-228 -804) translate(228 804)\"></path><path fill=\"#434343\" d=\"M4 10H8V11H4z\" transform=\"translate(-228 -804) translate(228 804)\"></path></g></symbol><symbol id=\"ic-history-load\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"none\" fill-rule=\"evenodd\"><path d=\"M0 0H12V12H0z\" transform=\"translate(-324 -805) translate(324 805)\"></path><path fill=\"#434343\" d=\"M5 0c.552 0 1 .448 1 1v1h5.5c.276 0 .5.224.5.5v8c0 .276-.224.5-.5.5H.5c-.276 0-.5-.224-.5-.5V1c0-.552.448-1 1-1h4zm0 1H1v9h10V3H5V1z\" transform=\"translate(-324 -805) translate(324 805)\"></path><path fill=\"#434343\" d=\"M1 2L5 2 5 3 1 3z\" transform=\"translate(-324 -805) translate(324 805)\"></path></g></symbol><symbol id=\"ic-history-delete\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"none\" fill-rule=\"evenodd\"><g fill=\"#434343\"><path d=\"M2 9h8V1h1v8.5c0 .276-.224.5-.5.5h-9c-.276 0-.5-.224-.5-.5V1h1v8zM0 0H12V1H0z\" transform=\"translate(-300 -804) translate(300 804) translate(0 2)\"></path><path d=\"M4 3H5V7H4zM7 3H8V7H7z\" transform=\"translate(-300 -804) translate(300 804) translate(0 2)\"></path><path d=\"M4 1h4V0h1v1.5c0 .276-.224.5-.5.5h-5c-.276 0-.5-.224-.5-.5V0h1v1z\" transform=\"translate(-300 -804) translate(300 804) matrix(1 0 0 -1 0 2)\"></path></g></g></symbol><symbol id=\"ic-history-group\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke=\"none\" fill-rule=\"evenodd\"><g transform=\"translate(-348 -804) translate(348 804)\"><path d=\"M0 0H12V12H0z\"></path><path fill=\"#434343\" d=\"M1 9v2h1v1H.5c-.276 0-.5-.224-.5-.5V9h1zm11 1v1.5c0 .276-.224.5-.5.5H9v-1h2v-1h1zm-4 1v1H6v-1h2zm-3 0v1H3v-1h2zm7-4v2h-1V7h1zM1 6v2H0V6h1zm11-2v2h-1V4h1zM1 3v2H0V3h1zm10.5-3c.276 0 .5.224.5.5V3h-1V1h-1V0h1.5zM6 0v1H4V0h2zm3 0v1H7V0h2zM0 .5C0 .224.224 0 .5 0H3v1H1v1H0V.5zM9.5 4c.276 0 .5.224.5.5v5c0 .276-.224.5-.5.5h-5c-.276 0-.5-.224-.5-.5V8.355c.317.094.652.145 1 .145V9h4V5h-.5c0-.348-.05-.683-.145-1H9.5z\"></path><circle cx=\"5\" cy=\"5\" r=\"2.5\" stroke=\"#434343\"></circle></g></g></symbol><symbol id=\"ic-icon-arrow-2\" viewBox=\"0 0 32 32\"><path fill=\"none\" stroke=\"inherit\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M21.793 18.5H2.5v-5h18.935l-7.6-8h5.872l10.5 10.5-10.5 10.5h-5.914l8-8z\"></path></symbol><symbol id=\"ic-icon-arrow-3\" viewBox=\"0 0 32 32\"><path fill=\"none\" stroke=\"inherit\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M25.288 16.42L14.208 27.5H6.792l11.291-11.291L6.826 4.5h7.381l11.661 11.661-.58.258z\"></path></symbol><symbol id=\"ic-icon-arrow\" viewBox=\"0 0 32 32\"><path fill=\"none\" stroke=\"inherit\" d=\"M2.5 11.5v9h18v5.293L30.293 16 20.5 6.207V11.5h-18z\"></path></symbol><symbol id=\"ic-icon-bubble\" viewBox=\"0 0 32 32\"><path fill=\"none\" stroke=\"inherit\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M22.207 24.5L16.5 30.207V24.5H8A6.5 6.5 0 0 1 1.5 18V9A6.5 6.5 0 0 1 8 2.5h16A6.5 6.5 0 0 1 30.5 9v9a6.5 6.5 0 0 1-6.5 6.5h-1.793z\"></path></symbol><symbol id=\"ic-icon-heart\" viewBox=\"0 0 32 32\"><path fill-rule=\"nonzero\" fill=\"none\" stroke=\"inherit\" d=\"M15.996 30.675l1.981-1.79c7.898-7.177 10.365-9.718 12.135-13.012.922-1.716 1.377-3.37 1.377-5.076 0-4.65-3.647-8.297-8.297-8.297-2.33 0-4.86 1.527-6.817 3.824l-.38.447-.381-.447C13.658 4.027 11.126 2.5 8.797 2.5 4.147 2.5.5 6.147.5 10.797c0 1.714.46 3.375 1.389 5.098 1.775 3.288 4.26 5.843 12.123 12.974l1.984 1.806z\"></path></symbol><symbol id=\"ic-icon-load\" viewBox=\"0 0 32 32\"><path fill=\"none\" stroke=\"inherit\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M17.314 18.867l1.951-2.53 4 5.184h-17l6.5-8.84 4.549 6.186z\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M18.01 4a11.798 11.798 0 0 0 0 1H3v24h24V14.986a8.738 8.738 0 0 0 1 0V29a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h15.01z\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M25 3h1v9h-1z\"></path><path fill=\"none\" stroke=\"inherit\" d=\"M22 6l3.5-3.5L29 6\"></path></symbol><symbol id=\"ic-icon-location\" viewBox=\"0 0 32 32\"><path fill=\"none\" stroke=\"inherit\" d=\"M16 31.28C23.675 23.302 27.5 17.181 27.5 13c0-6.351-5.149-11.5-11.5-11.5S4.5 6.649 4.5 13c0 4.181 3.825 10.302 11.5 18.28z\"></path><circle fill=\"none\" stroke=\"inherit\" cx=\"16\" cy=\"13\" r=\"4.5\"></circle></symbol><symbol id=\"ic-icon-polygon\" viewBox=\"0 0 32 32\"><path fill=\"none\" stroke=\"inherit\" d=\"M.576 16L8.29 29.5h15.42L31.424 16 23.71 2.5H8.29L.576 16z\"></path></symbol><symbol id=\"ic-icon-star-2\" viewBox=\"0 0 32 32\"><path fill=\"none\" stroke=\"inherit\" d=\"M19.446 31.592l2.265-3.272 3.946.25.636-3.94 3.665-1.505-1.12-3.832 2.655-2.962-2.656-2.962 1.12-3.832-3.664-1.505-.636-3.941-3.946.25-2.265-3.271L16 3.024 12.554 1.07 10.289 4.34l-3.946-.25-.636 3.941-3.665 1.505 1.12 3.832L.508 16.33l2.656 2.962-1.12 3.832 3.664 1.504.636 3.942 3.946-.25 2.265 3.27L16 29.638l3.446 1.955z\"></path></symbol><symbol id=\"ic-icon-star\" viewBox=\"0 0 32 32\"><path fill=\"none\" stroke=\"inherit\" d=\"M25.292 29.878l-1.775-10.346 7.517-7.327-10.388-1.51L16 1.282l-4.646 9.413-10.388 1.51 7.517 7.327-1.775 10.346L16 24.993l9.292 4.885z\"></path></symbol><symbol id=\"ic-icon\" viewBox=\"0 0 24 24\"><path fill=\"none\" stroke=\"inherit\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M11.923 19.136L5.424 22l.715-7.065-4.731-5.296 6.94-1.503L11.923 2l3.574 6.136 6.94 1.503-4.731 5.296L18.42 22z\"></path></symbol><symbol id=\"ic-mask-load\" viewBox=\"0 0 32 32\"><path stroke=\"none\" fill=\"none\" d=\"M0 0h32v32H0z\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M18.01 4a11.798 11.798 0 0 0 0 1H3v24h24V14.986a8.738 8.738 0 0 0 1 0V29a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h15.01zM15 23a6 6 0 1 1 0-12 6 6 0 0 1 0 12zm0-1a5 5 0 1 0 0-10 5 5 0 0 0 0 10z\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M25 3h1v9h-1z\"></path><path fill=\"none\" stroke=\"inherit\" d=\"M22 6l3.5-3.5L29 6\"></path></symbol><symbol id=\"ic-mask\" viewBox=\"0 0 24 24\"><circle cx=\"12\" cy=\"12\" r=\"4.5\" stroke=\"inherit\" fill=\"none\"></circle><path stroke=\"none\" fill=\"inherit\" d=\"M2 1h20a1 1 0 0 1 1 1v20a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1zm0 1v20h20V2H2z\"></path></symbol><symbol id=\"ic-redo\" viewBox=\"0 0 24 24\"><path d=\"M0 0h24v24H0z\" opacity=\".5\" fill=\"none\" stroke=\"none\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M21 6H9a6 6 0 1 0 0 12h12v1H9A7 7 0 0 1 9 5h12v1z\"></path><path fill=\"none\" stroke=\"inherit\" stroke-linecap=\"square\" d=\"M19 3l2.5 2.5L19 8\"></path></symbol><symbol id=\"ic-reset\" viewBox=\"0 0 24 24\"><path d=\"M0 0h24v24H0z\" opacity=\".5\" stroke=\"none\" fill=\"none\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M2 13v-1a7 7 0 0 1 7-7h13v1h-1v5h1v1a7 7 0 0 1-7 7H2v-1h1v-5H2zm7-7a6 6 0 0 0-6 6v6h12a6 6 0 0 0 6-6V6H9z\"></path><path fill=\"none\" stroke=\"inherit\" stroke-linecap=\"square\" d=\"M19 3l2.5 2.5L19 8M5 16l-2.5 2.5L5 21\"></path></symbol><symbol id=\"ic-rotate-clockwise\" viewBox=\"0 0 32 32\"><path stroke=\"none\" fill=\"inherit\" d=\"M29 17h-.924c0 6.627-5.373 12-12 12-6.628 0-12-5.373-12-12C4.076 10.398 9.407 5.041 16 5V4C8.82 4 3 9.82 3 17s5.82 13 13 13 13-5.82 13-13z\"></path><path fill=\"none\" stroke=\"inherit\" stroke-linecap=\"square\" d=\"M16 1.5l4 3-4 3\"></path><path stroke=\"none\" fill=\"inherit\" fill-rule=\"nonzero\" d=\"M16 4h4v1h-4z\"></path></symbol><symbol id=\"ic-rotate-counterclockwise\" viewBox=\"0 0 32 32\"><path stroke=\"none\" d=\"M3 17h.924c0 6.627 5.373 12 12 12 6.628 0 12-5.373 12-12 0-6.602-5.331-11.96-11.924-12V4c7.18 0 13 5.82 13 13s-5.82 13-13 13S3 24.18 3 17z\"></path><path stroke=\"none\" fill=\"inherit\" fill-rule=\"nonzero\" d=\"M12 4h4v1h-4z\"></path><path fill=\"none\" stroke=\"inherit\" stroke-linecap=\"square\" d=\"M16 1.5l-4 3 4 3\"></path></symbol><symbol id=\"ic-rotate\" viewBox=\"0 0 24 24\"><path d=\"M0 0h24v24H0z\" fill=\"none\" stroke=\"none\"></path><path fill=\"inherit\" stroke=\"none\" d=\"M8.349 22.254a10.002 10.002 0 0 1-2.778-1.719l.65-.76a9.002 9.002 0 0 0 2.495 1.548l-.367.931zm2.873.704l.078-.997a9 9 0 1 0-.557-17.852l-.14-.99A10.076 10.076 0 0 1 12.145 3c5.523 0 10 4.477 10 10s-4.477 10-10 10c-.312 0-.62-.014-.924-.042zm-7.556-4.655a9.942 9.942 0 0 1-1.253-2.996l.973-.234a8.948 8.948 0 0 0 1.124 2.693l-.844.537zm-1.502-5.91A9.949 9.949 0 0 1 2.88 9.23l.925.382a8.954 8.954 0 0 0-.644 2.844l-.998-.062zm2.21-5.686c.687-.848 1.51-1.58 2.436-2.166l.523.852a9.048 9.048 0 0 0-2.188 1.95l-.771-.636z\"></path><path stroke=\"inherit\" fill=\"none\" stroke-linecap=\"square\" d=\"M13 1l-2.5 2.5L13 6\"></path></symbol><symbol id=\"ic-shape-circle\" viewBox=\"0 0 32 32\"><circle cx=\"16\" cy=\"16\" r=\"14.5\" fill=\"none\" stroke=\"inherit\"></circle></symbol><symbol id=\"ic-shape-rectangle\" viewBox=\"0 0 32 32\"><rect width=\"27\" height=\"27\" x=\"2.5\" y=\"2.5\" fill=\"none\" stroke=\"inherit\" rx=\"1\"></rect></symbol><symbol id=\"ic-shape-triangle\" viewBox=\"0 0 32 32\"><path fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M16 2.5l15.5 27H.5z\"></path></symbol><symbol id=\"ic-shape\" viewBox=\"0 0 24 24\"><path stroke=\"none\" fill=\"inherit\" d=\"M14.706 8H21a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H9a1 1 0 0 1-1-1v-4h1v4h12V9h-5.706l-.588-1z\"></path><path fill=\"none\" stroke=\"inherit\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M8.5 1.5l7.5 13H1z\"></path></symbol><symbol id=\"ic-text-align-center\" viewBox=\"0 0 32 32\"><path stroke=\"none\" fill=\"none\" d=\"M0 0h32v32H0z\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M2 5h28v1H2zM8 12h16v1H8zM2 19h28v1H2zM8 26h16v1H8z\"></path></symbol><symbol id=\"ic-text-align-left\" viewBox=\"0 0 32 32\"><path stroke=\"none\" fill=\"none\" d=\"M0 0h32v32H0z\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M2 5h28v1H2zM2 12h16v1H2zM2 19h28v1H2zM2 26h16v1H2z\"></path></symbol><symbol id=\"ic-text-align-right\" viewBox=\"0 0 32 32\"><path stroke=\"none\" fill=\"none\" d=\"M0 0h32v32H0z\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M2 5h28v1H2zM14 12h16v1H14zM2 19h28v1H2zM14 26h16v1H14z\"></path></symbol><symbol id=\"ic-text-bold\" viewBox=\"0 0 32 32\"><path fill=\"none\" stroke=\"none\" d=\"M0 0h32v32H0z\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M7 2h2v2H7zM7 28h2v2H7z\"></path><path fill=\"none\" stroke=\"inherit\" stroke-width=\"2\" d=\"M9 3v12h9a6 6 0 1 0 0-12H9zM9 15v14h10a7 7 0 0 0 0-14H9z\"></path></symbol><symbol id=\"ic-text-italic\" viewBox=\"0 0 32 32\"><path fill=\"none\" stroke=\"none\" d=\"M0 0h32v32H0z\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M15 2h5v1h-5zM11 29h5v1h-5zM17 3h1l-4 26h-1z\"></path></symbol><symbol id=\"ic-text-underline\" viewBox=\"0 0 32 32\"><path stroke=\"none\" fill=\"none\" d=\"M0 0h32v32H0z\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M8 2v14a8 8 0 1 0 16 0V2h1v14a9 9 0 0 1-18 0V2h1zM3 29h26v1H3z\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M5 2h5v1H5zM22 2h5v1h-5z\"></path></symbol><symbol id=\"ic-text\" viewBox=\"0 0 24 24\"><path stroke=\"none\" fill=\"inherit\" d=\"M4 3h15a1 1 0 0 1 1 1H3a1 1 0 0 1 1-1zM3 4h1v1H3zM19 4h1v1h-1z\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M11 3h1v18h-1z\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M10 20h3v1h-3z\"></path></symbol><symbol id=\"ic-undo\" viewBox=\"0 0 24 24\"><path d=\"M24 0H0v24h24z\" opacity=\".5\" fill=\"none\" stroke=\"none\"></path><path stroke=\"none\" fill=\"inherit\" d=\"M3 6h12a6 6 0 1 1 0 12H3v1h12a7 7 0 0 0 0-14H3v1z\"></path><path fill=\"none\" stroke=\"inherit\" stroke-linecap=\"square\" d=\"M5 3L2.5 5.5 5 8\"></path></symbol><symbol id=\"ic-zoom-in\" viewBox=\"0 0 24 24\"><g transform=\"translate(-229 -290) translate(229 290)\"><circle cx=\"10.5\" cy=\"10.5\" r=\"9\" stroke=\"inherit\" fill=\"none\"></circle><path fill=\"inherit\" d=\"M18.828 15.828H19.828V22.828H18.828z\" transform=\"rotate(-45 19.328 19.328)\"></path><path fill=\"inherit\" d=\"M7 10H14V11H7z\"></path><path fill=\"inherit\" d=\"M10 7H11V14H10z\"></path></g></symbol><symbol id=\"ic-zoom-out\" viewBox=\"0 0 24 24\"><g transform=\"translate(-263 -290) translate(263 290)\"><circle cx=\"10.5\" cy=\"10.5\" r=\"9\" stroke=\"inherit\" fill=\"none\"></circle><path fill=\"inherit\" d=\"M18.828 15.828H19.828V22.828H18.828z\" transform=\"rotate(-45 19.328 19.328)\"></path><path fill=\"inherit\" d=\"M7 10H14V11H7z\"></path></g></symbol><symbol id=\"ic-hand\" viewBox=\"0 0 24 24\"><g fill=\"none\" fill-rule=\"evenodd\" stroke-linejoin=\"round\"><path fill=\"inherit\" fill-rule=\"nonzero\" d=\"M8.672 3.36c1.328 0 2.114.78 2.29 1.869l.014.101.023.006v1.042l-.638-.185c-.187-.055-.323-.211-.354-.399L10 5.713c0-.825-.42-1.353-1.328-1.353C7.695 4.36 7 5.041 7 5.713v7.941c0 .439-.524.665-.843.364l-1.868-1.761c-.595-.528-1.316-.617-1.918-.216-.522.348-.562 1.203-.18 1.8L7.738 22h11.013l.285-.518c1.247-2.326 1.897-4.259 1.96-5.785l.004-.239V8.035c0-.656-.5-1.17-1-1.17-.503 0-1 .456-1 1.17 0 .333-.32.573-.64.48L18 8.41V7.368l.086.026.042-.136c.279-.805.978-1.332 1.738-1.388L20 5.865c1.057 0 2 .967 2 2.17v7.423c0 1.929-.845 4.352-2.521 7.29-.09.156-.255.252-.435.252H7.474c-.166 0-.321-.082-.414-.219l-5.704-8.39c-.653-1.019-.584-2.486.46-3.182 1-.666 2.216-.516 3.148.31L6 12.495V5.713c0-1.18 1.058-2.263 2.49-2.348z\" transform=\"translate(-297 -290) translate(297 290)\"></path><path fill=\"inherit\" fill-rule=\"nonzero\" d=\"M12.5 1.5c1.325 0 2.41 1.032 2.495 2.336L15 4v7.22h-1V4c0-.828-.672-1.5-1.5-1.5-.78 0-1.42.595-1.493 1.356L11 4v7.22h-1V4c0-1.38 1.12-2.5 2.5-2.5z\" transform=\"translate(-297 -290) translate(297 290)\"></path><path fill=\"inherit\" fill-rule=\"nonzero\" d=\"M16.5 3.5c1.325 0 2.41 1.032 2.495 2.336L19 6v6.3h-1V6c0-.828-.672-1.5-1.5-1.5-.78 0-1.42.595-1.493 1.356L15 6v2.44h-1V6c0-1.38 1.12-2.5 2.5-2.5z\" transform=\"translate(-297 -290) translate(297 290)\"></path></g></symbol></defs></svg>"
|
|
|
|
/***/ }),
|
|
|
|
/***/ "fabric":
|
|
/*!****************************************************************************************************************!*\
|
|
!*** external {"commonjs":["fabric","fabric"],"commonjs2":["fabric","fabric"],"amd":"fabric","root":"fabric"} ***!
|
|
\****************************************************************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
module.exports = __WEBPACK_EXTERNAL_MODULE_fabric__;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "tui-code-snippet":
|
|
/*!******************************************************************************************************************************!*\
|
|
!*** external {"commonjs":"tui-code-snippet","commonjs2":"tui-code-snippet","amd":"tui-code-snippet","root":["tui","util"]} ***!
|
|
\******************************************************************************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
module.exports = __WEBPACK_EXTERNAL_MODULE_tui_code_snippet__;
|
|
|
|
/***/ }),
|
|
|
|
/***/ "tui-color-picker":
|
|
/*!*************************************************************************************************************************************!*\
|
|
!*** external {"commonjs":"tui-color-picker","commonjs2":"tui-color-picker","amd":"tui-color-picker","root":["tui","colorPicker"]} ***!
|
|
\*************************************************************************************************************************************/
|
|
/*! no static exports found */
|
|
/***/ (function(module, exports) {
|
|
|
|
module.exports = __WEBPACK_EXTERNAL_MODULE_tui_color_picker__;
|
|
|
|
/***/ })
|
|
|
|
/******/ });
|
|
});
|
|
//# sourceMappingURL=tui-image-editor.js.map |