← All changes
|
assets/js/packages/editor-modal-shell/editor-modal-shell.js
+15026
-18182
4.2.4
→
4.3.1
View file →
| @@ -1,18196 +1,15040 @@ | ||
| 1 | -/******/ (function() { // webpackBootstrap | |
| 2 | -/******/ var __webpack_modules__ = ({ | |
| 1 | +(function(react, _elementor_ui) { | |
| 3 | 2 | |
| 4 | -/***/ "./node_modules/lottie-react/build/index.umd.js": | |
| 5 | -/*!******************************************************!*\ | |
| 6 | - !*** ./node_modules/lottie-react/build/index.umd.js ***! | |
| 7 | - \******************************************************/ | |
| 8 | -/***/ (function(__unused_webpack_module, exports, __webpack_require__) { | |
| 3 | +//#region \0rolldown/runtime.js | |
| 4 | + var __create = Object.create; | |
| 5 | + var __defProp = Object.defineProperty; | |
| 6 | + var __name = (target, value) => __defProp(target, "name", { | |
| 7 | + value, | |
| 8 | + configurable: true | |
| 9 | + }); | |
| 10 | + var __getOwnPropDesc = Object.getOwnPropertyDescriptor; | |
| 11 | + var __getOwnPropNames = Object.getOwnPropertyNames; | |
| 12 | + var __getProtoOf = Object.getPrototypeOf; | |
| 13 | + var __hasOwnProp = Object.prototype.hasOwnProperty; | |
| 14 | + var __commonJSMin = (cb, mod) => () => (mod || (cb((mod = { exports: {} }).exports, mod), cb = null), mod.exports); | |
| 15 | + var __exportAll = (all, no_symbols) => { | |
| 16 | + let target = {}; | |
| 17 | + for (var name in all) { | |
| 18 | + __defProp(target, name, { | |
| 19 | + get: all[name], | |
| 20 | + enumerable: true | |
| 21 | + }); | |
| 22 | + } | |
| 23 | + if (!no_symbols) { | |
| 24 | + __defProp(target, Symbol.toStringTag, { value: "Module" }); | |
| 25 | + } | |
| 26 | + return target; | |
| 27 | + }; | |
| 28 | + var __copyProps = (to, from, except, desc) => { | |
| 29 | + if (from && typeof from === "object" || typeof from === "function") { | |
| 30 | + for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) { | |
| 31 | + key = keys[i]; | |
| 32 | + if (!__hasOwnProp.call(to, key) && key !== except) { | |
| 33 | + __defProp(to, key, { | |
| 34 | + get: ((k) => from[k]).bind(null, key), | |
| 35 | + enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable | |
| 36 | + }); | |
| 37 | + } | |
| 38 | + } | |
| 39 | + } | |
| 40 | + return to; | |
| 41 | + }; | |
| 42 | + var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { | |
| 43 | + value: mod, | |
| 44 | + enumerable: true | |
| 45 | + }) : target, mod)); | |
| 9 | 46 | |
| 10 | -(function (global, factory) { | |
| 11 | - true ? factory(exports, __webpack_require__(/*! lottie-web */ "./node_modules/lottie-web/build/player/lottie.js"), __webpack_require__(/*! react */ "react")) : | |
| 12 | - 0; | |
| 13 | -})(this, (function (exports, lottie, React) { 'use strict'; | |
| 47 | +//#endregion | |
| 48 | +react = __toESM(react); | |
| 14 | 49 | |
| 15 | - function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; } | |
| 50 | +//#region packages/packages/libs/editor-modal-shell/src/components/modal-shell.tsx | |
| 51 | + var MODAL_Z_INDEX = 99999; | |
| 52 | + var DEFAULT_WIDTH = 800; | |
| 53 | + var DEFAULT_HEIGHT = 400; | |
| 54 | + var DEFAULT_REVEAL_DURATION_MS = 500; | |
| 55 | + var DEFAULT_REVEAL_DELAY_MS = 0; | |
| 56 | + var ModalShellContext = (0, react.createContext)(null); | |
| 57 | + var useModalShell = () => { | |
| 58 | + const ctx = (0, react.useContext)(ModalShellContext); | |
| 59 | + if (!ctx) throw new Error("useModalShell must be used inside a <ModalShell />"); | |
| 60 | + return ctx; | |
| 61 | + }; | |
| 62 | + var EXIT_TRANSITION_MS = 225; | |
| 63 | + var prefersReducedMotion = () => typeof window !== "undefined" && Boolean(window.matchMedia?.("(prefers-reduced-motion: reduce)").matches); | |
| 64 | + var ModalShell = ({ children, onClose, revealDuration = DEFAULT_REVEAL_DURATION_MS, revealDelay = DEFAULT_REVEAL_DELAY_MS, container, sx = {}, closeOnEsc = true, closeOnOutsideClick = true, backdrop = true, backdropSx = {}, hideCloseButton = false }) => { | |
| 65 | + const portalTarget = container ?? (typeof document !== "undefined" ? document.body : void 0); | |
| 66 | + const reducedMotion = prefersReducedMotion(); | |
| 67 | + const consumerOwnsEnter = revealDuration === 0 || reducedMotion; | |
| 68 | + const [open, setOpen] = (0, react.useState)(true); | |
| 69 | + const startClose = (0, react.useCallback)(() => setOpen(false), []); | |
| 70 | + const contextValue = (0, react.useMemo)(() => ({ close: startClose }), [startClose]); | |
| 71 | + const handleDialogClose = (_event, reason) => { | |
| 72 | + if (reason === "escapeKeyDown" && !closeOnEsc) return; | |
| 73 | + if (reason === "backdropClick" && !closeOnOutsideClick) return; | |
| 74 | + startClose(); | |
| 75 | + }; | |
| 76 | + const transitionTimeouts = (0, react.useMemo)(() => ({ | |
| 77 | + enter: 0, | |
| 78 | + exit: reducedMotion ? 0 : EXIT_TRANSITION_MS | |
| 79 | + }), [reducedMotion]); | |
| 80 | + const animationProps = (0, react.useMemo)(() => consumerOwnsEnter ? {} : { | |
| 81 | + animation: `e-modal-shell-reveal ${revealDuration}ms ease ${revealDelay}ms backwards`, | |
| 82 | + "@keyframes e-modal-shell-reveal": { | |
| 83 | + from: { | |
| 84 | + opacity: 0, | |
| 85 | + transform: "scale(0.95)" | |
| 86 | + }, | |
| 87 | + to: { | |
| 88 | + opacity: 1, | |
| 89 | + transform: "scale(1)" | |
| 90 | + } | |
| 91 | + } | |
| 92 | + }, [ | |
| 93 | + consumerOwnsEnter, | |
| 94 | + revealDuration, | |
| 95 | + revealDelay | |
| 96 | + ]); | |
| 97 | + return /* @__PURE__ */ react.createElement(_elementor_ui.Dialog, { | |
| 98 | + open, | |
| 99 | + maxWidth: false, | |
| 100 | + onClose: handleDialogClose, | |
| 101 | + container: portalTarget, | |
| 102 | + disableEscapeKeyDown: !closeOnEsc, | |
| 103 | + hideBackdrop: !backdrop, | |
| 104 | + TransitionProps: { | |
| 105 | + onExited: onClose, | |
| 106 | + timeout: transitionTimeouts | |
| 107 | + }, | |
| 108 | + slotProps: { backdrop: { | |
| 109 | + transitionDuration: transitionTimeouts, | |
| 110 | + sx: backdropSx | |
| 111 | + } }, | |
| 112 | + PaperProps: { sx: { | |
| 113 | + width: DEFAULT_WIDTH, | |
| 114 | + height: DEFAULT_HEIGHT, | |
| 115 | + maxWidth: "100%", | |
| 116 | + overflow: "hidden", | |
| 117 | + ...animationProps, | |
| 118 | + ...sx | |
| 119 | + } }, | |
| 120 | + sx: { zIndex: MODAL_Z_INDEX } | |
| 121 | + }, /* @__PURE__ */ react.createElement(ModalShellContext.Provider, { value: contextValue }, /* @__PURE__ */ react.createElement(_elementor_ui.Box, { sx: { display: "contents" } }, children, !hideCloseButton && /* @__PURE__ */ react.createElement(_elementor_ui.CloseButton, { | |
| 122 | + onClick: startClose, | |
| 123 | + sx: { | |
| 124 | + position: "absolute", | |
| 125 | + right: 16, | |
| 126 | + top: 16, | |
| 127 | + zIndex: 3 | |
| 128 | + } | |
| 129 | + })))); | |
| 130 | + }; | |
| 16 | 131 | |
| 17 | - var lottie__default = /*#__PURE__*/_interopDefaultLegacy(lottie); | |
| 18 | - var React__default = /*#__PURE__*/_interopDefaultLegacy(React); | |
| 132 | +//#endregion | |
| 133 | +//#region packages/packages/libs/editor-modal-shell/src/components/modal-header.tsx | |
| 134 | + var ModalHeader = ({ title, content }) => { | |
| 135 | + return /* @__PURE__ */ react.createElement(_elementor_ui.Stack, { gap: .75 }, /* @__PURE__ */ react.createElement(_elementor_ui.Typography, { | |
| 136 | + variant: "h4", | |
| 137 | + color: "text.primary" | |
| 138 | + }, title), /* @__PURE__ */ react.createElement(_elementor_ui.Typography, { | |
| 139 | + variant: "subtitle2", | |
| 140 | + color: "text.primary" | |
| 141 | + }, content)); | |
| 142 | + }; | |
| 19 | 143 | |
| 20 | - function _arrayLikeToArray(r, a) { | |
| 21 | - (null == a || a > r.length) && (a = r.length); | |
| 22 | - for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; | |
| 23 | - return n; | |
| 24 | - } | |
| 25 | - function _arrayWithHoles(r) { | |
| 26 | - if (Array.isArray(r)) return r; | |
| 27 | - } | |
| 28 | - function _defineProperty(e, r, t) { | |
| 29 | - return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { | |
| 30 | - value: t, | |
| 31 | - enumerable: !0, | |
| 32 | - configurable: !0, | |
| 33 | - writable: !0 | |
| 34 | - }) : e[r] = t, e; | |
| 35 | - } | |
| 36 | - function _iterableToArrayLimit(r, l) { | |
| 37 | - var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; | |
| 38 | - if (null != t) { | |
| 39 | - var e, | |
| 40 | - n, | |
| 41 | - i, | |
| 42 | - u, | |
| 43 | - a = [], | |
| 44 | - f = !0, | |
| 45 | - o = !1; | |
| 46 | - try { | |
| 47 | - if (i = (t = t.call(r)).next, 0 === l) { | |
| 48 | - if (Object(t) !== t) return; | |
| 49 | - f = !1; | |
| 50 | - } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); | |
| 51 | - } catch (r) { | |
| 52 | - o = !0, n = r; | |
| 53 | - } finally { | |
| 54 | - try { | |
| 55 | - if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; | |
| 56 | - } finally { | |
| 57 | - if (o) throw n; | |
| 58 | - } | |
| 59 | - } | |
| 60 | - return a; | |
| 61 | - } | |
| 62 | - } | |
| 63 | - function _nonIterableRest() { | |
| 64 | - throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); | |
| 65 | - } | |
| 66 | - function ownKeys(e, r) { | |
| 67 | - var t = Object.keys(e); | |
| 68 | - if (Object.getOwnPropertySymbols) { | |
| 69 | - var o = Object.getOwnPropertySymbols(e); | |
| 70 | - r && (o = o.filter(function (r) { | |
| 71 | - return Object.getOwnPropertyDescriptor(e, r).enumerable; | |
| 72 | - })), t.push.apply(t, o); | |
| 73 | - } | |
| 74 | - return t; | |
| 75 | - } | |
| 76 | - function _objectSpread2(e) { | |
| 77 | - for (var r = 1; r < arguments.length; r++) { | |
| 78 | - var t = null != arguments[r] ? arguments[r] : {}; | |
| 79 | - r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { | |
| 80 | - _defineProperty(e, r, t[r]); | |
| 81 | - }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { | |
| 82 | - Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); | |
| 83 | - }); | |
| 84 | - } | |
| 85 | - return e; | |
| 86 | - } | |
| 87 | - function _objectWithoutProperties(e, t) { | |
| 88 | - if (null == e) return {}; | |
| 89 | - var o, | |
| 90 | - r, | |
| 91 | - i = _objectWithoutPropertiesLoose(e, t); | |
| 92 | - if (Object.getOwnPropertySymbols) { | |
| 93 | - var s = Object.getOwnPropertySymbols(e); | |
| 94 | - for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); | |
| 95 | - } | |
| 96 | - return i; | |
| 97 | - } | |
| 98 | - function _objectWithoutPropertiesLoose(r, e) { | |
| 99 | - if (null == r) return {}; | |
| 100 | - var t = {}; | |
| 101 | - for (var n in r) if ({}.hasOwnProperty.call(r, n)) { | |
| 102 | - if (e.includes(n)) continue; | |
| 103 | - t[n] = r[n]; | |
| 104 | - } | |
| 105 | - return t; | |
| 106 | - } | |
| 107 | - function _slicedToArray(r, e) { | |
| 108 | - return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); | |
| 109 | - } | |
| 110 | - function _toPrimitive(t, r) { | |
| 111 | - if ("object" != typeof t || !t) return t; | |
| 112 | - var e = t[Symbol.toPrimitive]; | |
| 113 | - if (void 0 !== e) { | |
| 114 | - var i = e.call(t, r || "default"); | |
| 115 | - if ("object" != typeof i) return i; | |
| 116 | - throw new TypeError("@@toPrimitive must return a primitive value."); | |
| 117 | - } | |
| 118 | - return ("string" === r ? String : Number)(t); | |
| 119 | - } | |
| 120 | - function _toPropertyKey(t) { | |
| 121 | - var i = _toPrimitive(t, "string"); | |
| 122 | - return "symbol" == typeof i ? i : i + ""; | |
| 123 | - } | |
| 124 | - function _unsupportedIterableToArray(r, a) { | |
| 125 | - if (r) { | |
| 126 | - if ("string" == typeof r) return _arrayLikeToArray(r, a); | |
| 127 | - var t = {}.toString.call(r).slice(8, -1); | |
| 128 | - return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; | |
| 129 | - } | |
| 130 | - } | |
| 144 | +//#endregion | |
| 145 | +//#region packages/packages/libs/editor-modal-shell/src/components/modal-footer.tsx | |
| 146 | + var ModalFooter = ({ helpText, link }) => { | |
| 147 | + return /* @__PURE__ */ react.createElement(_elementor_ui.Stack, { | |
| 148 | + direction: "row", | |
| 149 | + alignItems: "center", | |
| 150 | + gap: 1 | |
| 151 | + }, /* @__PURE__ */ react.createElement(_elementor_ui.Typography, { | |
| 152 | + variant: "caption", | |
| 153 | + color: "text.tertiary", | |
| 154 | + sx: { | |
| 155 | + fontSize: "11px", | |
| 156 | + lineHeight: "normal" | |
| 157 | + } | |
| 158 | + }, helpText), /* @__PURE__ */ react.createElement(_elementor_ui.Button, { | |
| 159 | + href: link.url, | |
| 160 | + target: "_blank", | |
| 161 | + variant: "text", | |
| 162 | + size: "small", | |
| 163 | + color: "info", | |
| 164 | + sx: { fontSize: "11px" } | |
| 165 | + }, link.text)); | |
| 166 | + }; | |
| 131 | 167 | |
| 132 | - var _excluded$1 = ["animationData", "loop", "autoplay", "initialSegment", "onComplete", "onLoopComplete", "onEnterFrame", "onSegmentStart", "onConfigReady", "onDataReady", "onDataFailed", "onLoadedImages", "onDOMLoaded", "onDestroy", "lottieRef", "renderer", "name", "assetsPath", "rendererSettings"]; | |
| 133 | - var useLottie = function useLottie(props, style) { | |
| 134 | - var animationData = props.animationData, | |
| 135 | - loop = props.loop, | |
| 136 | - autoplay = props.autoplay, | |
| 137 | - initialSegment = props.initialSegment, | |
| 138 | - onComplete = props.onComplete, | |
| 139 | - onLoopComplete = props.onLoopComplete, | |
| 140 | - onEnterFrame = props.onEnterFrame, | |
| 141 | - onSegmentStart = props.onSegmentStart, | |
| 142 | - onConfigReady = props.onConfigReady, | |
| 143 | - onDataReady = props.onDataReady, | |
| 144 | - onDataFailed = props.onDataFailed, | |
| 145 | - onLoadedImages = props.onLoadedImages, | |
| 146 | - onDOMLoaded = props.onDOMLoaded, | |
| 147 | - onDestroy = props.onDestroy; | |
| 148 | - props.lottieRef; | |
| 149 | - props.renderer; | |
| 150 | - props.name; | |
| 151 | - props.assetsPath; | |
| 152 | - props.rendererSettings; | |
| 153 | - var rest = _objectWithoutProperties(props, _excluded$1); | |
| 154 | - var _useState = React.useState(false), | |
| 155 | - _useState2 = _slicedToArray(_useState, 2), | |
| 156 | - animationLoaded = _useState2[0], | |
| 157 | - setAnimationLoaded = _useState2[1]; | |
| 158 | - var animationInstanceRef = React.useRef(); | |
| 159 | - var animationContainer = React.useRef(null); | |
| 160 | - /* | |
| 161 | - ====================================== | |
| 162 | - INTERACTION METHODS | |
| 163 | - ====================================== | |
| 164 | - */ | |
| 165 | - /** | |
| 166 | - * Play | |
| 167 | - */ | |
| 168 | - var play = function play() { | |
| 169 | - var _a; | |
| 170 | - (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.play(); | |
| 171 | - }; | |
| 172 | - /** | |
| 173 | - * Stop | |
| 174 | - */ | |
| 175 | - var stop = function stop() { | |
| 176 | - var _a; | |
| 177 | - (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.stop(); | |
| 178 | - }; | |
| 179 | - /** | |
| 180 | - * Pause | |
| 181 | - */ | |
| 182 | - var pause = function pause() { | |
| 183 | - var _a; | |
| 184 | - (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.pause(); | |
| 185 | - }; | |
| 186 | - /** | |
| 187 | - * Set animation speed | |
| 188 | - * @param speed | |
| 189 | - */ | |
| 190 | - var setSpeed = function setSpeed(speed) { | |
| 191 | - var _a; | |
| 192 | - (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.setSpeed(speed); | |
| 193 | - }; | |
| 194 | - /** | |
| 195 | - * Got to frame and play | |
| 196 | - * @param value | |
| 197 | - * @param isFrame | |
| 198 | - */ | |
| 199 | - var goToAndPlay = function goToAndPlay(value, isFrame) { | |
| 200 | - var _a; | |
| 201 | - (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.goToAndPlay(value, isFrame); | |
| 202 | - }; | |
| 203 | - /** | |
| 204 | - * Got to frame and stop | |
| 205 | - * @param value | |
| 206 | - * @param isFrame | |
| 207 | - */ | |
| 208 | - var goToAndStop = function goToAndStop(value, isFrame) { | |
| 209 | - var _a; | |
| 210 | - (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.goToAndStop(value, isFrame); | |
| 211 | - }; | |
| 212 | - /** | |
| 213 | - * Set animation direction | |
| 214 | - * @param direction | |
| 215 | - */ | |
| 216 | - var setDirection = function setDirection(direction) { | |
| 217 | - var _a; | |
| 218 | - (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.setDirection(direction); | |
| 219 | - }; | |
| 220 | - /** | |
| 221 | - * Play animation segments | |
| 222 | - * @param segments | |
| 223 | - * @param forceFlag | |
| 224 | - */ | |
| 225 | - var playSegments = function playSegments(segments, forceFlag) { | |
| 226 | - var _a; | |
| 227 | - (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.playSegments(segments, forceFlag); | |
| 228 | - }; | |
| 229 | - /** | |
| 230 | - * Set sub frames | |
| 231 | - * @param useSubFrames | |
| 232 | - */ | |
| 233 | - var setSubframe = function setSubframe(useSubFrames) { | |
| 234 | - var _a; | |
| 235 | - (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.setSubframe(useSubFrames); | |
| 236 | - }; | |
| 237 | - /** | |
| 238 | - * Get animation duration | |
| 239 | - * @param inFrames | |
| 240 | - */ | |
| 241 | - var getDuration = function getDuration(inFrames) { | |
| 242 | - var _a; | |
| 243 | - return (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.getDuration(inFrames); | |
| 244 | - }; | |
| 245 | - /** | |
| 246 | - * Destroy animation | |
| 247 | - */ | |
| 248 | - var destroy = function destroy() { | |
| 249 | - var _a; | |
| 250 | - (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.destroy(); | |
| 251 | - // Removing the reference to the animation so separate cleanups are skipped. | |
| 252 | - // Without it the internal `lottie-react` instance throws exceptions as it already cleared itself on destroy. | |
| 253 | - animationInstanceRef.current = undefined; | |
| 254 | - }; | |
| 255 | - /* | |
| 256 | - ====================================== | |
| 257 | - LOTTIE | |
| 258 | - ====================================== | |
| 259 | - */ | |
| 260 | - /** | |
| 261 | - * Load a new animation, and if it's the case, destroy the previous one | |
| 262 | - * @param {Object} forcedConfigs | |
| 263 | - */ | |
| 264 | - var loadAnimation = function loadAnimation() { | |
| 265 | - var forcedConfigs = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; | |
| 266 | - var _a; | |
| 267 | - // Return if the container ref is null | |
| 268 | - if (!animationContainer.current) { | |
| 269 | - return; | |
| 270 | - } | |
| 271 | - // Destroy any previous instance | |
| 272 | - (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.destroy(); | |
| 273 | - // Build the animation configuration | |
| 274 | - var config = _objectSpread2(_objectSpread2(_objectSpread2({}, props), forcedConfigs), {}, { | |
| 275 | - container: animationContainer.current | |
| 276 | - }); | |
| 277 | - // Save the animation instance | |
| 278 | - animationInstanceRef.current = lottie__default["default"].loadAnimation(config); | |
| 279 | - setAnimationLoaded(!!animationInstanceRef.current); | |
| 280 | - // Return a function that will clean up | |
| 281 | - return function () { | |
| 282 | - var _a; | |
| 283 | - (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.destroy(); | |
| 284 | - animationInstanceRef.current = undefined; | |
| 285 | - }; | |
| 286 | - }; | |
| 287 | - /** | |
| 288 | - * (Re)Initialize when animation data changed | |
| 289 | - */ | |
| 290 | - React.useEffect(function () { | |
| 291 | - var onUnmount = loadAnimation(); | |
| 292 | - // Clean up on unmount | |
| 293 | - return function () { | |
| 294 | - return onUnmount === null || onUnmount === void 0 ? void 0 : onUnmount(); | |
| 295 | - }; | |
| 296 | - // eslint-disable-next-line react-hooks/exhaustive-deps | |
| 297 | - }, [animationData, loop]); | |
| 298 | - // Update the autoplay state | |
| 299 | - React.useEffect(function () { | |
| 300 | - if (!animationInstanceRef.current) { | |
| 301 | - return; | |
| 302 | - } | |
| 303 | - animationInstanceRef.current.autoplay = !!autoplay; | |
| 304 | - }, [autoplay]); | |
| 305 | - // Update the initial segment state | |
| 306 | - React.useEffect(function () { | |
| 307 | - if (!animationInstanceRef.current) { | |
| 308 | - return; | |
| 309 | - } | |
| 310 | - // When null should reset to default animation length | |
| 311 | - if (!initialSegment) { | |
| 312 | - animationInstanceRef.current.resetSegments(true); | |
| 313 | - return; | |
| 314 | - } | |
| 315 | - // If it's not a valid segment, do nothing | |
| 316 | - if (!Array.isArray(initialSegment) || !initialSegment.length) { | |
| 317 | - return; | |
| 318 | - } | |
| 319 | - // If the current position it's not in the new segment | |
| 320 | - // set the current position to start | |
| 321 | - if (animationInstanceRef.current.currentRawFrame < initialSegment[0] || animationInstanceRef.current.currentRawFrame > initialSegment[1]) { | |
| 322 | - animationInstanceRef.current.currentRawFrame = initialSegment[0]; | |
| 323 | - } | |
| 324 | - // Update the segment | |
| 325 | - animationInstanceRef.current.setSegment(initialSegment[0], initialSegment[1]); | |
| 326 | - }, [initialSegment]); | |
| 327 | - /* | |
| 328 | - ====================================== | |
| 329 | - EVENTS | |
| 330 | - ====================================== | |
| 331 | - */ | |
| 332 | - /** | |
| 333 | - * Reinitialize listener on change | |
| 334 | - */ | |
| 335 | - React.useEffect(function () { | |
| 336 | - var partialListeners = [{ | |
| 337 | - name: "complete", | |
| 338 | - handler: onComplete | |
| 339 | - }, { | |
| 340 | - name: "loopComplete", | |
| 341 | - handler: onLoopComplete | |
| 342 | - }, { | |
| 343 | - name: "enterFrame", | |
| 344 | - handler: onEnterFrame | |
| 345 | - }, { | |
| 346 | - name: "segmentStart", | |
| 347 | - handler: onSegmentStart | |
| 348 | - }, { | |
| 349 | - name: "config_ready", | |
| 350 | - handler: onConfigReady | |
| 351 | - }, { | |
| 352 | - name: "data_ready", | |
| 353 | - handler: onDataReady | |
| 354 | - }, { | |
| 355 | - name: "data_failed", | |
| 356 | - handler: onDataFailed | |
| 357 | - }, { | |
| 358 | - name: "loaded_images", | |
| 359 | - handler: onLoadedImages | |
| 360 | - }, { | |
| 361 | - name: "DOMLoaded", | |
| 362 | - handler: onDOMLoaded | |
| 363 | - }, { | |
| 364 | - name: "destroy", | |
| 365 | - handler: onDestroy | |
| 366 | - }]; | |
| 367 | - var listeners = partialListeners.filter(function (listener) { | |
| 368 | - return listener.handler != null; | |
| 369 | - }); | |
| 370 | - if (!listeners.length) { | |
| 371 | - return; | |
| 372 | - } | |
| 373 | - var deregisterList = listeners.map( | |
| 374 | - /** | |
| 375 | - * Handle the process of adding an event listener | |
| 376 | - * @param {Listener} listener | |
| 377 | - * @return {Function} Function that deregister the listener | |
| 378 | - */ | |
| 379 | - function (listener) { | |
| 380 | - var _a; | |
| 381 | - (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.addEventListener(listener.name, listener.handler); | |
| 382 | - // Return a function to deregister this listener | |
| 383 | - return function () { | |
| 384 | - var _a; | |
| 385 | - (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener(listener.name, listener.handler); | |
| 386 | - }; | |
| 387 | - }); | |
| 388 | - // Deregister listeners on unmount | |
| 389 | - return function () { | |
| 390 | - deregisterList.forEach(function (deregister) { | |
| 391 | - return deregister(); | |
| 392 | - }); | |
| 393 | - }; | |
| 394 | - }, [onComplete, onLoopComplete, onEnterFrame, onSegmentStart, onConfigReady, onDataReady, onDataFailed, onLoadedImages, onDOMLoaded, onDestroy]); | |
| 395 | - /** | |
| 396 | - * Build the animation view | |
| 397 | - */ | |
| 398 | - var View = /*#__PURE__*/React__default["default"].createElement("div", _objectSpread2({ | |
| 399 | - style: style, | |
| 400 | - ref: animationContainer | |
| 401 | - }, rest)); | |
| 402 | - return { | |
| 403 | - View: View, | |
| 404 | - play: play, | |
| 405 | - stop: stop, | |
| 406 | - pause: pause, | |
| 407 | - setSpeed: setSpeed, | |
| 408 | - goToAndStop: goToAndStop, | |
| 409 | - goToAndPlay: goToAndPlay, | |
| 410 | - setDirection: setDirection, | |
| 411 | - playSegments: playSegments, | |
| 412 | - setSubframe: setSubframe, | |
| 413 | - getDuration: getDuration, | |
| 414 | - destroy: destroy, | |
| 415 | - animationContainerRef: animationContainer, | |
| 416 | - animationLoaded: animationLoaded, | |
| 417 | - animationItem: animationInstanceRef.current | |
| 418 | - }; | |
| 419 | - }; | |
| 168 | +//#endregion | |
| 169 | +//#region node_modules/lottie-web/build/player/lottie.js | |
| 170 | + var require_lottie = /* @__PURE__ */ __commonJSMin(((exports, module) => { | |
| 171 | + typeof document !== "undefined" && typeof navigator !== "undefined" && (function(global, factory) { | |
| 172 | + typeof exports === "object" && typeof module !== "undefined" ? module.exports = factory() : typeof define === "function" && define.amd ? define(factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, global.lottie = factory()); | |
| 173 | + })(exports, (function() { | |
| 174 | + "use strict"; | |
| 175 | + var svgNS = "http://www.w3.org/2000/svg"; | |
| 176 | + var locationHref = ""; | |
| 177 | + var _useWebWorker = false; | |
| 178 | + var initialDefaultFrame = -999999; | |
| 179 | + var setWebWorker = function setWebWorker(flag) { | |
| 180 | + _useWebWorker = !!flag; | |
| 181 | + }; | |
| 182 | + var getWebWorker = function getWebWorker() { | |
| 183 | + return _useWebWorker; | |
| 184 | + }; | |
| 185 | + var setLocationHref = function setLocationHref(value) { | |
| 186 | + locationHref = value; | |
| 187 | + }; | |
| 188 | + var getLocationHref = function getLocationHref() { | |
| 189 | + return locationHref; | |
| 190 | + }; | |
| 191 | + function createTag(type) { | |
| 192 | + return document.createElement(type); | |
| 193 | + } | |
| 194 | + function extendPrototype(sources, destination) { | |
| 195 | + var i; | |
| 196 | + var len = sources.length; | |
| 197 | + var sourcePrototype; | |
| 198 | + for (i = 0; i < len; i += 1) { | |
| 199 | + sourcePrototype = sources[i].prototype; | |
| 200 | + for (var attr in sourcePrototype) if (Object.prototype.hasOwnProperty.call(sourcePrototype, attr)) destination.prototype[attr] = sourcePrototype[attr]; | |
| 201 | + } | |
| 202 | + } | |
| 203 | + function getDescriptor(object, prop) { | |
| 204 | + return Object.getOwnPropertyDescriptor(object, prop); | |
| 205 | + } | |
| 206 | + function createProxyFunction(prototype) { | |
| 207 | + function ProxyFunction() {} | |
| 208 | + ProxyFunction.prototype = prototype; | |
| 209 | + return ProxyFunction; | |
| 210 | + } | |
| 211 | + var audioControllerFactory = function() { | |
| 212 | + function AudioController(audioFactory) { | |
| 213 | + this.audios = []; | |
| 214 | + this.audioFactory = audioFactory; | |
| 215 | + this._volume = 1; | |
| 216 | + this._isMuted = false; | |
| 217 | + } | |
| 218 | + AudioController.prototype = { | |
| 219 | + addAudio: function addAudio(audio) { | |
| 220 | + this.audios.push(audio); | |
| 221 | + }, | |
| 222 | + pause: function pause() { | |
| 223 | + var i; | |
| 224 | + var len = this.audios.length; | |
| 225 | + for (i = 0; i < len; i += 1) this.audios[i].pause(); | |
| 226 | + }, | |
| 227 | + resume: function resume() { | |
| 228 | + var i; | |
| 229 | + var len = this.audios.length; | |
| 230 | + for (i = 0; i < len; i += 1) this.audios[i].resume(); | |
| 231 | + }, | |
| 232 | + setRate: function setRate(rateValue) { | |
| 233 | + var i; | |
| 234 | + var len = this.audios.length; | |
| 235 | + for (i = 0; i < len; i += 1) this.audios[i].setRate(rateValue); | |
| 236 | + }, | |
| 237 | + createAudio: function createAudio(assetPath) { | |
| 238 | + if (this.audioFactory) return this.audioFactory(assetPath); | |
| 239 | + if (window.Howl) return new window.Howl({ src: [assetPath] }); | |
| 240 | + return { | |
| 241 | + isPlaying: false, | |
| 242 | + play: function play() { | |
| 243 | + this.isPlaying = true; | |
| 244 | + }, | |
| 245 | + seek: function seek() { | |
| 246 | + this.isPlaying = false; | |
| 247 | + }, | |
| 248 | + playing: function playing() {}, | |
| 249 | + rate: function rate() {}, | |
| 250 | + setVolume: function setVolume() {} | |
| 251 | + }; | |
| 252 | + }, | |
| 253 | + setAudioFactory: function setAudioFactory(audioFactory) { | |
| 254 | + this.audioFactory = audioFactory; | |
| 255 | + }, | |
| 256 | + setVolume: function setVolume(value) { | |
| 257 | + this._volume = value; | |
| 258 | + this._updateVolume(); | |
| 259 | + }, | |
| 260 | + mute: function mute() { | |
| 261 | + this._isMuted = true; | |
| 262 | + this._updateVolume(); | |
| 263 | + }, | |
| 264 | + unmute: function unmute() { | |
| 265 | + this._isMuted = false; | |
| 266 | + this._updateVolume(); | |
| 267 | + }, | |
| 268 | + getVolume: function getVolume() { | |
| 269 | + return this._volume; | |
| 270 | + }, | |
| 271 | + _updateVolume: function _updateVolume() { | |
| 272 | + var i; | |
| 273 | + var len = this.audios.length; | |
| 274 | + for (i = 0; i < len; i += 1) this.audios[i].volume(this._volume * (this._isMuted ? 0 : 1)); | |
| 275 | + } | |
| 276 | + }; | |
| 277 | + return function() { | |
| 278 | + return new AudioController(); | |
| 279 | + }; | |
| 280 | + }(); | |
| 281 | + var createTypedArray = function() { | |
| 282 | + function createRegularArray(type, len) { | |
| 283 | + var i = 0; | |
| 284 | + var arr = []; | |
| 285 | + var value; | |
| 286 | + switch (type) { | |
| 287 | + case "int16": | |
| 288 | + case "uint8c": | |
| 289 | + value = 1; | |
| 290 | + break; | |
| 291 | + default: | |
| 292 | + value = 1.1; | |
| 293 | + break; | |
| 294 | + } | |
| 295 | + for (i = 0; i < len; i += 1) arr.push(value); | |
| 296 | + return arr; | |
| 297 | + } | |
| 298 | + function createTypedArrayFactory(type, len) { | |
| 299 | + if (type === "float32") return new Float32Array(len); | |
| 300 | + if (type === "int16") return new Int16Array(len); | |
| 301 | + if (type === "uint8c") return new Uint8ClampedArray(len); | |
| 302 | + return createRegularArray(type, len); | |
| 303 | + } | |
| 304 | + if (typeof Uint8ClampedArray === "function" && typeof Float32Array === "function") return createTypedArrayFactory; | |
| 305 | + return createRegularArray; | |
| 306 | + }(); | |
| 307 | + function createSizedArray(len) { | |
| 308 | + return Array.apply(null, { length: len }); | |
| 309 | + } | |
| 310 | + function _typeof$6(o) { | |
| 311 | + "@babel/helpers - typeof"; | |
| 312 | + return _typeof$6 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o) { | |
| 313 | + return typeof o; | |
| 314 | + } : function(o) { | |
| 315 | + return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; | |
| 316 | + }, _typeof$6(o); | |
| 317 | + } | |
| 318 | + var subframeEnabled = true; | |
| 319 | + var expressionsPlugin = null; | |
| 320 | + var expressionsInterfaces = null; | |
| 321 | + var idPrefix$1 = ""; | |
| 322 | + var isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent); | |
| 323 | + var _shouldRoundValues = false; | |
| 324 | + var bmPow = Math.pow; | |
| 325 | + var bmSqrt = Math.sqrt; | |
| 326 | + var bmFloor = Math.floor; | |
| 327 | + var bmMax = Math.max; | |
| 328 | + var bmMin = Math.min; | |
| 329 | + var BMMath = {}; | |
| 330 | + (function() { | |
| 331 | + var propertyNames = [ | |
| 332 | + "abs", | |
| 333 | + "acos", | |
| 334 | + "acosh", | |
| 335 | + "asin", | |
| 336 | + "asinh", | |
| 337 | + "atan", | |
| 338 | + "atanh", | |
| 339 | + "atan2", | |
| 340 | + "ceil", | |
| 341 | + "cbrt", | |
| 342 | + "expm1", | |
| 343 | + "clz32", | |
| 344 | + "cos", | |
| 345 | + "cosh", | |
| 346 | + "exp", | |
| 347 | + "floor", | |
| 348 | + "fround", | |
| 349 | + "hypot", | |
| 350 | + "imul", | |
| 351 | + "log", | |
| 352 | + "log1p", | |
| 353 | + "log2", | |
| 354 | + "log10", | |
| 355 | + "max", | |
| 356 | + "min", | |
| 357 | + "pow", | |
| 358 | + "random", | |
| 359 | + "round", | |
| 360 | + "sign", | |
| 361 | + "sin", | |
| 362 | + "sinh", | |
| 363 | + "sqrt", | |
| 364 | + "tan", | |
| 365 | + "tanh", | |
| 366 | + "trunc", | |
| 367 | + "E", | |
| 368 | + "LN10", | |
| 369 | + "LN2", | |
| 370 | + "LOG10E", | |
| 371 | + "LOG2E", | |
| 372 | + "PI", | |
| 373 | + "SQRT1_2", | |
| 374 | + "SQRT2" | |
| 375 | + ]; | |
| 376 | + var i; | |
| 377 | + var len = propertyNames.length; | |
| 378 | + for (i = 0; i < len; i += 1) BMMath[propertyNames[i]] = Math[propertyNames[i]]; | |
| 379 | + })(); | |
| 380 | + function ProjectInterface$1() { | |
| 381 | + return {}; | |
| 382 | + } | |
| 383 | + BMMath.random = Math.random; | |
| 384 | + BMMath.abs = function(val) { | |
| 385 | + if (_typeof$6(val) === "object" && val.length) { | |
| 386 | + var absArr = createSizedArray(val.length); | |
| 387 | + var i; | |
| 388 | + var len = val.length; | |
| 389 | + for (i = 0; i < len; i += 1) absArr[i] = Math.abs(val[i]); | |
| 390 | + return absArr; | |
| 391 | + } | |
| 392 | + return Math.abs(val); | |
| 393 | + }; | |
| 394 | + var defaultCurveSegments = 150; | |
| 395 | + var degToRads = Math.PI / 180; | |
| 396 | + var roundCorner = .5519; | |
| 397 | + function roundValues(flag) { | |
| 398 | + _shouldRoundValues = !!flag; | |
| 399 | + } | |
| 400 | + function bmRnd(value) { | |
| 401 | + if (_shouldRoundValues) return Math.round(value); | |
| 402 | + return value; | |
| 403 | + } | |
| 404 | + function styleDiv(element) { | |
| 405 | + element.style.position = "absolute"; | |
| 406 | + element.style.top = 0; | |
| 407 | + element.style.left = 0; | |
| 408 | + element.style.display = "block"; | |
| 409 | + element.style.transformOrigin = "0 0"; | |
| 410 | + element.style.webkitTransformOrigin = "0 0"; | |
| 411 | + element.style.backfaceVisibility = "visible"; | |
| 412 | + element.style.webkitBackfaceVisibility = "visible"; | |
| 413 | + element.style.transformStyle = "preserve-3d"; | |
| 414 | + element.style.webkitTransformStyle = "preserve-3d"; | |
| 415 | + element.style.mozTransformStyle = "preserve-3d"; | |
| 416 | + } | |
| 417 | + function BMEnterFrameEvent(type, currentTime, totalTime, frameMultiplier) { | |
| 418 | + this.type = type; | |
| 419 | + this.currentTime = currentTime; | |
| 420 | + this.totalTime = totalTime; | |
| 421 | + this.direction = frameMultiplier < 0 ? -1 : 1; | |
| 422 | + } | |
| 423 | + function BMCompleteEvent(type, frameMultiplier) { | |
| 424 | + this.type = type; | |
| 425 | + this.direction = frameMultiplier < 0 ? -1 : 1; | |
| 426 | + } | |
| 427 | + function BMCompleteLoopEvent(type, totalLoops, currentLoop, frameMultiplier) { | |
| 428 | + this.type = type; | |
| 429 | + this.currentLoop = currentLoop; | |
| 430 | + this.totalLoops = totalLoops; | |
| 431 | + this.direction = frameMultiplier < 0 ? -1 : 1; | |
| 432 | + } | |
| 433 | + function BMSegmentStartEvent(type, firstFrame, totalFrames) { | |
| 434 | + this.type = type; | |
| 435 | + this.firstFrame = firstFrame; | |
| 436 | + this.totalFrames = totalFrames; | |
| 437 | + } | |
| 438 | + function BMDestroyEvent(type, target) { | |
| 439 | + this.type = type; | |
| 440 | + this.target = target; | |
| 441 | + } | |
| 442 | + function BMRenderFrameErrorEvent(nativeError, currentTime) { | |
| 443 | + this.type = "renderFrameError"; | |
| 444 | + this.nativeError = nativeError; | |
| 445 | + this.currentTime = currentTime; | |
| 446 | + } | |
| 447 | + function BMConfigErrorEvent(nativeError) { | |
| 448 | + this.type = "configError"; | |
| 449 | + this.nativeError = nativeError; | |
| 450 | + } | |
| 451 | + function BMAnimationConfigErrorEvent(type, nativeError) { | |
| 452 | + this.type = type; | |
| 453 | + this.nativeError = nativeError; | |
| 454 | + } | |
| 455 | + var createElementID = function() { | |
| 456 | + var _count = 0; | |
| 457 | + return function createID() { | |
| 458 | + _count += 1; | |
| 459 | + return idPrefix$1 + "__lottie_element_" + _count; | |
| 460 | + }; | |
| 461 | + }(); | |
| 462 | + function HSVtoRGB(h, s, v) { | |
| 463 | + var r; | |
| 464 | + var g; | |
| 465 | + var b; | |
| 466 | + var i; | |
| 467 | + var f; | |
| 468 | + var p; | |
| 469 | + var q; | |
| 470 | + var t; | |
| 471 | + i = Math.floor(h * 6); | |
| 472 | + f = h * 6 - i; | |
| 473 | + p = v * (1 - s); | |
| 474 | + q = v * (1 - f * s); | |
| 475 | + t = v * (1 - (1 - f) * s); | |
| 476 | + switch (i % 6) { | |
| 477 | + case 0: | |
| 478 | + r = v; | |
| 479 | + g = t; | |
| 480 | + b = p; | |
| 481 | + break; | |
| 482 | + case 1: | |
| 483 | + r = q; | |
| 484 | + g = v; | |
| 485 | + b = p; | |
| 486 | + break; | |
| 487 | + case 2: | |
| 488 | + r = p; | |
| 489 | + g = v; | |
| 490 | + b = t; | |
| 491 | + break; | |
| 492 | + case 3: | |
| 493 | + r = p; | |
| 494 | + g = q; | |
| 495 | + b = v; | |
| 496 | + break; | |
| 497 | + case 4: | |
| 498 | + r = t; | |
| 499 | + g = p; | |
| 500 | + b = v; | |
| 501 | + break; | |
| 502 | + case 5: | |
| 503 | + r = v; | |
| 504 | + g = p; | |
| 505 | + b = q; | |
| 506 | + break; | |
| 507 | + default: break; | |
| 508 | + } | |
| 509 | + return [ | |
| 510 | + r, | |
| 511 | + g, | |
| 512 | + b | |
| 513 | + ]; | |
| 514 | + } | |
| 515 | + function RGBtoHSV(r, g, b) { | |
| 516 | + var max = Math.max(r, g, b); | |
| 517 | + var min = Math.min(r, g, b); | |
| 518 | + var d = max - min; | |
| 519 | + var h; | |
| 520 | + var s = max === 0 ? 0 : d / max; | |
| 521 | + var v = max / 255; | |
| 522 | + switch (max) { | |
| 523 | + case min: | |
| 524 | + h = 0; | |
| 525 | + break; | |
| 526 | + case r: | |
| 527 | + h = g - b + d * (g < b ? 6 : 0); | |
| 528 | + h /= 6 * d; | |
| 529 | + break; | |
| 530 | + case g: | |
| 531 | + h = b - r + d * 2; | |
| 532 | + h /= 6 * d; | |
| 533 | + break; | |
| 534 | + case b: | |
| 535 | + h = r - g + d * 4; | |
| 536 | + h /= 6 * d; | |
| 537 | + break; | |
| 538 | + default: break; | |
| 539 | + } | |
| 540 | + return [ | |
| 541 | + h, | |
| 542 | + s, | |
| 543 | + v | |
| 544 | + ]; | |
| 545 | + } | |
| 546 | + function addSaturationToRGB(color, offset) { | |
| 547 | + var hsv = RGBtoHSV(color[0] * 255, color[1] * 255, color[2] * 255); | |
| 548 | + hsv[1] += offset; | |
| 549 | + if (hsv[1] > 1) hsv[1] = 1; | |
| 550 | + else if (hsv[1] <= 0) hsv[1] = 0; | |
| 551 | + return HSVtoRGB(hsv[0], hsv[1], hsv[2]); | |
| 552 | + } | |
| 553 | + function addBrightnessToRGB(color, offset) { | |
| 554 | + var hsv = RGBtoHSV(color[0] * 255, color[1] * 255, color[2] * 255); | |
| 555 | + hsv[2] += offset; | |
| 556 | + if (hsv[2] > 1) hsv[2] = 1; | |
| 557 | + else if (hsv[2] < 0) hsv[2] = 0; | |
| 558 | + return HSVtoRGB(hsv[0], hsv[1], hsv[2]); | |
| 559 | + } | |
| 560 | + function addHueToRGB(color, offset) { | |
| 561 | + var hsv = RGBtoHSV(color[0] * 255, color[1] * 255, color[2] * 255); | |
| 562 | + hsv[0] += offset / 360; | |
| 563 | + if (hsv[0] > 1) hsv[0] -= 1; | |
| 564 | + else if (hsv[0] < 0) hsv[0] += 1; | |
| 565 | + return HSVtoRGB(hsv[0], hsv[1], hsv[2]); | |
| 566 | + } | |
| 567 | + var rgbToHex = function() { | |
| 568 | + var colorMap = []; | |
| 569 | + var i; | |
| 570 | + var hex; | |
| 571 | + for (i = 0; i < 256; i += 1) { | |
| 572 | + hex = i.toString(16); | |
| 573 | + colorMap[i] = hex.length === 1 ? "0" + hex : hex; | |
| 574 | + } | |
| 575 | + return function(r, g, b) { | |
| 576 | + if (r < 0) r = 0; | |
| 577 | + if (g < 0) g = 0; | |
| 578 | + if (b < 0) b = 0; | |
| 579 | + return "#" + colorMap[r] + colorMap[g] + colorMap[b]; | |
| 580 | + }; | |
| 581 | + }(); | |
| 582 | + var setSubframeEnabled = function setSubframeEnabled(flag) { | |
| 583 | + subframeEnabled = !!flag; | |
| 584 | + }; | |
| 585 | + var getSubframeEnabled = function getSubframeEnabled() { | |
| 586 | + return subframeEnabled; | |
| 587 | + }; | |
| 588 | + var setExpressionsPlugin = function setExpressionsPlugin(value) { | |
| 589 | + expressionsPlugin = value; | |
| 590 | + }; | |
| 591 | + var getExpressionsPlugin = function getExpressionsPlugin() { | |
| 592 | + return expressionsPlugin; | |
| 593 | + }; | |
| 594 | + var setExpressionInterfaces = function setExpressionInterfaces(value) { | |
| 595 | + expressionsInterfaces = value; | |
| 596 | + }; | |
| 597 | + var getExpressionInterfaces = function getExpressionInterfaces() { | |
| 598 | + return expressionsInterfaces; | |
| 599 | + }; | |
| 600 | + var setDefaultCurveSegments = function setDefaultCurveSegments(value) { | |
| 601 | + defaultCurveSegments = value; | |
| 602 | + }; | |
| 603 | + var getDefaultCurveSegments = function getDefaultCurveSegments() { | |
| 604 | + return defaultCurveSegments; | |
| 605 | + }; | |
| 606 | + var setIdPrefix = function setIdPrefix(value) { | |
| 607 | + idPrefix$1 = value; | |
| 608 | + }; | |
| 609 | + var getIdPrefix = function getIdPrefix() { | |
| 610 | + return idPrefix$1; | |
| 611 | + }; | |
| 612 | + function createNS(type) { | |
| 613 | + return document.createElementNS(svgNS, type); | |
| 614 | + } | |
| 615 | + function _typeof$5(o) { | |
| 616 | + "@babel/helpers - typeof"; | |
| 617 | + return _typeof$5 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o) { | |
| 618 | + return typeof o; | |
| 619 | + } : function(o) { | |
| 620 | + return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; | |
| 621 | + }, _typeof$5(o); | |
| 622 | + } | |
| 623 | + var dataManager = function() { | |
| 624 | + var _counterId = 1; | |
| 625 | + var processes = []; | |
| 626 | + var workerFn; | |
| 627 | + var workerInstance; | |
| 628 | + var workerProxy = { | |
| 629 | + onmessage: function onmessage() {}, | |
| 630 | + postMessage: function postMessage(path) { | |
| 631 | + workerFn({ data: path }); | |
| 632 | + } | |
| 633 | + }; | |
| 634 | + var _workerSelf = { postMessage: function postMessage(data) { | |
| 635 | + workerProxy.onmessage({ data }); | |
| 636 | + } }; | |
| 637 | + function createWorker(fn) { | |
| 638 | + if (window.Worker && window.Blob && getWebWorker()) { | |
| 639 | + var blob = new Blob(["var _workerSelf = self; self.onmessage = ", fn.toString()], { type: "text/javascript" }); | |
| 640 | + var url = URL.createObjectURL(blob); | |
| 641 | + return new Worker(url); | |
| 642 | + } | |
| 643 | + workerFn = fn; | |
| 644 | + return workerProxy; | |
| 645 | + } | |
| 646 | + function setupWorker() { | |
| 647 | + if (!workerInstance) { | |
| 648 | + workerInstance = createWorker(function workerStart(e) { | |
| 649 | + function dataFunctionManager() { | |
| 650 | + function completeLayers(layers, comps) { | |
| 651 | + var layerData; | |
| 652 | + var i; | |
| 653 | + var len = layers.length; | |
| 654 | + var j; | |
| 655 | + var jLen; | |
| 656 | + var k; | |
| 657 | + var kLen; | |
| 658 | + for (i = 0; i < len; i += 1) { | |
| 659 | + layerData = layers[i]; | |
| 660 | + if ("ks" in layerData && !layerData.completed) { | |
| 661 | + layerData.completed = true; | |
| 662 | + if (layerData.hasMask) { | |
| 663 | + var maskProps = layerData.masksProperties; | |
| 664 | + jLen = maskProps.length; | |
| 665 | + for (j = 0; j < jLen; j += 1) if (maskProps[j].pt.k.i) convertPathsToAbsoluteValues(maskProps[j].pt.k); | |
| 666 | + else { | |
| 667 | + kLen = maskProps[j].pt.k.length; | |
| 668 | + for (k = 0; k < kLen; k += 1) { | |
| 669 | + if (maskProps[j].pt.k[k].s) convertPathsToAbsoluteValues(maskProps[j].pt.k[k].s[0]); | |
| 670 | + if (maskProps[j].pt.k[k].e) convertPathsToAbsoluteValues(maskProps[j].pt.k[k].e[0]); | |
| 671 | + } | |
| 672 | + } | |
| 673 | + } | |
| 674 | + if (layerData.ty === 0) { | |
| 675 | + layerData.layers = findCompLayers(layerData.refId, comps); | |
| 676 | + completeLayers(layerData.layers, comps); | |
| 677 | + } else if (layerData.ty === 4) completeShapes(layerData.shapes); | |
| 678 | + else if (layerData.ty === 5) completeText(layerData); | |
| 679 | + } | |
| 680 | + } | |
| 681 | + } | |
| 682 | + function completeChars(chars, assets) { | |
| 683 | + if (chars) { | |
| 684 | + var i = 0; | |
| 685 | + var len = chars.length; | |
| 686 | + for (i = 0; i < len; i += 1) if (chars[i].t === 1) { | |
| 687 | + chars[i].data.layers = findCompLayers(chars[i].data.refId, assets); | |
| 688 | + completeLayers(chars[i].data.layers, assets); | |
| 689 | + } | |
| 690 | + } | |
| 691 | + } | |
| 692 | + function findComp(id, comps) { | |
| 693 | + var i = 0; | |
| 694 | + var len = comps.length; | |
| 695 | + while (i < len) { | |
| 696 | + if (comps[i].id === id) return comps[i]; | |
| 697 | + i += 1; | |
| 698 | + } | |
| 699 | + return null; | |
| 700 | + } | |
| 701 | + function findCompLayers(id, comps) { | |
| 702 | + var comp = findComp(id, comps); | |
| 703 | + if (comp) { | |
| 704 | + if (!comp.layers.__used) { | |
| 705 | + comp.layers.__used = true; | |
| 706 | + return comp.layers; | |
| 707 | + } | |
| 708 | + return JSON.parse(JSON.stringify(comp.layers)); | |
| 709 | + } | |
| 710 | + return null; | |
| 711 | + } | |
| 712 | + function completeShapes(arr) { | |
| 713 | + var i; | |
| 714 | + var len = arr.length; | |
| 715 | + var j; | |
| 716 | + var jLen; | |
| 717 | + for (i = len - 1; i >= 0; i -= 1) if (arr[i].ty === "sh") if (arr[i].ks.k.i) convertPathsToAbsoluteValues(arr[i].ks.k); | |
| 718 | + else { | |
| 719 | + jLen = arr[i].ks.k.length; | |
| 720 | + for (j = 0; j < jLen; j += 1) { | |
| 721 | + if (arr[i].ks.k[j].s) convertPathsToAbsoluteValues(arr[i].ks.k[j].s[0]); | |
| 722 | + if (arr[i].ks.k[j].e) convertPathsToAbsoluteValues(arr[i].ks.k[j].e[0]); | |
| 723 | + } | |
| 724 | + } | |
| 725 | + else if (arr[i].ty === "gr") completeShapes(arr[i].it); | |
| 726 | + } | |
| 727 | + function convertPathsToAbsoluteValues(path) { | |
| 728 | + var i; | |
| 729 | + var len = path.i.length; | |
| 730 | + for (i = 0; i < len; i += 1) { | |
| 731 | + path.i[i][0] += path.v[i][0]; | |
| 732 | + path.i[i][1] += path.v[i][1]; | |
| 733 | + path.o[i][0] += path.v[i][0]; | |
| 734 | + path.o[i][1] += path.v[i][1]; | |
| 735 | + } | |
| 736 | + } | |
| 737 | + function checkVersion(minimum, animVersionString) { | |
| 738 | + var animVersion = animVersionString ? animVersionString.split(".") : [ | |
| 739 | + 100, | |
| 740 | + 100, | |
| 741 | + 100 | |
| 742 | + ]; | |
| 743 | + if (minimum[0] > animVersion[0]) return true; | |
| 744 | + if (animVersion[0] > minimum[0]) return false; | |
| 745 | + if (minimum[1] > animVersion[1]) return true; | |
| 746 | + if (animVersion[1] > minimum[1]) return false; | |
| 747 | + if (minimum[2] > animVersion[2]) return true; | |
| 748 | + if (animVersion[2] > minimum[2]) return false; | |
| 749 | + return null; | |
| 750 | + } | |
| 751 | + var checkText = function() { | |
| 752 | + var minimumVersion = [ | |
| 753 | + 4, | |
| 754 | + 4, | |
| 755 | + 14 | |
| 756 | + ]; | |
| 757 | + function updateTextLayer(textLayer) { | |
| 758 | + var documentData = textLayer.t.d; | |
| 759 | + textLayer.t.d = { k: [{ | |
| 760 | + s: documentData, | |
| 761 | + t: 0 | |
| 762 | + }] }; | |
| 763 | + } | |
| 764 | + function iterateLayers(layers) { | |
| 765 | + var i; | |
| 766 | + var len = layers.length; | |
| 767 | + for (i = 0; i < len; i += 1) if (layers[i].ty === 5) updateTextLayer(layers[i]); | |
| 768 | + } | |
| 769 | + return function(animationData) { | |
| 770 | + if (checkVersion(minimumVersion, animationData.v)) { | |
| 771 | + iterateLayers(animationData.layers); | |
| 772 | + if (animationData.assets) { | |
| 773 | + var i; | |
| 774 | + var len = animationData.assets.length; | |
| 775 | + for (i = 0; i < len; i += 1) if (animationData.assets[i].layers) iterateLayers(animationData.assets[i].layers); | |
| 776 | + } | |
| 777 | + } | |
| 778 | + }; | |
| 779 | + }(); | |
| 780 | + var checkChars = function() { | |
| 781 | + var minimumVersion = [ | |
| 782 | + 4, | |
| 783 | + 7, | |
| 784 | + 99 | |
| 785 | + ]; | |
| 786 | + return function(animationData) { | |
| 787 | + if (animationData.chars && !checkVersion(minimumVersion, animationData.v)) { | |
| 788 | + var i; | |
| 789 | + var len = animationData.chars.length; | |
| 790 | + for (i = 0; i < len; i += 1) { | |
| 791 | + var charData = animationData.chars[i]; | |
| 792 | + if (charData.data && charData.data.shapes) { | |
| 793 | + completeShapes(charData.data.shapes); | |
| 794 | + charData.data.ip = 0; | |
| 795 | + charData.data.op = 99999; | |
| 796 | + charData.data.st = 0; | |
| 797 | + charData.data.sr = 1; | |
| 798 | + charData.data.ks = { | |
| 799 | + p: { | |
| 800 | + k: [0, 0], | |
| 801 | + a: 0 | |
| 802 | + }, | |
| 803 | + s: { | |
| 804 | + k: [100, 100], | |
| 805 | + a: 0 | |
| 806 | + }, | |
| 807 | + a: { | |
| 808 | + k: [0, 0], | |
| 809 | + a: 0 | |
| 810 | + }, | |
| 811 | + r: { | |
| 812 | + k: 0, | |
| 813 | + a: 0 | |
| 814 | + }, | |
| 815 | + o: { | |
| 816 | + k: 100, | |
| 817 | + a: 0 | |
| 818 | + } | |
| 819 | + }; | |
| 820 | + if (!animationData.chars[i].t) { | |
| 821 | + charData.data.shapes.push({ ty: "no" }); | |
| 822 | + charData.data.shapes[0].it.push({ | |
| 823 | + p: { | |
| 824 | + k: [0, 0], | |
| 825 | + a: 0 | |
| 826 | + }, | |
| 827 | + s: { | |
| 828 | + k: [100, 100], | |
| 829 | + a: 0 | |
| 830 | + }, | |
| 831 | + a: { | |
| 832 | + k: [0, 0], | |
| 833 | + a: 0 | |
| 834 | + }, | |
| 835 | + r: { | |
| 836 | + k: 0, | |
| 837 | + a: 0 | |
| 838 | + }, | |
| 839 | + o: { | |
| 840 | + k: 100, | |
| 841 | + a: 0 | |
| 842 | + }, | |
| 843 | + sk: { | |
| 844 | + k: 0, | |
| 845 | + a: 0 | |
| 846 | + }, | |
| 847 | + sa: { | |
| 848 | + k: 0, | |
| 849 | + a: 0 | |
| 850 | + }, | |
| 851 | + ty: "tr" | |
| 852 | + }); | |
| 853 | + } | |
| 854 | + } | |
| 855 | + } | |
| 856 | + } | |
| 857 | + }; | |
| 858 | + }(); | |
| 859 | + var checkPathProperties = function() { | |
| 860 | + var minimumVersion = [ | |
| 861 | + 5, | |
| 862 | + 7, | |
| 863 | + 15 | |
| 864 | + ]; | |
| 865 | + function updateTextLayer(textLayer) { | |
| 866 | + var pathData = textLayer.t.p; | |
| 867 | + if (typeof pathData.a === "number") pathData.a = { | |
| 868 | + a: 0, | |
| 869 | + k: pathData.a | |
| 870 | + }; | |
| 871 | + if (typeof pathData.p === "number") pathData.p = { | |
| 872 | + a: 0, | |
| 873 | + k: pathData.p | |
| 874 | + }; | |
| 875 | + if (typeof pathData.r === "number") pathData.r = { | |
| 876 | + a: 0, | |
| 877 | + k: pathData.r | |
| 878 | + }; | |
| 879 | + } | |
| 880 | + function iterateLayers(layers) { | |
| 881 | + var i; | |
| 882 | + var len = layers.length; | |
| 883 | + for (i = 0; i < len; i += 1) if (layers[i].ty === 5) updateTextLayer(layers[i]); | |
| 884 | + } | |
| 885 | + return function(animationData) { | |
| 886 | + if (checkVersion(minimumVersion, animationData.v)) { | |
| 887 | + iterateLayers(animationData.layers); | |
| 888 | + if (animationData.assets) { | |
| 889 | + var i; | |
| 890 | + var len = animationData.assets.length; | |
| 891 | + for (i = 0; i < len; i += 1) if (animationData.assets[i].layers) iterateLayers(animationData.assets[i].layers); | |
| 892 | + } | |
| 893 | + } | |
| 894 | + }; | |
| 895 | + }(); | |
| 896 | + var checkColors = function() { | |
| 897 | + var minimumVersion = [ | |
| 898 | + 4, | |
| 899 | + 1, | |
| 900 | + 9 | |
| 901 | + ]; | |
| 902 | + function iterateShapes(shapes) { | |
| 903 | + var i; | |
| 904 | + var len = shapes.length; | |
| 905 | + var j; | |
| 906 | + var jLen; | |
| 907 | + for (i = 0; i < len; i += 1) if (shapes[i].ty === "gr") iterateShapes(shapes[i].it); | |
| 908 | + else if (shapes[i].ty === "fl" || shapes[i].ty === "st") if (shapes[i].c.k && shapes[i].c.k[0].i) { | |
| 909 | + jLen = shapes[i].c.k.length; | |
| 910 | + for (j = 0; j < jLen; j += 1) { | |
| 911 | + if (shapes[i].c.k[j].s) { | |
| 912 | + shapes[i].c.k[j].s[0] /= 255; | |
| 913 | + shapes[i].c.k[j].s[1] /= 255; | |
| 914 | + shapes[i].c.k[j].s[2] /= 255; | |
| 915 | + shapes[i].c.k[j].s[3] /= 255; | |
| 916 | + } | |
| 917 | + if (shapes[i].c.k[j].e) { | |
| 918 | + shapes[i].c.k[j].e[0] /= 255; | |
| 919 | + shapes[i].c.k[j].e[1] /= 255; | |
| 920 | + shapes[i].c.k[j].e[2] /= 255; | |
| 921 | + shapes[i].c.k[j].e[3] /= 255; | |
| 922 | + } | |
| 923 | + } | |
| 924 | + } else { | |
| 925 | + shapes[i].c.k[0] /= 255; | |
| 926 | + shapes[i].c.k[1] /= 255; | |
| 927 | + shapes[i].c.k[2] /= 255; | |
| 928 | + shapes[i].c.k[3] /= 255; | |
| 929 | + } | |
| 930 | + } | |
| 931 | + function iterateLayers(layers) { | |
| 932 | + var i; | |
| 933 | + var len = layers.length; | |
| 934 | + for (i = 0; i < len; i += 1) if (layers[i].ty === 4) iterateShapes(layers[i].shapes); | |
| 935 | + } | |
| 936 | + return function(animationData) { | |
| 937 | + if (checkVersion(minimumVersion, animationData.v)) { | |
| 938 | + iterateLayers(animationData.layers); | |
| 939 | + if (animationData.assets) { | |
| 940 | + var i; | |
| 941 | + var len = animationData.assets.length; | |
| 942 | + for (i = 0; i < len; i += 1) if (animationData.assets[i].layers) iterateLayers(animationData.assets[i].layers); | |
| 943 | + } | |
| 944 | + } | |
| 945 | + }; | |
| 946 | + }(); | |
| 947 | + var checkShapes = function() { | |
| 948 | + var minimumVersion = [ | |
| 949 | + 4, | |
| 950 | + 4, | |
| 951 | + 18 | |
| 952 | + ]; | |
| 953 | + function completeClosingShapes(arr) { | |
| 954 | + var i; | |
| 955 | + var len = arr.length; | |
| 956 | + var j; | |
| 957 | + var jLen; | |
| 958 | + for (i = len - 1; i >= 0; i -= 1) if (arr[i].ty === "sh") if (arr[i].ks.k.i) arr[i].ks.k.c = arr[i].closed; | |
| 959 | + else { | |
| 960 | + jLen = arr[i].ks.k.length; | |
| 961 | + for (j = 0; j < jLen; j += 1) { | |
| 962 | + if (arr[i].ks.k[j].s) arr[i].ks.k[j].s[0].c = arr[i].closed; | |
| 963 | + if (arr[i].ks.k[j].e) arr[i].ks.k[j].e[0].c = arr[i].closed; | |
| 964 | + } | |
| 965 | + } | |
| 966 | + else if (arr[i].ty === "gr") completeClosingShapes(arr[i].it); | |
| 967 | + } | |
| 968 | + function iterateLayers(layers) { | |
| 969 | + var layerData; | |
| 970 | + var i; | |
| 971 | + var len = layers.length; | |
| 972 | + var j; | |
| 973 | + var jLen; | |
| 974 | + var k; | |
| 975 | + var kLen; | |
| 976 | + for (i = 0; i < len; i += 1) { | |
| 977 | + layerData = layers[i]; | |
| 978 | + if (layerData.hasMask) { | |
| 979 | + var maskProps = layerData.masksProperties; | |
| 980 | + jLen = maskProps.length; | |
| 981 | + for (j = 0; j < jLen; j += 1) if (maskProps[j].pt.k.i) maskProps[j].pt.k.c = maskProps[j].cl; | |
| 982 | + else { | |
| 983 | + kLen = maskProps[j].pt.k.length; | |
| 984 | + for (k = 0; k < kLen; k += 1) { | |
| 985 | + if (maskProps[j].pt.k[k].s) maskProps[j].pt.k[k].s[0].c = maskProps[j].cl; | |
| 986 | + if (maskProps[j].pt.k[k].e) maskProps[j].pt.k[k].e[0].c = maskProps[j].cl; | |
| 987 | + } | |
| 988 | + } | |
| 989 | + } | |
| 990 | + if (layerData.ty === 4) completeClosingShapes(layerData.shapes); | |
| 991 | + } | |
| 992 | + } | |
| 993 | + return function(animationData) { | |
| 994 | + if (checkVersion(minimumVersion, animationData.v)) { | |
| 995 | + iterateLayers(animationData.layers); | |
| 996 | + if (animationData.assets) { | |
| 997 | + var i; | |
| 998 | + var len = animationData.assets.length; | |
| 999 | + for (i = 0; i < len; i += 1) if (animationData.assets[i].layers) iterateLayers(animationData.assets[i].layers); | |
| 1000 | + } | |
| 1001 | + } | |
| 1002 | + }; | |
| 1003 | + }(); | |
| 1004 | + function completeData(animationData) { | |
| 1005 | + if (animationData.__complete) return; | |
| 1006 | + checkColors(animationData); | |
| 1007 | + checkText(animationData); | |
| 1008 | + checkChars(animationData); | |
| 1009 | + checkPathProperties(animationData); | |
| 1010 | + checkShapes(animationData); | |
| 1011 | + completeLayers(animationData.layers, animationData.assets); | |
| 1012 | + completeChars(animationData.chars, animationData.assets); | |
| 1013 | + animationData.__complete = true; | |
| 1014 | + } | |
| 1015 | + function completeText(data) { | |
| 1016 | + if (data.t.a.length === 0 && !("m" in data.t.p)) {} | |
| 1017 | + } | |
| 1018 | + var moduleOb = {}; | |
| 1019 | + moduleOb.completeData = completeData; | |
| 1020 | + moduleOb.checkColors = checkColors; | |
| 1021 | + moduleOb.checkChars = checkChars; | |
| 1022 | + moduleOb.checkPathProperties = checkPathProperties; | |
| 1023 | + moduleOb.checkShapes = checkShapes; | |
| 1024 | + moduleOb.completeLayers = completeLayers; | |
| 1025 | + return moduleOb; | |
| 1026 | + } | |
| 1027 | + if (!_workerSelf.dataManager) _workerSelf.dataManager = dataFunctionManager(); | |
| 1028 | + if (!_workerSelf.assetLoader) _workerSelf.assetLoader = function() { | |
| 1029 | + function formatResponse(xhr) { | |
| 1030 | + var contentTypeHeader = xhr.getResponseHeader("content-type"); | |
| 1031 | + if (contentTypeHeader && xhr.responseType === "json" && contentTypeHeader.indexOf("json") !== -1) return xhr.response; | |
| 1032 | + if (xhr.response && _typeof$5(xhr.response) === "object") return xhr.response; | |
| 1033 | + if (xhr.response && typeof xhr.response === "string") return JSON.parse(xhr.response); | |
| 1034 | + if (xhr.responseText) return JSON.parse(xhr.responseText); | |
| 1035 | + return null; | |
| 1036 | + } | |
| 1037 | + function loadAsset(path, fullPath, callback, errorCallback) { | |
| 1038 | + var response; | |
| 1039 | + var xhr = new XMLHttpRequest(); | |
| 1040 | + try { | |
| 1041 | + xhr.responseType = "json"; | |
| 1042 | + } catch (err) {} | |
| 1043 | + xhr.onreadystatechange = function() { | |
| 1044 | + if (xhr.readyState === 4) if (xhr.status === 200) { | |
| 1045 | + response = formatResponse(xhr); | |
| 1046 | + callback(response); | |
| 1047 | + } else try { | |
| 1048 | + response = formatResponse(xhr); | |
| 1049 | + callback(response); | |
| 1050 | + } catch (err) { | |
| 1051 | + if (errorCallback) errorCallback(err); | |
| 1052 | + } | |
| 1053 | + }; | |
| 1054 | + try { | |
| 1055 | + xhr.open([ | |
| 1056 | + "G", | |
| 1057 | + "E", | |
| 1058 | + "T" | |
| 1059 | + ].join(""), path, true); | |
| 1060 | + } catch (error) { | |
| 1061 | + xhr.open([ | |
| 1062 | + "G", | |
| 1063 | + "E", | |
| 1064 | + "T" | |
| 1065 | + ].join(""), fullPath + "/" + path, true); | |
| 1066 | + } | |
| 1067 | + xhr.send(); | |
| 1068 | + } | |
| 1069 | + return { load: loadAsset }; | |
| 1070 | + }(); | |
| 1071 | + if (e.data.type === "loadAnimation") _workerSelf.assetLoader.load(e.data.path, e.data.fullPath, function(data) { | |
| 1072 | + _workerSelf.dataManager.completeData(data); | |
| 1073 | + _workerSelf.postMessage({ | |
| 1074 | + id: e.data.id, | |
| 1075 | + payload: data, | |
| 1076 | + status: "success" | |
| 1077 | + }); | |
| 1078 | + }, function() { | |
| 1079 | + _workerSelf.postMessage({ | |
| 1080 | + id: e.data.id, | |
| 1081 | + status: "error" | |
| 1082 | + }); | |
| 1083 | + }); | |
| 1084 | + else if (e.data.type === "complete") { | |
| 1085 | + var animation = e.data.animation; | |
| 1086 | + _workerSelf.dataManager.completeData(animation); | |
| 1087 | + _workerSelf.postMessage({ | |
| 1088 | + id: e.data.id, | |
| 1089 | + payload: animation, | |
| 1090 | + status: "success" | |
| 1091 | + }); | |
| 1092 | + } else if (e.data.type === "loadData") _workerSelf.assetLoader.load(e.data.path, e.data.fullPath, function(data) { | |
| 1093 | + _workerSelf.postMessage({ | |
| 1094 | + id: e.data.id, | |
| 1095 | + payload: data, | |
| 1096 | + status: "success" | |
| 1097 | + }); | |
| 1098 | + }, function() { | |
| 1099 | + _workerSelf.postMessage({ | |
| 1100 | + id: e.data.id, | |
| 1101 | + status: "error" | |
| 1102 | + }); | |
| 1103 | + }); | |
| 1104 | + }); | |
| 1105 | + workerInstance.onmessage = function(event) { | |
| 1106 | + var data = event.data; | |
| 1107 | + var id = data.id; | |
| 1108 | + var process = processes[id]; | |
| 1109 | + processes[id] = null; | |
| 1110 | + if (data.status === "success") process.onComplete(data.payload); | |
| 1111 | + else if (process.onError) process.onError(); | |
| 1112 | + }; | |
| 1113 | + } | |
| 1114 | + } | |
| 1115 | + function createProcess(onComplete, onError) { | |
| 1116 | + _counterId += 1; | |
| 1117 | + var id = "processId_" + _counterId; | |
| 1118 | + processes[id] = { | |
| 1119 | + onComplete, | |
| 1120 | + onError | |
| 1121 | + }; | |
| 1122 | + return id; | |
| 1123 | + } | |
| 1124 | + function loadAnimation(path, onComplete, onError) { | |
| 1125 | + setupWorker(); | |
| 1126 | + var processId = createProcess(onComplete, onError); | |
| 1127 | + workerInstance.postMessage({ | |
| 1128 | + type: "loadAnimation", | |
| 1129 | + path, | |
| 1130 | + fullPath: window.location.origin + window.location.pathname, | |
| 1131 | + id: processId | |
| 1132 | + }); | |
| 1133 | + } | |
| 1134 | + function loadData(path, onComplete, onError) { | |
| 1135 | + setupWorker(); | |
| 1136 | + var processId = createProcess(onComplete, onError); | |
| 1137 | + workerInstance.postMessage({ | |
| 1138 | + type: "loadData", | |
| 1139 | + path, | |
| 1140 | + fullPath: window.location.origin + window.location.pathname, | |
| 1141 | + id: processId | |
| 1142 | + }); | |
| 1143 | + } | |
| 1144 | + function completeAnimation(anim, onComplete, onError) { | |
| 1145 | + setupWorker(); | |
| 1146 | + var processId = createProcess(onComplete, onError); | |
| 1147 | + workerInstance.postMessage({ | |
| 1148 | + type: "complete", | |
| 1149 | + animation: anim, | |
| 1150 | + id: processId | |
| 1151 | + }); | |
| 1152 | + } | |
| 1153 | + return { | |
| 1154 | + loadAnimation, | |
| 1155 | + loadData, | |
| 1156 | + completeAnimation | |
| 1157 | + }; | |
| 1158 | + }(); | |
| 1159 | + var ImagePreloader = function() { | |
| 1160 | + var proxyImage = function() { | |
| 1161 | + var canvas = createTag("canvas"); | |
| 1162 | + canvas.width = 1; | |
| 1163 | + canvas.height = 1; | |
| 1164 | + var ctx = canvas.getContext("2d"); | |
| 1165 | + ctx.fillStyle = "rgba(0,0,0,0)"; | |
| 1166 | + ctx.fillRect(0, 0, 1, 1); | |
| 1167 | + return canvas; | |
| 1168 | + }(); | |
| 1169 | + function imageLoaded() { | |
| 1170 | + this.loadedAssets += 1; | |
| 1171 | + if (this.loadedAssets === this.totalImages && this.loadedFootagesCount === this.totalFootages) { | |
| 1172 | + if (this.imagesLoadedCb) this.imagesLoadedCb(null); | |
| 1173 | + } | |
| 1174 | + } | |
| 1175 | + function footageLoaded() { | |
| 1176 | + this.loadedFootagesCount += 1; | |
| 1177 | + if (this.loadedAssets === this.totalImages && this.loadedFootagesCount === this.totalFootages) { | |
| 1178 | + if (this.imagesLoadedCb) this.imagesLoadedCb(null); | |
| 1179 | + } | |
| 1180 | + } | |
| 1181 | + function getAssetsPath(assetData, assetsPath, originalPath) { | |
| 1182 | + var path = ""; | |
| 1183 | + if (assetData.e) path = assetData.p; | |
| 1184 | + else if (assetsPath) { | |
| 1185 | + var imagePath = assetData.p; | |
| 1186 | + if (imagePath.indexOf("images/") !== -1) imagePath = imagePath.split("/")[1]; | |
| 1187 | + path = assetsPath + imagePath; | |
| 1188 | + } else { | |
| 1189 | + path = originalPath; | |
| 1190 | + path += assetData.u ? assetData.u : ""; | |
| 1191 | + path += assetData.p; | |
| 1192 | + } | |
| 1193 | + return path; | |
| 1194 | + } | |
| 1195 | + function testImageLoaded(img) { | |
| 1196 | + var _count = 0; | |
| 1197 | + var intervalId = setInterval(function() { | |
| 1198 | + if (img.getBBox().width || _count > 500) { | |
| 1199 | + this._imageLoaded(); | |
| 1200 | + clearInterval(intervalId); | |
| 1201 | + } | |
| 1202 | + _count += 1; | |
| 1203 | + }.bind(this), 50); | |
| 1204 | + } | |
| 1205 | + function createImageData(assetData) { | |
| 1206 | + var path = getAssetsPath(assetData, this.assetsPath, this.path); | |
| 1207 | + var img = createNS("image"); | |
| 1208 | + if (isSafari) this.testImageLoaded(img); | |
| 1209 | + else img.addEventListener("load", this._imageLoaded, false); | |
| 1210 | + img.addEventListener("error", function() { | |
| 1211 | + ob.img = proxyImage; | |
| 1212 | + this._imageLoaded(); | |
| 1213 | + }.bind(this), false); | |
| 1214 | + img.setAttributeNS("http://www.w3.org/1999/xlink", "href", path); | |
| 1215 | + if (this._elementHelper.append) this._elementHelper.append(img); | |
| 1216 | + else this._elementHelper.appendChild(img); | |
| 1217 | + var ob = { | |
| 1218 | + img, | |
| 1219 | + assetData | |
| 1220 | + }; | |
| 1221 | + return ob; | |
| 1222 | + } | |
| 1223 | + function createImgData(assetData) { | |
| 1224 | + var path = getAssetsPath(assetData, this.assetsPath, this.path); | |
| 1225 | + var img = createTag("img"); | |
| 1226 | + img.crossOrigin = "anonymous"; | |
| 1227 | + img.addEventListener("load", this._imageLoaded, false); | |
| 1228 | + img.addEventListener("error", function() { | |
| 1229 | + ob.img = proxyImage; | |
| 1230 | + this._imageLoaded(); | |
| 1231 | + }.bind(this), false); | |
| 1232 | + img.src = path; | |
| 1233 | + var ob = { | |
| 1234 | + img, | |
| 1235 | + assetData | |
| 1236 | + }; | |
| 1237 | + return ob; | |
| 1238 | + } | |
| 1239 | + function createFootageData(data) { | |
| 1240 | + var ob = { assetData: data }; | |
| 1241 | + var path = getAssetsPath(data, this.assetsPath, this.path); | |
| 1242 | + dataManager.loadData(path, function(footageData) { | |
| 1243 | + ob.img = footageData; | |
| 1244 | + this._footageLoaded(); | |
| 1245 | + }.bind(this), function() { | |
| 1246 | + ob.img = {}; | |
| 1247 | + this._footageLoaded(); | |
| 1248 | + }.bind(this)); | |
| 1249 | + return ob; | |
| 1250 | + } | |
| 1251 | + function loadAssets(assets, cb) { | |
| 1252 | + this.imagesLoadedCb = cb; | |
| 1253 | + var i; | |
| 1254 | + var len = assets.length; | |
| 1255 | + for (i = 0; i < len; i += 1) if (!assets[i].layers) { | |
| 1256 | + if (!assets[i].t || assets[i].t === "seq") { | |
| 1257 | + this.totalImages += 1; | |
| 1258 | + this.images.push(this._createImageData(assets[i])); | |
| 1259 | + } else if (assets[i].t === 3) { | |
| 1260 | + this.totalFootages += 1; | |
| 1261 | + this.images.push(this.createFootageData(assets[i])); | |
| 1262 | + } | |
| 1263 | + } | |
| 1264 | + } | |
| 1265 | + function setPath(path) { | |
| 1266 | + this.path = path || ""; | |
| 1267 | + } | |
| 1268 | + function setAssetsPath(path) { | |
| 1269 | + this.assetsPath = path || ""; | |
| 1270 | + } | |
| 1271 | + function getAsset(assetData) { | |
| 1272 | + var i = 0; | |
| 1273 | + var len = this.images.length; | |
| 1274 | + while (i < len) { | |
| 1275 | + if (this.images[i].assetData === assetData) return this.images[i].img; | |
| 1276 | + i += 1; | |
| 1277 | + } | |
| 1278 | + return null; | |
| 1279 | + } | |
| 1280 | + function destroy() { | |
| 1281 | + this.imagesLoadedCb = null; | |
| 1282 | + this.images.length = 0; | |
| 1283 | + } | |
| 1284 | + function loadedImages() { | |
| 1285 | + return this.totalImages === this.loadedAssets; | |
| 1286 | + } | |
| 1287 | + function loadedFootages() { | |
| 1288 | + return this.totalFootages === this.loadedFootagesCount; | |
| 1289 | + } | |
| 1290 | + function setCacheType(type, elementHelper) { | |
| 1291 | + if (type === "svg") { | |
| 1292 | + this._elementHelper = elementHelper; | |
| 1293 | + this._createImageData = this.createImageData.bind(this); | |
| 1294 | + } else this._createImageData = this.createImgData.bind(this); | |
| 1295 | + } | |
| 1296 | + function ImagePreloaderFactory() { | |
| 1297 | + this._imageLoaded = imageLoaded.bind(this); | |
| 1298 | + this._footageLoaded = footageLoaded.bind(this); | |
| 1299 | + this.testImageLoaded = testImageLoaded.bind(this); | |
| 1300 | + this.createFootageData = createFootageData.bind(this); | |
| 1301 | + this.assetsPath = ""; | |
| 1302 | + this.path = ""; | |
| 1303 | + this.totalImages = 0; | |
| 1304 | + this.totalFootages = 0; | |
| 1305 | + this.loadedAssets = 0; | |
| 1306 | + this.loadedFootagesCount = 0; | |
| 1307 | + this.imagesLoadedCb = null; | |
| 1308 | + this.images = []; | |
| 1309 | + } | |
| 1310 | + ImagePreloaderFactory.prototype = { | |
| 1311 | + loadAssets, | |
| 1312 | + setAssetsPath, | |
| 1313 | + setPath, | |
| 1314 | + loadedImages, | |
| 1315 | + loadedFootages, | |
| 1316 | + destroy, | |
| 1317 | + getAsset, | |
| 1318 | + createImgData, | |
| 1319 | + createImageData, | |
| 1320 | + imageLoaded, | |
| 1321 | + footageLoaded, | |
| 1322 | + setCacheType | |
| 1323 | + }; | |
| 1324 | + return ImagePreloaderFactory; | |
| 1325 | + }(); | |
| 1326 | + function BaseEvent() {} | |
| 1327 | + BaseEvent.prototype = { | |
| 1328 | + triggerEvent: function triggerEvent(eventName, args) { | |
| 1329 | + if (this._cbs[eventName]) { | |
| 1330 | + var callbacks = this._cbs[eventName]; | |
| 1331 | + for (var i = 0; i < callbacks.length; i += 1) callbacks[i](args); | |
| 1332 | + } | |
| 1333 | + }, | |
| 1334 | + addEventListener: function addEventListener(eventName, callback) { | |
| 1335 | + if (!this._cbs[eventName]) this._cbs[eventName] = []; | |
| 1336 | + this._cbs[eventName].push(callback); | |
| 1337 | + return function() { | |
| 1338 | + this.removeEventListener(eventName, callback); | |
| 1339 | + }.bind(this); | |
| 1340 | + }, | |
| 1341 | + removeEventListener: function removeEventListener(eventName, callback) { | |
| 1342 | + if (!callback) this._cbs[eventName] = null; | |
| 1343 | + else if (this._cbs[eventName]) { | |
| 1344 | + var i = 0; | |
| 1345 | + var len = this._cbs[eventName].length; | |
| 1346 | + while (i < len) { | |
| 1347 | + if (this._cbs[eventName][i] === callback) { | |
| 1348 | + this._cbs[eventName].splice(i, 1); | |
| 1349 | + i -= 1; | |
| 1350 | + len -= 1; | |
| 1351 | + } | |
| 1352 | + i += 1; | |
| 1353 | + } | |
| 1354 | + if (!this._cbs[eventName].length) this._cbs[eventName] = null; | |
| 1355 | + } | |
| 1356 | + } | |
| 1357 | + }; | |
| 1358 | + var markerParser = function() { | |
| 1359 | + function parsePayloadLines(payload) { | |
| 1360 | + var lines = payload.split("\r\n"); | |
| 1361 | + var keys = {}; | |
| 1362 | + var line; | |
| 1363 | + var keysCount = 0; | |
| 1364 | + for (var i = 0; i < lines.length; i += 1) { | |
| 1365 | + line = lines[i].split(":"); | |
| 1366 | + if (line.length === 2) { | |
| 1367 | + keys[line[0]] = line[1].trim(); | |
| 1368 | + keysCount += 1; | |
| 1369 | + } | |
| 1370 | + } | |
| 1371 | + if (keysCount === 0) throw new Error(); | |
| 1372 | + return keys; | |
| 1373 | + } | |
| 1374 | + return function(_markers) { | |
| 1375 | + var markers = []; | |
| 1376 | + for (var i = 0; i < _markers.length; i += 1) { | |
| 1377 | + var _marker = _markers[i]; | |
| 1378 | + var markerData = { | |
| 1379 | + time: _marker.tm, | |
| 1380 | + duration: _marker.dr | |
| 1381 | + }; | |
| 1382 | + try { | |
| 1383 | + markerData.payload = JSON.parse(_markers[i].cm); | |
| 1384 | + } catch (_) { | |
| 1385 | + try { | |
| 1386 | + markerData.payload = parsePayloadLines(_markers[i].cm); | |
| 1387 | + } catch (__) { | |
| 1388 | + markerData.payload = { name: _markers[i].cm }; | |
| 1389 | + } | |
| 1390 | + } | |
| 1391 | + markers.push(markerData); | |
| 1392 | + } | |
| 1393 | + return markers; | |
| 1394 | + }; | |
| 1395 | + }(); | |
| 1396 | + var ProjectInterface = function() { | |
| 1397 | + function registerComposition(comp) { | |
| 1398 | + this.compositions.push(comp); | |
| 1399 | + } | |
| 1400 | + return function() { | |
| 1401 | + function _thisProjectFunction(name) { | |
| 1402 | + var i = 0; | |
| 1403 | + var len = this.compositions.length; | |
| 1404 | + while (i < len) { | |
| 1405 | + if (this.compositions[i].data && this.compositions[i].data.nm === name) { | |
| 1406 | + if (this.compositions[i].prepareFrame && this.compositions[i].data.xt) this.compositions[i].prepareFrame(this.currentFrame); | |
| 1407 | + return this.compositions[i].compInterface; | |
| 1408 | + } | |
| 1409 | + i += 1; | |
| 1410 | + } | |
| 1411 | + return null; | |
| 1412 | + } | |
| 1413 | + _thisProjectFunction.compositions = []; | |
| 1414 | + _thisProjectFunction.currentFrame = 0; | |
| 1415 | + _thisProjectFunction.registerComposition = registerComposition; | |
| 1416 | + return _thisProjectFunction; | |
| 1417 | + }; | |
| 1418 | + }(); | |
| 1419 | + var renderers = {}; | |
| 1420 | + var registerRenderer = function registerRenderer(key, value) { | |
| 1421 | + renderers[key] = value; | |
| 1422 | + }; | |
| 1423 | + function getRenderer(key) { | |
| 1424 | + return renderers[key]; | |
| 1425 | + } | |
| 1426 | + function getRegisteredRenderer() { | |
| 1427 | + if (renderers.canvas) return "canvas"; | |
| 1428 | + for (var key in renderers) if (renderers[key]) return key; | |
| 1429 | + return ""; | |
| 1430 | + } | |
| 1431 | + function _typeof$4(o) { | |
| 1432 | + "@babel/helpers - typeof"; | |
| 1433 | + return _typeof$4 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o) { | |
| 1434 | + return typeof o; | |
| 1435 | + } : function(o) { | |
| 1436 | + return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; | |
| 1437 | + }, _typeof$4(o); | |
| 1438 | + } | |
| 1439 | + var AnimationItem = function AnimationItem() { | |
| 1440 | + this._cbs = []; | |
| 1441 | + this.name = ""; | |
| 1442 | + this.path = ""; | |
| 1443 | + this.isLoaded = false; | |
| 1444 | + this.currentFrame = 0; | |
| 1445 | + this.currentRawFrame = 0; | |
| 1446 | + this.firstFrame = 0; | |
| 1447 | + this.totalFrames = 0; | |
| 1448 | + this.frameRate = 0; | |
| 1449 | + this.frameMult = 0; | |
| 1450 | + this.playSpeed = 1; | |
| 1451 | + this.playDirection = 1; | |
| 1452 | + this.playCount = 0; | |
| 1453 | + this.animationData = {}; | |
| 1454 | + this.assets = []; | |
| 1455 | + this.isPaused = true; | |
| 1456 | + this.autoplay = false; | |
| 1457 | + this.loop = true; | |
| 1458 | + this.renderer = null; | |
| 1459 | + this.animationID = createElementID(); | |
| 1460 | + this.assetsPath = ""; | |
| 1461 | + this.timeCompleted = 0; | |
| 1462 | + this.segmentPos = 0; | |
| 1463 | + this.isSubframeEnabled = getSubframeEnabled(); | |
| 1464 | + this.segments = []; | |
| 1465 | + this._idle = true; | |
| 1466 | + this._completedLoop = false; | |
| 1467 | + this.projectInterface = ProjectInterface(); | |
| 1468 | + this.imagePreloader = new ImagePreloader(); | |
| 1469 | + this.audioController = audioControllerFactory(); | |
| 1470 | + this.markers = []; | |
| 1471 | + this.configAnimation = this.configAnimation.bind(this); | |
| 1472 | + this.onSetupError = this.onSetupError.bind(this); | |
| 1473 | + this.onSegmentComplete = this.onSegmentComplete.bind(this); | |
| 1474 | + this.drawnFrameEvent = new BMEnterFrameEvent("drawnFrame", 0, 0, 0); | |
| 1475 | + this.expressionsPlugin = getExpressionsPlugin(); | |
| 1476 | + }; | |
| 1477 | + extendPrototype([BaseEvent], AnimationItem); | |
| 1478 | + AnimationItem.prototype.setParams = function(params) { | |
| 1479 | + if (params.wrapper || params.container) this.wrapper = params.wrapper || params.container; | |
| 1480 | + var animType = "svg"; | |
| 1481 | + if (params.animType) animType = params.animType; | |
| 1482 | + else if (params.renderer) animType = params.renderer; | |
| 1483 | + var RendererClass = getRenderer(animType); | |
| 1484 | + this.renderer = new RendererClass(this, params.rendererSettings); | |
| 1485 | + this.imagePreloader.setCacheType(animType, this.renderer.globalData.defs); | |
| 1486 | + this.renderer.setProjectInterface(this.projectInterface); | |
| 1487 | + this.animType = animType; | |
| 1488 | + if (params.loop === "" || params.loop === null || params.loop === void 0 || params.loop === true) this.loop = true; | |
| 1489 | + else if (params.loop === false) this.loop = false; | |
| 1490 | + else this.loop = parseInt(params.loop, 10); | |
| 1491 | + this.autoplay = "autoplay" in params ? params.autoplay : true; | |
| 1492 | + this.name = params.name ? params.name : ""; | |
| 1493 | + this.autoloadSegments = Object.prototype.hasOwnProperty.call(params, "autoloadSegments") ? params.autoloadSegments : true; | |
| 1494 | + this.assetsPath = params.assetsPath; | |
| 1495 | + this.initialSegment = params.initialSegment; | |
| 1496 | + if (params.audioFactory) this.audioController.setAudioFactory(params.audioFactory); | |
| 1497 | + if (params.animationData) this.setupAnimation(params.animationData); | |
| 1498 | + else if (params.path) { | |
| 1499 | + if (params.path.lastIndexOf("\\") !== -1) this.path = params.path.substr(0, params.path.lastIndexOf("\\") + 1); | |
| 1500 | + else this.path = params.path.substr(0, params.path.lastIndexOf("/") + 1); | |
| 1501 | + this.fileName = params.path.substr(params.path.lastIndexOf("/") + 1); | |
| 1502 | + this.fileName = this.fileName.substr(0, this.fileName.lastIndexOf(".json")); | |
| 1503 | + dataManager.loadAnimation(params.path, this.configAnimation, this.onSetupError); | |
| 1504 | + } | |
| 1505 | + }; | |
| 1506 | + AnimationItem.prototype.onSetupError = function() { | |
| 1507 | + this.trigger("data_failed"); | |
| 1508 | + }; | |
| 1509 | + AnimationItem.prototype.setupAnimation = function(data) { | |
| 1510 | + dataManager.completeAnimation(data, this.configAnimation); | |
| 1511 | + }; | |
| 1512 | + AnimationItem.prototype.setData = function(wrapper, animationData) { | |
| 1513 | + if (animationData) { | |
| 1514 | + if (_typeof$4(animationData) !== "object") animationData = JSON.parse(animationData); | |
| 1515 | + } | |
| 1516 | + var params = { | |
| 1517 | + wrapper, | |
| 1518 | + animationData | |
| 1519 | + }; | |
| 1520 | + var wrapperAttributes = wrapper.attributes; | |
| 1521 | + params.path = wrapperAttributes.getNamedItem("data-animation-path") ? wrapperAttributes.getNamedItem("data-animation-path").value : wrapperAttributes.getNamedItem("data-bm-path") ? wrapperAttributes.getNamedItem("data-bm-path").value : wrapperAttributes.getNamedItem("bm-path") ? wrapperAttributes.getNamedItem("bm-path").value : ""; | |
| 1522 | + params.animType = wrapperAttributes.getNamedItem("data-anim-type") ? wrapperAttributes.getNamedItem("data-anim-type").value : wrapperAttributes.getNamedItem("data-bm-type") ? wrapperAttributes.getNamedItem("data-bm-type").value : wrapperAttributes.getNamedItem("bm-type") ? wrapperAttributes.getNamedItem("bm-type").value : wrapperAttributes.getNamedItem("data-bm-renderer") ? wrapperAttributes.getNamedItem("data-bm-renderer").value : wrapperAttributes.getNamedItem("bm-renderer") ? wrapperAttributes.getNamedItem("bm-renderer").value : getRegisteredRenderer() || "canvas"; | |
| 1523 | + var loop = wrapperAttributes.getNamedItem("data-anim-loop") ? wrapperAttributes.getNamedItem("data-anim-loop").value : wrapperAttributes.getNamedItem("data-bm-loop") ? wrapperAttributes.getNamedItem("data-bm-loop").value : wrapperAttributes.getNamedItem("bm-loop") ? wrapperAttributes.getNamedItem("bm-loop").value : ""; | |
| 1524 | + if (loop === "false") params.loop = false; | |
| 1525 | + else if (loop === "true") params.loop = true; | |
| 1526 | + else if (loop !== "") params.loop = parseInt(loop, 10); | |
| 1527 | + params.autoplay = (wrapperAttributes.getNamedItem("data-anim-autoplay") ? wrapperAttributes.getNamedItem("data-anim-autoplay").value : wrapperAttributes.getNamedItem("data-bm-autoplay") ? wrapperAttributes.getNamedItem("data-bm-autoplay").value : wrapperAttributes.getNamedItem("bm-autoplay") ? wrapperAttributes.getNamedItem("bm-autoplay").value : true) !== "false"; | |
| 1528 | + params.name = wrapperAttributes.getNamedItem("data-name") ? wrapperAttributes.getNamedItem("data-name").value : wrapperAttributes.getNamedItem("data-bm-name") ? wrapperAttributes.getNamedItem("data-bm-name").value : wrapperAttributes.getNamedItem("bm-name") ? wrapperAttributes.getNamedItem("bm-name").value : ""; | |
| 1529 | + if ((wrapperAttributes.getNamedItem("data-anim-prerender") ? wrapperAttributes.getNamedItem("data-anim-prerender").value : wrapperAttributes.getNamedItem("data-bm-prerender") ? wrapperAttributes.getNamedItem("data-bm-prerender").value : wrapperAttributes.getNamedItem("bm-prerender") ? wrapperAttributes.getNamedItem("bm-prerender").value : "") === "false") params.prerender = false; | |
| 1530 | + if (!params.path) this.trigger("destroy"); | |
| 1531 | + else this.setParams(params); | |
| 1532 | + }; | |
| 1533 | + AnimationItem.prototype.includeLayers = function(data) { | |
| 1534 | + if (data.op > this.animationData.op) { | |
| 1535 | + this.animationData.op = data.op; | |
| 1536 | + this.totalFrames = Math.floor(data.op - this.animationData.ip); | |
| 1537 | + } | |
| 1538 | + var layers = this.animationData.layers; | |
| 1539 | + var i; | |
| 1540 | + var len = layers.length; | |
| 1541 | + var newLayers = data.layers; | |
| 1542 | + var j; | |
| 1543 | + var jLen = newLayers.length; | |
| 1544 | + for (j = 0; j < jLen; j += 1) { | |
| 1545 | + i = 0; | |
| 1546 | + while (i < len) { | |
| 1547 | + if (layers[i].id === newLayers[j].id) { | |
| 1548 | + layers[i] = newLayers[j]; | |
| 1549 | + break; | |
| 1550 | + } | |
| 1551 | + i += 1; | |
| 1552 | + } | |
| 1553 | + } | |
| 1554 | + if (data.chars || data.fonts) { | |
| 1555 | + this.renderer.globalData.fontManager.addChars(data.chars); | |
| 1556 | + this.renderer.globalData.fontManager.addFonts(data.fonts, this.renderer.globalData.defs); | |
| 1557 | + } | |
| 1558 | + if (data.assets) { | |
| 1559 | + len = data.assets.length; | |
| 1560 | + for (i = 0; i < len; i += 1) this.animationData.assets.push(data.assets[i]); | |
| 1561 | + } | |
| 1562 | + this.animationData.__complete = false; | |
| 1563 | + dataManager.completeAnimation(this.animationData, this.onSegmentComplete); | |
| 1564 | + }; | |
| 1565 | + AnimationItem.prototype.onSegmentComplete = function(data) { | |
| 1566 | + this.animationData = data; | |
| 1567 | + var expressionsPlugin = getExpressionsPlugin(); | |
| 1568 | + if (expressionsPlugin) expressionsPlugin.initExpressions(this); | |
| 1569 | + this.loadNextSegment(); | |
| 1570 | + }; | |
| 1571 | + AnimationItem.prototype.loadNextSegment = function() { | |
| 1572 | + var segments = this.animationData.segments; | |
| 1573 | + if (!segments || segments.length === 0 || !this.autoloadSegments) { | |
| 1574 | + this.trigger("data_ready"); | |
| 1575 | + this.timeCompleted = this.totalFrames; | |
| 1576 | + return; | |
| 1577 | + } | |
| 1578 | + var segment = segments.shift(); | |
| 1579 | + this.timeCompleted = segment.time * this.frameRate; | |
| 1580 | + var segmentPath = this.path + this.fileName + "_" + this.segmentPos + ".json"; | |
| 1581 | + this.segmentPos += 1; | |
| 1582 | + dataManager.loadData(segmentPath, this.includeLayers.bind(this), function() { | |
| 1583 | + this.trigger("data_failed"); | |
| 1584 | + }.bind(this)); | |
| 1585 | + }; | |
| 1586 | + AnimationItem.prototype.loadSegments = function() { | |
| 1587 | + if (!this.animationData.segments) this.timeCompleted = this.totalFrames; | |
| 1588 | + this.loadNextSegment(); | |
| 1589 | + }; | |
| 1590 | + AnimationItem.prototype.imagesLoaded = function() { | |
| 1591 | + this.trigger("loaded_images"); | |
| 1592 | + this.checkLoaded(); | |
| 1593 | + }; | |
| 1594 | + AnimationItem.prototype.preloadImages = function() { | |
| 1595 | + this.imagePreloader.setAssetsPath(this.assetsPath); | |
| 1596 | + this.imagePreloader.setPath(this.path); | |
| 1597 | + this.imagePreloader.loadAssets(this.animationData.assets, this.imagesLoaded.bind(this)); | |
| 1598 | + }; | |
| 1599 | + AnimationItem.prototype.configAnimation = function(animData) { | |
| 1600 | + if (!this.renderer) return; | |
| 1601 | + try { | |
| 1602 | + this.animationData = animData; | |
| 1603 | + if (this.initialSegment) { | |
| 1604 | + this.totalFrames = Math.floor(this.initialSegment[1] - this.initialSegment[0]); | |
| 1605 | + this.firstFrame = Math.round(this.initialSegment[0]); | |
| 1606 | + } else { | |
| 1607 | + this.totalFrames = Math.floor(this.animationData.op - this.animationData.ip); | |
| 1608 | + this.firstFrame = Math.round(this.animationData.ip); | |
| 1609 | + } | |
| 1610 | + this.renderer.configAnimation(animData); | |
| 1611 | + if (!animData.assets) animData.assets = []; | |
| 1612 | + this.assets = this.animationData.assets; | |
| 1613 | + this.frameRate = this.animationData.fr; | |
| 1614 | + this.frameMult = this.animationData.fr / 1e3; | |
| 1615 | + this.renderer.searchExtraCompositions(animData.assets); | |
| 1616 | + this.markers = markerParser(animData.markers || []); | |
| 1617 | + this.trigger("config_ready"); | |
| 1618 | + this.preloadImages(); | |
| 1619 | + this.loadSegments(); | |
| 1620 | + this.updaFrameModifier(); | |
| 1621 | + this.waitForFontsLoaded(); | |
| 1622 | + if (this.isPaused) this.audioController.pause(); | |
| 1623 | + } catch (error) { | |
| 1624 | + this.triggerConfigError(error); | |
| 1625 | + } | |
| 1626 | + }; | |
| 1627 | + AnimationItem.prototype.waitForFontsLoaded = function() { | |
| 1628 | + if (!this.renderer) return; | |
| 1629 | + if (this.renderer.globalData.fontManager.isLoaded) this.checkLoaded(); | |
| 1630 | + else setTimeout(this.waitForFontsLoaded.bind(this), 20); | |
| 1631 | + }; | |
| 1632 | + AnimationItem.prototype.checkLoaded = function() { | |
| 1633 | + if (!this.isLoaded && this.renderer.globalData.fontManager.isLoaded && (this.imagePreloader.loadedImages() || this.renderer.rendererType !== "canvas") && this.imagePreloader.loadedFootages()) { | |
| 1634 | + this.isLoaded = true; | |
| 1635 | + var expressionsPlugin = getExpressionsPlugin(); | |
| 1636 | + if (expressionsPlugin) expressionsPlugin.initExpressions(this); | |
| 1637 | + this.renderer.initItems(); | |
| 1638 | + setTimeout(function() { | |
| 1639 | + this.trigger("DOMLoaded"); | |
| 1640 | + }.bind(this), 0); | |
| 1641 | + this.gotoFrame(); | |
| 1642 | + if (this.autoplay) this.play(); | |
| 1643 | + } | |
| 1644 | + }; | |
| 1645 | + AnimationItem.prototype.resize = function(width, height) { | |
| 1646 | + var _width = typeof width === "number" ? width : void 0; | |
| 1647 | + var _height = typeof height === "number" ? height : void 0; | |
| 1648 | + this.renderer.updateContainerSize(_width, _height); | |
| 1649 | + }; | |
| 1650 | + AnimationItem.prototype.setSubframe = function(flag) { | |
| 1651 | + this.isSubframeEnabled = !!flag; | |
| 1652 | + }; | |
| 1653 | + AnimationItem.prototype.gotoFrame = function() { | |
| 1654 | + this.currentFrame = this.isSubframeEnabled ? this.currentRawFrame : ~~this.currentRawFrame; | |
| 1655 | + if (this.timeCompleted !== this.totalFrames && this.currentFrame > this.timeCompleted) this.currentFrame = this.timeCompleted; | |
| 1656 | + this.trigger("enterFrame"); | |
| 1657 | + this.renderFrame(); | |
| 1658 | + this.trigger("drawnFrame"); | |
| 1659 | + }; | |
| 1660 | + AnimationItem.prototype.renderFrame = function() { | |
| 1661 | + if (this.isLoaded === false || !this.renderer) return; | |
| 1662 | + try { | |
| 1663 | + if (this.expressionsPlugin) this.expressionsPlugin.resetFrame(); | |
| 1664 | + this.renderer.renderFrame(this.currentFrame + this.firstFrame); | |
| 1665 | + } catch (error) { | |
| 1666 | + this.triggerRenderFrameError(error); | |
| 1667 | + } | |
| 1668 | + }; | |
| 1669 | + AnimationItem.prototype.play = function(name) { | |
| 1670 | + if (name && this.name !== name) return; | |
| 1671 | + if (this.isPaused === true) { | |
| 1672 | + this.isPaused = false; | |
| 1673 | + this.trigger("_play"); | |
| 1674 | + this.audioController.resume(); | |
| 1675 | + if (this._idle) { | |
| 1676 | + this._idle = false; | |
| 1677 | + this.trigger("_active"); | |
| 1678 | + } | |
| 1679 | + } | |
| 1680 | + }; | |
| 1681 | + AnimationItem.prototype.pause = function(name) { | |
| 1682 | + if (name && this.name !== name) return; | |
| 1683 | + if (this.isPaused === false) { | |
| 1684 | + this.isPaused = true; | |
| 1685 | + this.trigger("_pause"); | |
| 1686 | + this._idle = true; | |
| 1687 | + this.trigger("_idle"); | |
| 1688 | + this.audioController.pause(); | |
| 1689 | + } | |
| 1690 | + }; | |
| 1691 | + AnimationItem.prototype.togglePause = function(name) { | |
| 1692 | + if (name && this.name !== name) return; | |
| 1693 | + if (this.isPaused === true) this.play(); | |
| 1694 | + else this.pause(); | |
| 1695 | + }; | |
| 1696 | + AnimationItem.prototype.stop = function(name) { | |
| 1697 | + if (name && this.name !== name) return; | |
| 1698 | + this.pause(); | |
| 1699 | + this.playCount = 0; | |
| 1700 | + this._completedLoop = false; | |
| 1701 | + this.setCurrentRawFrameValue(0); | |
| 1702 | + }; | |
| 1703 | + AnimationItem.prototype.getMarkerData = function(markerName) { | |
| 1704 | + var marker; | |
| 1705 | + for (var i = 0; i < this.markers.length; i += 1) { | |
| 1706 | + marker = this.markers[i]; | |
| 1707 | + if (marker.payload && marker.payload.name === markerName) return marker; | |
| 1708 | + } | |
| 1709 | + return null; | |
| 1710 | + }; | |
| 1711 | + AnimationItem.prototype.goToAndStop = function(value, isFrame, name) { | |
| 1712 | + if (name && this.name !== name) return; | |
| 1713 | + var numValue = Number(value); | |
| 1714 | + if (isNaN(numValue)) { | |
| 1715 | + var marker = this.getMarkerData(value); | |
| 1716 | + if (marker) this.goToAndStop(marker.time, true); | |
| 1717 | + } else if (isFrame) this.setCurrentRawFrameValue(value); | |
| 1718 | + else this.setCurrentRawFrameValue(value * this.frameModifier); | |
| 1719 | + this.pause(); | |
| 1720 | + }; | |
| 1721 | + AnimationItem.prototype.goToAndPlay = function(value, isFrame, name) { | |
| 1722 | + if (name && this.name !== name) return; | |
| 1723 | + var numValue = Number(value); | |
| 1724 | + if (isNaN(numValue)) { | |
| 1725 | + var marker = this.getMarkerData(value); | |
| 1726 | + if (marker) if (!marker.duration) this.goToAndStop(marker.time, true); | |
| 1727 | + else this.playSegments([marker.time, marker.time + marker.duration], true); | |
| 1728 | + } else this.goToAndStop(numValue, isFrame, name); | |
| 1729 | + this.play(); | |
| 1730 | + }; | |
| 1731 | + AnimationItem.prototype.advanceTime = function(value) { | |
| 1732 | + if (this.isPaused === true || this.isLoaded === false) return; | |
| 1733 | + var nextValue = this.currentRawFrame + value * this.frameModifier; | |
| 1734 | + var _isComplete = false; | |
| 1735 | + if (nextValue >= this.totalFrames - 1 && this.frameModifier > 0) if (!this.loop || this.playCount === this.loop) { | |
| 1736 | + if (!this.checkSegments(nextValue > this.totalFrames ? nextValue % this.totalFrames : 0)) { | |
| 1737 | + _isComplete = true; | |
| 1738 | + nextValue = this.totalFrames - 1; | |
| 1739 | + } | |
| 1740 | + } else if (nextValue >= this.totalFrames) { | |
| 1741 | + this.playCount += 1; | |
| 1742 | + if (!this.checkSegments(nextValue % this.totalFrames)) { | |
| 1743 | + this.setCurrentRawFrameValue(nextValue % this.totalFrames); | |
| 1744 | + this._completedLoop = true; | |
| 1745 | + this.trigger("loopComplete"); | |
| 1746 | + } | |
| 1747 | + } else this.setCurrentRawFrameValue(nextValue); | |
| 1748 | + else if (nextValue < 0) { | |
| 1749 | + if (!this.checkSegments(nextValue % this.totalFrames)) if (this.loop && !(this.playCount-- <= 0 && this.loop !== true)) { | |
| 1750 | + this.setCurrentRawFrameValue(this.totalFrames + nextValue % this.totalFrames); | |
| 1751 | + if (!this._completedLoop) this._completedLoop = true; | |
| 1752 | + else this.trigger("loopComplete"); | |
| 1753 | + } else { | |
| 1754 | + _isComplete = true; | |
| 1755 | + nextValue = 0; | |
| 1756 | + } | |
| 1757 | + } else this.setCurrentRawFrameValue(nextValue); | |
| 1758 | + if (_isComplete) { | |
| 1759 | + this.setCurrentRawFrameValue(nextValue); | |
| 1760 | + this.pause(); | |
| 1761 | + this.trigger("complete"); | |
| 1762 | + } | |
| 1763 | + }; | |
| 1764 | + AnimationItem.prototype.adjustSegment = function(arr, offset) { | |
| 1765 | + this.playCount = 0; | |
| 1766 | + if (arr[1] < arr[0]) { | |
| 1767 | + if (this.frameModifier > 0) if (this.playSpeed < 0) this.setSpeed(-this.playSpeed); | |
| 1768 | + else this.setDirection(-1); | |
| 1769 | + this.totalFrames = arr[0] - arr[1]; | |
| 1770 | + this.timeCompleted = this.totalFrames; | |
| 1771 | + this.firstFrame = arr[1]; | |
| 1772 | + this.setCurrentRawFrameValue(this.totalFrames - .001 - offset); | |
| 1773 | + } else if (arr[1] > arr[0]) { | |
| 1774 | + if (this.frameModifier < 0) if (this.playSpeed < 0) this.setSpeed(-this.playSpeed); | |
| 1775 | + else this.setDirection(1); | |
| 1776 | + this.totalFrames = arr[1] - arr[0]; | |
| 1777 | + this.timeCompleted = this.totalFrames; | |
| 1778 | + this.firstFrame = arr[0]; | |
| 1779 | + this.setCurrentRawFrameValue(.001 + offset); | |
| 1780 | + } | |
| 1781 | + this.trigger("segmentStart"); | |
| 1782 | + }; | |
| 1783 | + AnimationItem.prototype.setSegment = function(init, end) { | |
| 1784 | + var pendingFrame = -1; | |
| 1785 | + if (this.isPaused) { | |
| 1786 | + if (this.currentRawFrame + this.firstFrame < init) pendingFrame = init; | |
| 1787 | + else if (this.currentRawFrame + this.firstFrame > end) pendingFrame = end - init; | |
| 1788 | + } | |
| 1789 | + this.firstFrame = init; | |
| 1790 | + this.totalFrames = end - init; | |
| 1791 | + this.timeCompleted = this.totalFrames; | |
| 1792 | + if (pendingFrame !== -1) this.goToAndStop(pendingFrame, true); | |
| 1793 | + }; | |
| 1794 | + AnimationItem.prototype.playSegments = function(arr, forceFlag) { | |
| 1795 | + if (forceFlag) this.segments.length = 0; | |
| 1796 | + if (_typeof$4(arr[0]) === "object") { | |
| 1797 | + var i; | |
| 1798 | + var len = arr.length; | |
| 1799 | + for (i = 0; i < len; i += 1) this.segments.push(arr[i]); | |
| 1800 | + } else this.segments.push(arr); | |
| 1801 | + if (this.segments.length && forceFlag) this.adjustSegment(this.segments.shift(), 0); | |
| 1802 | + if (this.isPaused) this.play(); | |
| 1803 | + }; | |
| 1804 | + AnimationItem.prototype.resetSegments = function(forceFlag) { | |
| 1805 | + this.segments.length = 0; | |
| 1806 | + this.segments.push([this.animationData.ip, this.animationData.op]); | |
| 1807 | + if (forceFlag) this.checkSegments(0); | |
| 1808 | + }; | |
| 1809 | + AnimationItem.prototype.checkSegments = function(offset) { | |
| 1810 | + if (this.segments.length) { | |
| 1811 | + this.adjustSegment(this.segments.shift(), offset); | |
| 1812 | + return true; | |
| 1813 | + } | |
| 1814 | + return false; | |
| 1815 | + }; | |
| 1816 | + AnimationItem.prototype.destroy = function(name) { | |
| 1817 | + if (name && this.name !== name || !this.renderer) return; | |
| 1818 | + this.renderer.destroy(); | |
| 1819 | + this.imagePreloader.destroy(); | |
| 1820 | + this.trigger("destroy"); | |
| 1821 | + this._cbs = null; | |
| 1822 | + this.onEnterFrame = null; | |
| 1823 | + this.onLoopComplete = null; | |
| 1824 | + this.onComplete = null; | |
| 1825 | + this.onSegmentStart = null; | |
| 1826 | + this.onDestroy = null; | |
| 1827 | + this.renderer = null; | |
| 1828 | + this.expressionsPlugin = null; | |
| 1829 | + this.imagePreloader = null; | |
| 1830 | + this.projectInterface = null; | |
| 1831 | + }; | |
| 1832 | + AnimationItem.prototype.setCurrentRawFrameValue = function(value) { | |
| 1833 | + this.currentRawFrame = value; | |
| 1834 | + this.gotoFrame(); | |
| 1835 | + }; | |
| 1836 | + AnimationItem.prototype.setSpeed = function(val) { | |
| 1837 | + this.playSpeed = val; | |
| 1838 | + this.updaFrameModifier(); | |
| 1839 | + }; | |
| 1840 | + AnimationItem.prototype.setDirection = function(val) { | |
| 1841 | + this.playDirection = val < 0 ? -1 : 1; | |
| 1842 | + this.updaFrameModifier(); | |
| 1843 | + }; | |
| 1844 | + AnimationItem.prototype.setLoop = function(isLooping) { | |
| 1845 | + this.loop = isLooping; | |
| 1846 | + }; | |
| 1847 | + AnimationItem.prototype.setVolume = function(val, name) { | |
| 1848 | + if (name && this.name !== name) return; | |
| 1849 | + this.audioController.setVolume(val); | |
| 1850 | + }; | |
| 1851 | + AnimationItem.prototype.getVolume = function() { | |
| 1852 | + return this.audioController.getVolume(); | |
| 1853 | + }; | |
| 1854 | + AnimationItem.prototype.mute = function(name) { | |
| 1855 | + if (name && this.name !== name) return; | |
| 1856 | + this.audioController.mute(); | |
| 1857 | + }; | |
| 1858 | + AnimationItem.prototype.unmute = function(name) { | |
| 1859 | + if (name && this.name !== name) return; | |
| 1860 | + this.audioController.unmute(); | |
| 1861 | + }; | |
| 1862 | + AnimationItem.prototype.updaFrameModifier = function() { | |
| 1863 | + this.frameModifier = this.frameMult * this.playSpeed * this.playDirection; | |
| 1864 | + this.audioController.setRate(this.playSpeed * this.playDirection); | |
| 1865 | + }; | |
| 1866 | + AnimationItem.prototype.getPath = function() { | |
| 1867 | + return this.path; | |
| 1868 | + }; | |
| 1869 | + AnimationItem.prototype.getAssetsPath = function(assetData) { | |
| 1870 | + var path = ""; | |
| 1871 | + if (assetData.e) path = assetData.p; | |
| 1872 | + else if (this.assetsPath) { | |
| 1873 | + var imagePath = assetData.p; | |
| 1874 | + if (imagePath.indexOf("images/") !== -1) imagePath = imagePath.split("/")[1]; | |
| 1875 | + path = this.assetsPath + imagePath; | |
| 1876 | + } else { | |
| 1877 | + path = this.path; | |
| 1878 | + path += assetData.u ? assetData.u : ""; | |
| 1879 | + path += assetData.p; | |
| 1880 | + } | |
| 1881 | + return path; | |
| 1882 | + }; | |
| 1883 | + AnimationItem.prototype.getAssetData = function(id) { | |
| 1884 | + var i = 0; | |
| 1885 | + var len = this.assets.length; | |
| 1886 | + while (i < len) { | |
| 1887 | + if (id === this.assets[i].id) return this.assets[i]; | |
| 1888 | + i += 1; | |
| 1889 | + } | |
| 1890 | + return null; | |
| 1891 | + }; | |
| 1892 | + AnimationItem.prototype.hide = function() { | |
| 1893 | + this.renderer.hide(); | |
| 1894 | + }; | |
| 1895 | + AnimationItem.prototype.show = function() { | |
| 1896 | + this.renderer.show(); | |
| 1897 | + }; | |
| 1898 | + AnimationItem.prototype.getDuration = function(isFrame) { | |
| 1899 | + return isFrame ? this.totalFrames : this.totalFrames / this.frameRate; | |
| 1900 | + }; | |
| 1901 | + AnimationItem.prototype.updateDocumentData = function(path, documentData, index) { | |
| 1902 | + try { | |
| 1903 | + this.renderer.getElementByPath(path).updateDocumentData(documentData, index); | |
| 1904 | + } catch (error) {} | |
| 1905 | + }; | |
| 1906 | + AnimationItem.prototype.trigger = function(name) { | |
| 1907 | + if (this._cbs && this._cbs[name]) switch (name) { | |
| 1908 | + case "enterFrame": | |
| 1909 | + this.triggerEvent(name, new BMEnterFrameEvent(name, this.currentFrame, this.totalFrames, this.frameModifier)); | |
| 1910 | + break; | |
| 1911 | + case "drawnFrame": | |
| 1912 | + this.drawnFrameEvent.currentTime = this.currentFrame; | |
| 1913 | + this.drawnFrameEvent.totalTime = this.totalFrames; | |
| 1914 | + this.drawnFrameEvent.direction = this.frameModifier; | |
| 1915 | + this.triggerEvent(name, this.drawnFrameEvent); | |
| 1916 | + break; | |
| 1917 | + case "loopComplete": | |
| 1918 | + this.triggerEvent(name, new BMCompleteLoopEvent(name, this.loop, this.playCount, this.frameMult)); | |
| 1919 | + break; | |
| 1920 | + case "complete": | |
| 1921 | + this.triggerEvent(name, new BMCompleteEvent(name, this.frameMult)); | |
| 1922 | + break; | |
| 1923 | + case "segmentStart": | |
| 1924 | + this.triggerEvent(name, new BMSegmentStartEvent(name, this.firstFrame, this.totalFrames)); | |
| 1925 | + break; | |
| 1926 | + case "destroy": | |
| 1927 | + this.triggerEvent(name, new BMDestroyEvent(name, this)); | |
| 1928 | + break; | |
| 1929 | + default: this.triggerEvent(name); | |
| 1930 | + } | |
| 1931 | + if (name === "enterFrame" && this.onEnterFrame) this.onEnterFrame.call(this, new BMEnterFrameEvent(name, this.currentFrame, this.totalFrames, this.frameMult)); | |
| 1932 | + if (name === "loopComplete" && this.onLoopComplete) this.onLoopComplete.call(this, new BMCompleteLoopEvent(name, this.loop, this.playCount, this.frameMult)); | |
| 1933 | + if (name === "complete" && this.onComplete) this.onComplete.call(this, new BMCompleteEvent(name, this.frameMult)); | |
| 1934 | + if (name === "segmentStart" && this.onSegmentStart) this.onSegmentStart.call(this, new BMSegmentStartEvent(name, this.firstFrame, this.totalFrames)); | |
| 1935 | + if (name === "destroy" && this.onDestroy) this.onDestroy.call(this, new BMDestroyEvent(name, this)); | |
| 1936 | + }; | |
| 1937 | + AnimationItem.prototype.triggerRenderFrameError = function(nativeError) { | |
| 1938 | + var error = new BMRenderFrameErrorEvent(nativeError, this.currentFrame); | |
| 1939 | + this.triggerEvent("error", error); | |
| 1940 | + if (this.onError) this.onError.call(this, error); | |
| 1941 | + }; | |
| 1942 | + AnimationItem.prototype.triggerConfigError = function(nativeError) { | |
| 1943 | + var error = new BMConfigErrorEvent(nativeError, this.currentFrame); | |
| 1944 | + this.triggerEvent("error", error); | |
| 1945 | + if (this.onError) this.onError.call(this, error); | |
| 1946 | + }; | |
| 1947 | + var animationManager = function() { | |
| 1948 | + var moduleOb = {}; | |
| 1949 | + var registeredAnimations = []; | |
| 1950 | + var initTime = 0; | |
| 1951 | + var len = 0; | |
| 1952 | + var playingAnimationsNum = 0; | |
| 1953 | + var _stopped = true; | |
| 1954 | + var _isFrozen = false; | |
| 1955 | + function removeElement(ev) { | |
| 1956 | + var i = 0; | |
| 1957 | + var animItem = ev.target; | |
| 1958 | + while (i < len) { | |
| 1959 | + if (registeredAnimations[i].animation === animItem) { | |
| 1960 | + registeredAnimations.splice(i, 1); | |
| 1961 | + i -= 1; | |
| 1962 | + len -= 1; | |
| 1963 | + if (!animItem.isPaused) subtractPlayingCount(); | |
| 1964 | + } | |
| 1965 | + i += 1; | |
| 1966 | + } | |
| 1967 | + } | |
| 1968 | + function registerAnimation(element, animationData) { | |
| 1969 | + if (!element) return null; | |
| 1970 | + var i = 0; | |
| 1971 | + while (i < len) { | |
| 1972 | + if (registeredAnimations[i].elem === element && registeredAnimations[i].elem !== null) return registeredAnimations[i].animation; | |
| 1973 | + i += 1; | |
| 1974 | + } | |
| 1975 | + var animItem = new AnimationItem(); | |
| 1976 | + setupAnimation(animItem, element); | |
| 1977 | + animItem.setData(element, animationData); | |
| 1978 | + return animItem; | |
| 1979 | + } | |
| 1980 | + function getRegisteredAnimations() { | |
| 1981 | + var i; | |
| 1982 | + var lenAnims = registeredAnimations.length; | |
| 1983 | + var animations = []; | |
| 1984 | + for (i = 0; i < lenAnims; i += 1) animations.push(registeredAnimations[i].animation); | |
| 1985 | + return animations; | |
| 1986 | + } | |
| 1987 | + function addPlayingCount() { | |
| 1988 | + playingAnimationsNum += 1; | |
| 1989 | + activate(); | |
| 1990 | + } | |
| 1991 | + function subtractPlayingCount() { | |
| 1992 | + playingAnimationsNum -= 1; | |
| 1993 | + } | |
| 1994 | + function setupAnimation(animItem, element) { | |
| 1995 | + animItem.addEventListener("destroy", removeElement); | |
| 1996 | + animItem.addEventListener("_active", addPlayingCount); | |
| 1997 | + animItem.addEventListener("_idle", subtractPlayingCount); | |
| 1998 | + registeredAnimations.push({ | |
| 1999 | + elem: element, | |
| 2000 | + animation: animItem | |
| 2001 | + }); | |
| 2002 | + len += 1; | |
| 2003 | + } | |
| 2004 | + function loadAnimation(params) { | |
| 2005 | + var animItem = new AnimationItem(); | |
| 2006 | + setupAnimation(animItem, null); | |
| 2007 | + animItem.setParams(params); | |
| 2008 | + return animItem; | |
| 2009 | + } | |
| 2010 | + function setSpeed(val, animation) { | |
| 2011 | + var i; | |
| 2012 | + for (i = 0; i < len; i += 1) registeredAnimations[i].animation.setSpeed(val, animation); | |
| 2013 | + } | |
| 2014 | + function setDirection(val, animation) { | |
| 2015 | + var i; | |
| 2016 | + for (i = 0; i < len; i += 1) registeredAnimations[i].animation.setDirection(val, animation); | |
| 2017 | + } | |
| 2018 | + function play(animation) { | |
| 2019 | + var i; | |
| 2020 | + for (i = 0; i < len; i += 1) registeredAnimations[i].animation.play(animation); | |
| 2021 | + } | |
| 2022 | + function resume(nowTime) { | |
| 2023 | + var elapsedTime = nowTime - initTime; | |
| 2024 | + var i; | |
| 2025 | + for (i = 0; i < len; i += 1) registeredAnimations[i].animation.advanceTime(elapsedTime); | |
| 2026 | + initTime = nowTime; | |
| 2027 | + if (playingAnimationsNum && !_isFrozen) window.requestAnimationFrame(resume); | |
| 2028 | + else _stopped = true; | |
| 2029 | + } | |
| 2030 | + function first(nowTime) { | |
| 2031 | + initTime = nowTime; | |
| 2032 | + window.requestAnimationFrame(resume); | |
| 2033 | + } | |
| 2034 | + function pause(animation) { | |
| 2035 | + var i; | |
| 2036 | + for (i = 0; i < len; i += 1) registeredAnimations[i].animation.pause(animation); | |
| 2037 | + } | |
| 2038 | + function goToAndStop(value, isFrame, animation) { | |
| 2039 | + var i; | |
| 2040 | + for (i = 0; i < len; i += 1) registeredAnimations[i].animation.goToAndStop(value, isFrame, animation); | |
| 2041 | + } | |
| 2042 | + function stop(animation) { | |
| 2043 | + var i; | |
| 2044 | + for (i = 0; i < len; i += 1) registeredAnimations[i].animation.stop(animation); | |
| 2045 | + } | |
| 2046 | + function togglePause(animation) { | |
| 2047 | + var i; | |
| 2048 | + for (i = 0; i < len; i += 1) registeredAnimations[i].animation.togglePause(animation); | |
| 2049 | + } | |
| 2050 | + function destroy(animation) { | |
| 2051 | + var i; | |
| 2052 | + for (i = len - 1; i >= 0; i -= 1) registeredAnimations[i].animation.destroy(animation); | |
| 2053 | + } | |
| 2054 | + function searchAnimations(animationData, standalone, renderer) { | |
| 2055 | + var animElements = [].concat([].slice.call(document.getElementsByClassName("lottie")), [].slice.call(document.getElementsByClassName("bodymovin"))); | |
| 2056 | + var i; | |
| 2057 | + var lenAnims = animElements.length; | |
| 2058 | + for (i = 0; i < lenAnims; i += 1) { | |
| 2059 | + if (renderer) animElements[i].setAttribute("data-bm-type", renderer); | |
| 2060 | + registerAnimation(animElements[i], animationData); | |
| 2061 | + } | |
| 2062 | + if (standalone && lenAnims === 0) { | |
| 2063 | + if (!renderer) renderer = "svg"; | |
| 2064 | + var body = document.getElementsByTagName("body")[0]; | |
| 2065 | + body.innerText = ""; | |
| 2066 | + var div = createTag("div"); | |
| 2067 | + div.style.width = "100%"; | |
| 2068 | + div.style.height = "100%"; | |
| 2069 | + div.setAttribute("data-bm-type", renderer); | |
| 2070 | + body.appendChild(div); | |
| 2071 | + registerAnimation(div, animationData); | |
| 2072 | + } | |
| 2073 | + } | |
| 2074 | + function resize() { | |
| 2075 | + var i; | |
| 2076 | + for (i = 0; i < len; i += 1) registeredAnimations[i].animation.resize(); | |
| 2077 | + } | |
| 2078 | + function activate() { | |
| 2079 | + if (!_isFrozen && playingAnimationsNum) { | |
| 2080 | + if (_stopped) { | |
| 2081 | + window.requestAnimationFrame(first); | |
| 2082 | + _stopped = false; | |
| 2083 | + } | |
| 2084 | + } | |
| 2085 | + } | |
| 2086 | + function freeze() { | |
| 2087 | + _isFrozen = true; | |
| 2088 | + } | |
| 2089 | + function unfreeze() { | |
| 2090 | + _isFrozen = false; | |
| 2091 | + activate(); | |
| 2092 | + } | |
| 2093 | + function setVolume(val, animation) { | |
| 2094 | + var i; | |
| 2095 | + for (i = 0; i < len; i += 1) registeredAnimations[i].animation.setVolume(val, animation); | |
| 2096 | + } | |
| 2097 | + function mute(animation) { | |
| 2098 | + var i; | |
| 2099 | + for (i = 0; i < len; i += 1) registeredAnimations[i].animation.mute(animation); | |
| 2100 | + } | |
| 2101 | + function unmute(animation) { | |
| 2102 | + var i; | |
| 2103 | + for (i = 0; i < len; i += 1) registeredAnimations[i].animation.unmute(animation); | |
| 2104 | + } | |
| 2105 | + moduleOb.registerAnimation = registerAnimation; | |
| 2106 | + moduleOb.loadAnimation = loadAnimation; | |
| 2107 | + moduleOb.setSpeed = setSpeed; | |
| 2108 | + moduleOb.setDirection = setDirection; | |
| 2109 | + moduleOb.play = play; | |
| 2110 | + moduleOb.pause = pause; | |
| 2111 | + moduleOb.stop = stop; | |
| 2112 | + moduleOb.togglePause = togglePause; | |
| 2113 | + moduleOb.searchAnimations = searchAnimations; | |
| 2114 | + moduleOb.resize = resize; | |
| 2115 | + moduleOb.goToAndStop = goToAndStop; | |
| 2116 | + moduleOb.destroy = destroy; | |
| 2117 | + moduleOb.freeze = freeze; | |
| 2118 | + moduleOb.unfreeze = unfreeze; | |
| 2119 | + moduleOb.setVolume = setVolume; | |
| 2120 | + moduleOb.mute = mute; | |
| 2121 | + moduleOb.unmute = unmute; | |
| 2122 | + moduleOb.getRegisteredAnimations = getRegisteredAnimations; | |
| 2123 | + return moduleOb; | |
| 2124 | + }(); | |
| 2125 | + var BezierFactory = function() { | |
| 2126 | + /** | |
| 2127 | + * BezierEasing - use bezier curve for transition easing function | |
| 2128 | + * by Gaëtan Renaudeau 2014 - 2015 – MIT License | |
| 2129 | + * | |
| 2130 | + * Credits: is based on Firefox's nsSMILKeySpline.cpp | |
| 2131 | + * Usage: | |
| 2132 | + * var spline = BezierEasing([ 0.25, 0.1, 0.25, 1.0 ]) | |
| 2133 | + * spline.get(x) => returns the easing value | x must be in [0, 1] range | |
| 2134 | + * | |
| 2135 | + */ | |
| 2136 | + var ob = {}; | |
| 2137 | + ob.getBezierEasing = getBezierEasing; | |
| 2138 | + var beziers = {}; | |
| 2139 | + function getBezierEasing(a, b, c, d, nm) { | |
| 2140 | + var str = nm || ("bez_" + a + "_" + b + "_" + c + "_" + d).replace(/\./g, "p"); | |
| 2141 | + if (beziers[str]) return beziers[str]; | |
| 2142 | + var bezEasing = new BezierEasing([ | |
| 2143 | + a, | |
| 2144 | + b, | |
| 2145 | + c, | |
| 2146 | + d | |
| 2147 | + ]); | |
| 2148 | + beziers[str] = bezEasing; | |
| 2149 | + return bezEasing; | |
| 2150 | + } | |
| 2151 | + var NEWTON_ITERATIONS = 4; | |
| 2152 | + var NEWTON_MIN_SLOPE = .001; | |
| 2153 | + var SUBDIVISION_PRECISION = 1e-7; | |
| 2154 | + var SUBDIVISION_MAX_ITERATIONS = 10; | |
| 2155 | + var kSplineTableSize = 11; | |
| 2156 | + var kSampleStepSize = 1 / (kSplineTableSize - 1); | |
| 2157 | + var float32ArraySupported = typeof Float32Array === "function"; | |
| 2158 | + function A(aA1, aA2) { | |
| 2159 | + return 1 - 3 * aA2 + 3 * aA1; | |
| 2160 | + } | |
| 2161 | + function B(aA1, aA2) { | |
| 2162 | + return 3 * aA2 - 6 * aA1; | |
| 2163 | + } | |
| 2164 | + function C(aA1) { | |
| 2165 | + return 3 * aA1; | |
| 2166 | + } | |
| 2167 | + function calcBezier(aT, aA1, aA2) { | |
| 2168 | + return ((A(aA1, aA2) * aT + B(aA1, aA2)) * aT + C(aA1)) * aT; | |
| 2169 | + } | |
| 2170 | + function getSlope(aT, aA1, aA2) { | |
| 2171 | + return 3 * A(aA1, aA2) * aT * aT + 2 * B(aA1, aA2) * aT + C(aA1); | |
| 2172 | + } | |
| 2173 | + function binarySubdivide(aX, aA, aB, mX1, mX2) { | |
| 2174 | + var currentX; | |
| 2175 | + var currentT; | |
| 2176 | + var i = 0; | |
| 2177 | + do { | |
| 2178 | + currentT = aA + (aB - aA) / 2; | |
| 2179 | + currentX = calcBezier(currentT, mX1, mX2) - aX; | |
| 2180 | + if (currentX > 0) aB = currentT; | |
| 2181 | + else aA = currentT; | |
| 2182 | + } while (Math.abs(currentX) > SUBDIVISION_PRECISION && ++i < SUBDIVISION_MAX_ITERATIONS); | |
| 2183 | + return currentT; | |
| 2184 | + } | |
| 2185 | + function newtonRaphsonIterate(aX, aGuessT, mX1, mX2) { | |
| 2186 | + for (var i = 0; i < NEWTON_ITERATIONS; ++i) { | |
| 2187 | + var currentSlope = getSlope(aGuessT, mX1, mX2); | |
| 2188 | + if (currentSlope === 0) return aGuessT; | |
| 2189 | + var currentX = calcBezier(aGuessT, mX1, mX2) - aX; | |
| 2190 | + aGuessT -= currentX / currentSlope; | |
| 2191 | + } | |
| 2192 | + return aGuessT; | |
| 2193 | + } | |
| 2194 | + /** | |
| 2195 | + * points is an array of [ mX1, mY1, mX2, mY2 ] | |
| 2196 | + */ | |
| 2197 | + function BezierEasing(points) { | |
| 2198 | + this._p = points; | |
| 2199 | + this._mSampleValues = float32ArraySupported ? new Float32Array(kSplineTableSize) : new Array(kSplineTableSize); | |
| 2200 | + this._precomputed = false; | |
| 2201 | + this.get = this.get.bind(this); | |
| 2202 | + } | |
| 2203 | + BezierEasing.prototype = { | |
| 2204 | + get: function get(x) { | |
| 2205 | + var mX1 = this._p[0]; | |
| 2206 | + var mY1 = this._p[1]; | |
| 2207 | + var mX2 = this._p[2]; | |
| 2208 | + var mY2 = this._p[3]; | |
| 2209 | + if (!this._precomputed) this._precompute(); | |
| 2210 | + if (mX1 === mY1 && mX2 === mY2) return x; | |
| 2211 | + if (x === 0) return 0; | |
| 2212 | + if (x === 1) return 1; | |
| 2213 | + return calcBezier(this._getTForX(x), mY1, mY2); | |
| 2214 | + }, | |
| 2215 | + _precompute: function _precompute() { | |
| 2216 | + var mX1 = this._p[0]; | |
| 2217 | + var mY1 = this._p[1]; | |
| 2218 | + var mX2 = this._p[2]; | |
| 2219 | + var mY2 = this._p[3]; | |
| 2220 | + this._precomputed = true; | |
| 2221 | + if (mX1 !== mY1 || mX2 !== mY2) this._calcSampleValues(); | |
| 2222 | + }, | |
| 2223 | + _calcSampleValues: function _calcSampleValues() { | |
| 2224 | + var mX1 = this._p[0]; | |
| 2225 | + var mX2 = this._p[2]; | |
| 2226 | + for (var i = 0; i < kSplineTableSize; ++i) this._mSampleValues[i] = calcBezier(i * kSampleStepSize, mX1, mX2); | |
| 2227 | + }, | |
| 2228 | + /** | |
| 2229 | + * getTForX chose the fastest heuristic to determine the percentage value precisely from a given X projection. | |
| 2230 | + */ | |
| 2231 | + _getTForX: function _getTForX(aX) { | |
| 2232 | + var mX1 = this._p[0]; | |
| 2233 | + var mX2 = this._p[2]; | |
| 2234 | + var mSampleValues = this._mSampleValues; | |
| 2235 | + var intervalStart = 0; | |
| 2236 | + var currentSample = 1; | |
| 2237 | + var lastSample = kSplineTableSize - 1; | |
| 2238 | + for (; currentSample !== lastSample && mSampleValues[currentSample] <= aX; ++currentSample) intervalStart += kSampleStepSize; | |
| 2239 | + --currentSample; | |
| 2240 | + var dist = (aX - mSampleValues[currentSample]) / (mSampleValues[currentSample + 1] - mSampleValues[currentSample]); | |
| 2241 | + var guessForT = intervalStart + dist * kSampleStepSize; | |
| 2242 | + var initialSlope = getSlope(guessForT, mX1, mX2); | |
| 2243 | + if (initialSlope >= NEWTON_MIN_SLOPE) return newtonRaphsonIterate(aX, guessForT, mX1, mX2); | |
| 2244 | + if (initialSlope === 0) return guessForT; | |
| 2245 | + return binarySubdivide(aX, intervalStart, intervalStart + kSampleStepSize, mX1, mX2); | |
| 2246 | + } | |
| 2247 | + }; | |
| 2248 | + return ob; | |
| 2249 | + }(); | |
| 2250 | + var pooling = function() { | |
| 2251 | + function _double(arr) { | |
| 2252 | + return arr.concat(createSizedArray(arr.length)); | |
| 2253 | + } | |
| 2254 | + return { "double": _double }; | |
| 2255 | + }(); | |
| 2256 | + var poolFactory = function() { | |
| 2257 | + return function(initialLength, _create, _release) { | |
| 2258 | + var _length = 0; | |
| 2259 | + var _maxLength = initialLength; | |
| 2260 | + var pool = createSizedArray(_maxLength); | |
| 2261 | + var ob = { | |
| 2262 | + newElement, | |
| 2263 | + release | |
| 2264 | + }; | |
| 2265 | + function newElement() { | |
| 2266 | + var element; | |
| 2267 | + if (_length) { | |
| 2268 | + _length -= 1; | |
| 2269 | + element = pool[_length]; | |
| 2270 | + } else element = _create(); | |
| 2271 | + return element; | |
| 2272 | + } | |
| 2273 | + function release(element) { | |
| 2274 | + if (_length === _maxLength) { | |
| 2275 | + pool = pooling["double"](pool); | |
| 2276 | + _maxLength *= 2; | |
| 2277 | + } | |
| 2278 | + if (_release) _release(element); | |
| 2279 | + pool[_length] = element; | |
| 2280 | + _length += 1; | |
| 2281 | + } | |
| 2282 | + return ob; | |
| 2283 | + }; | |
| 2284 | + }(); | |
| 2285 | + var bezierLengthPool = function() { | |
| 2286 | + function create() { | |
| 2287 | + return { | |
| 2288 | + addedLength: 0, | |
| 2289 | + percents: createTypedArray("float32", getDefaultCurveSegments()), | |
| 2290 | + lengths: createTypedArray("float32", getDefaultCurveSegments()) | |
| 2291 | + }; | |
| 2292 | + } | |
| 2293 | + return poolFactory(8, create); | |
| 2294 | + }(); | |
| 2295 | + var segmentsLengthPool = function() { | |
| 2296 | + function create() { | |
| 2297 | + return { | |
| 2298 | + lengths: [], | |
| 2299 | + totalLength: 0 | |
| 2300 | + }; | |
| 2301 | + } | |
| 2302 | + function release(element) { | |
| 2303 | + var i; | |
| 2304 | + var len = element.lengths.length; | |
| 2305 | + for (i = 0; i < len; i += 1) bezierLengthPool.release(element.lengths[i]); | |
| 2306 | + element.lengths.length = 0; | |
| 2307 | + } | |
| 2308 | + return poolFactory(8, create, release); | |
| 2309 | + }(); | |
| 2310 | + function bezFunction() { | |
| 2311 | + var math = Math; | |
| 2312 | + function pointOnLine2D(x1, y1, x2, y2, x3, y3) { | |
| 2313 | + var det1 = x1 * y2 + y1 * x3 + x2 * y3 - x3 * y2 - y3 * x1 - x2 * y1; | |
| 2314 | + return det1 > -.001 && det1 < .001; | |
| 2315 | + } | |
| 2316 | + function pointOnLine3D(x1, y1, z1, x2, y2, z2, x3, y3, z3) { | |
| 2317 | + if (z1 === 0 && z2 === 0 && z3 === 0) return pointOnLine2D(x1, y1, x2, y2, x3, y3); | |
| 2318 | + var dist1 = math.sqrt(math.pow(x2 - x1, 2) + math.pow(y2 - y1, 2) + math.pow(z2 - z1, 2)); | |
| 2319 | + var dist2 = math.sqrt(math.pow(x3 - x1, 2) + math.pow(y3 - y1, 2) + math.pow(z3 - z1, 2)); | |
| 2320 | + var dist3 = math.sqrt(math.pow(x3 - x2, 2) + math.pow(y3 - y2, 2) + math.pow(z3 - z2, 2)); | |
| 2321 | + var diffDist; | |
| 2322 | + if (dist1 > dist2) if (dist1 > dist3) diffDist = dist1 - dist2 - dist3; | |
| 2323 | + else diffDist = dist3 - dist2 - dist1; | |
| 2324 | + else if (dist3 > dist2) diffDist = dist3 - dist2 - dist1; | |
| 2325 | + else diffDist = dist2 - dist1 - dist3; | |
| 2326 | + return diffDist > -1e-4 && diffDist < 1e-4; | |
| 2327 | + } | |
| 2328 | + var getBezierLength = function() { | |
| 2329 | + return function(pt1, pt2, pt3, pt4) { | |
| 2330 | + var curveSegments = getDefaultCurveSegments(); | |
| 2331 | + var k; | |
| 2332 | + var i; | |
| 2333 | + var len; | |
| 2334 | + var ptCoord; | |
| 2335 | + var perc; | |
| 2336 | + var addedLength = 0; | |
| 2337 | + var ptDistance; | |
| 2338 | + var point = []; | |
| 2339 | + var lastPoint = []; | |
| 2340 | + var lengthData = bezierLengthPool.newElement(); | |
| 2341 | + len = pt3.length; | |
| 2342 | + for (k = 0; k < curveSegments; k += 1) { | |
| 2343 | + perc = k / (curveSegments - 1); | |
| 2344 | + ptDistance = 0; | |
| 2345 | + for (i = 0; i < len; i += 1) { | |
| 2346 | + ptCoord = bmPow(1 - perc, 3) * pt1[i] + 3 * bmPow(1 - perc, 2) * perc * pt3[i] + 3 * (1 - perc) * bmPow(perc, 2) * pt4[i] + bmPow(perc, 3) * pt2[i]; | |
| 2347 | + point[i] = ptCoord; | |
| 2348 | + if (lastPoint[i] !== null) ptDistance += bmPow(point[i] - lastPoint[i], 2); | |
| 2349 | + lastPoint[i] = point[i]; | |
| 2350 | + } | |
| 2351 | + if (ptDistance) { | |
| 2352 | + ptDistance = bmSqrt(ptDistance); | |
| 2353 | + addedLength += ptDistance; | |
| 2354 | + } | |
| 2355 | + lengthData.percents[k] = perc; | |
| 2356 | + lengthData.lengths[k] = addedLength; | |
| 2357 | + } | |
| 2358 | + lengthData.addedLength = addedLength; | |
| 2359 | + return lengthData; | |
| 2360 | + }; | |
| 2361 | + }(); | |
| 2362 | + function getSegmentsLength(shapeData) { | |
| 2363 | + var segmentsLength = segmentsLengthPool.newElement(); | |
| 2364 | + var closed = shapeData.c; | |
| 2365 | + var pathV = shapeData.v; | |
| 2366 | + var pathO = shapeData.o; | |
| 2367 | + var pathI = shapeData.i; | |
| 2368 | + var i; | |
| 2369 | + var len = shapeData._length; | |
| 2370 | + var lengths = segmentsLength.lengths; | |
| 2371 | + var totalLength = 0; | |
| 2372 | + for (i = 0; i < len - 1; i += 1) { | |
| 2373 | + lengths[i] = getBezierLength(pathV[i], pathV[i + 1], pathO[i], pathI[i + 1]); | |
| 2374 | + totalLength += lengths[i].addedLength; | |
| 2375 | + } | |
| 2376 | + if (closed && len) { | |
| 2377 | + lengths[i] = getBezierLength(pathV[i], pathV[0], pathO[i], pathI[0]); | |
| 2378 | + totalLength += lengths[i].addedLength; | |
| 2379 | + } | |
| 2380 | + segmentsLength.totalLength = totalLength; | |
| 2381 | + return segmentsLength; | |
| 2382 | + } | |
| 2383 | + function BezierData(length) { | |
| 2384 | + this.segmentLength = 0; | |
| 2385 | + this.points = new Array(length); | |
| 2386 | + } | |
| 2387 | + function PointData(partial, point) { | |
| 2388 | + this.partialLength = partial; | |
| 2389 | + this.point = point; | |
| 2390 | + } | |
| 2391 | + var buildBezierData = function() { | |
| 2392 | + var storedData = {}; | |
| 2393 | + return function(pt1, pt2, pt3, pt4) { | |
| 2394 | + var bezierName = (pt1[0] + "_" + pt1[1] + "_" + pt2[0] + "_" + pt2[1] + "_" + pt3[0] + "_" + pt3[1] + "_" + pt4[0] + "_" + pt4[1]).replace(/\./g, "p"); | |
| 2395 | + if (!storedData[bezierName]) { | |
| 2396 | + var curveSegments = getDefaultCurveSegments(); | |
| 2397 | + var k; | |
| 2398 | + var i; | |
| 2399 | + var len; | |
| 2400 | + var ptCoord; | |
| 2401 | + var perc; | |
| 2402 | + var addedLength = 0; | |
| 2403 | + var ptDistance; | |
| 2404 | + var point; | |
| 2405 | + var lastPoint = null; | |
| 2406 | + if (pt1.length === 2 && (pt1[0] !== pt2[0] || pt1[1] !== pt2[1]) && pointOnLine2D(pt1[0], pt1[1], pt2[0], pt2[1], pt1[0] + pt3[0], pt1[1] + pt3[1]) && pointOnLine2D(pt1[0], pt1[1], pt2[0], pt2[1], pt2[0] + pt4[0], pt2[1] + pt4[1])) curveSegments = 2; | |
| 2407 | + var bezierData = new BezierData(curveSegments); | |
| 2408 | + len = pt3.length; | |
| 2409 | + for (k = 0; k < curveSegments; k += 1) { | |
| 2410 | + point = createSizedArray(len); | |
| 2411 | + perc = k / (curveSegments - 1); | |
| 2412 | + ptDistance = 0; | |
| 2413 | + for (i = 0; i < len; i += 1) { | |
| 2414 | + ptCoord = bmPow(1 - perc, 3) * pt1[i] + 3 * bmPow(1 - perc, 2) * perc * (pt1[i] + pt3[i]) + 3 * (1 - perc) * bmPow(perc, 2) * (pt2[i] + pt4[i]) + bmPow(perc, 3) * pt2[i]; | |
| 2415 | + point[i] = ptCoord; | |
| 2416 | + if (lastPoint !== null) ptDistance += bmPow(point[i] - lastPoint[i], 2); | |
| 2417 | + } | |
| 2418 | + ptDistance = bmSqrt(ptDistance); | |
| 2419 | + addedLength += ptDistance; | |
| 2420 | + bezierData.points[k] = new PointData(ptDistance, point); | |
| 2421 | + lastPoint = point; | |
| 2422 | + } | |
| 2423 | + bezierData.segmentLength = addedLength; | |
| 2424 | + storedData[bezierName] = bezierData; | |
| 2425 | + } | |
| 2426 | + return storedData[bezierName]; | |
| 2427 | + }; | |
| 2428 | + }(); | |
| 2429 | + function getDistancePerc(perc, bezierData) { | |
| 2430 | + var percents = bezierData.percents; | |
| 2431 | + var lengths = bezierData.lengths; | |
| 2432 | + var len = percents.length; | |
| 2433 | + var initPos = bmFloor((len - 1) * perc); | |
| 2434 | + var lengthPos = perc * bezierData.addedLength; | |
| 2435 | + var lPerc = 0; | |
| 2436 | + if (initPos === len - 1 || initPos === 0 || lengthPos === lengths[initPos]) return percents[initPos]; | |
| 2437 | + var dir = lengths[initPos] > lengthPos ? -1 : 1; | |
| 2438 | + var flag = true; | |
| 2439 | + while (flag) { | |
| 2440 | + if (lengths[initPos] <= lengthPos && lengths[initPos + 1] > lengthPos) { | |
| 2441 | + lPerc = (lengthPos - lengths[initPos]) / (lengths[initPos + 1] - lengths[initPos]); | |
| 2442 | + flag = false; | |
| 2443 | + } else initPos += dir; | |
| 2444 | + if (initPos < 0 || initPos >= len - 1) { | |
| 2445 | + if (initPos === len - 1) return percents[initPos]; | |
| 2446 | + flag = false; | |
| 2447 | + } | |
| 2448 | + } | |
| 2449 | + return percents[initPos] + (percents[initPos + 1] - percents[initPos]) * lPerc; | |
| 2450 | + } | |
| 2451 | + function getPointInSegment(pt1, pt2, pt3, pt4, percent, bezierData) { | |
| 2452 | + var t1 = getDistancePerc(percent, bezierData); | |
| 2453 | + var u1 = 1 - t1; | |
| 2454 | + return [math.round((u1 * u1 * u1 * pt1[0] + (t1 * u1 * u1 + u1 * t1 * u1 + u1 * u1 * t1) * pt3[0] + (t1 * t1 * u1 + u1 * t1 * t1 + t1 * u1 * t1) * pt4[0] + t1 * t1 * t1 * pt2[0]) * 1e3) / 1e3, math.round((u1 * u1 * u1 * pt1[1] + (t1 * u1 * u1 + u1 * t1 * u1 + u1 * u1 * t1) * pt3[1] + (t1 * t1 * u1 + u1 * t1 * t1 + t1 * u1 * t1) * pt4[1] + t1 * t1 * t1 * pt2[1]) * 1e3) / 1e3]; | |
| 2455 | + } | |
| 2456 | + var bezierSegmentPoints = createTypedArray("float32", 8); | |
| 2457 | + function getNewSegment(pt1, pt2, pt3, pt4, startPerc, endPerc, bezierData) { | |
| 2458 | + if (startPerc < 0) startPerc = 0; | |
| 2459 | + else if (startPerc > 1) startPerc = 1; | |
| 2460 | + var t0 = getDistancePerc(startPerc, bezierData); | |
| 2461 | + endPerc = endPerc > 1 ? 1 : endPerc; | |
| 2462 | + var t1 = getDistancePerc(endPerc, bezierData); | |
| 2463 | + var i; | |
| 2464 | + var len = pt1.length; | |
| 2465 | + var u0 = 1 - t0; | |
| 2466 | + var u1 = 1 - t1; | |
| 2467 | + var u0u0u0 = u0 * u0 * u0; | |
| 2468 | + var t0u0u0_3 = t0 * u0 * u0 * 3; | |
| 2469 | + var t0t0u0_3 = t0 * t0 * u0 * 3; | |
| 2470 | + var t0t0t0 = t0 * t0 * t0; | |
| 2471 | + var u0u0u1 = u0 * u0 * u1; | |
| 2472 | + var t0u0u1_3 = t0 * u0 * u1 + u0 * t0 * u1 + u0 * u0 * t1; | |
| 2473 | + var t0t0u1_3 = t0 * t0 * u1 + u0 * t0 * t1 + t0 * u0 * t1; | |
| 2474 | + var t0t0t1 = t0 * t0 * t1; | |
| 2475 | + var u0u1u1 = u0 * u1 * u1; | |
| 2476 | + var t0u1u1_3 = t0 * u1 * u1 + u0 * t1 * u1 + u0 * u1 * t1; | |
| 2477 | + var t0t1u1_3 = t0 * t1 * u1 + u0 * t1 * t1 + t0 * u1 * t1; | |
| 2478 | + var t0t1t1 = t0 * t1 * t1; | |
| 2479 | + var u1u1u1 = u1 * u1 * u1; | |
| 2480 | + var t1u1u1_3 = t1 * u1 * u1 + u1 * t1 * u1 + u1 * u1 * t1; | |
| 2481 | + var t1t1u1_3 = t1 * t1 * u1 + u1 * t1 * t1 + t1 * u1 * t1; | |
| 2482 | + var t1t1t1 = t1 * t1 * t1; | |
| 2483 | + for (i = 0; i < len; i += 1) { | |
| 2484 | + bezierSegmentPoints[i * 4] = math.round((u0u0u0 * pt1[i] + t0u0u0_3 * pt3[i] + t0t0u0_3 * pt4[i] + t0t0t0 * pt2[i]) * 1e3) / 1e3; | |
| 2485 | + bezierSegmentPoints[i * 4 + 1] = math.round((u0u0u1 * pt1[i] + t0u0u1_3 * pt3[i] + t0t0u1_3 * pt4[i] + t0t0t1 * pt2[i]) * 1e3) / 1e3; | |
| 2486 | + bezierSegmentPoints[i * 4 + 2] = math.round((u0u1u1 * pt1[i] + t0u1u1_3 * pt3[i] + t0t1u1_3 * pt4[i] + t0t1t1 * pt2[i]) * 1e3) / 1e3; | |
| 2487 | + bezierSegmentPoints[i * 4 + 3] = math.round((u1u1u1 * pt1[i] + t1u1u1_3 * pt3[i] + t1t1u1_3 * pt4[i] + t1t1t1 * pt2[i]) * 1e3) / 1e3; | |
| 2488 | + } | |
| 2489 | + return bezierSegmentPoints; | |
| 2490 | + } | |
| 2491 | + return { | |
| 2492 | + getSegmentsLength, | |
| 2493 | + getNewSegment, | |
| 2494 | + getPointInSegment, | |
| 2495 | + buildBezierData, | |
| 2496 | + pointOnLine2D, | |
| 2497 | + pointOnLine3D | |
| 2498 | + }; | |
| 2499 | + } | |
| 2500 | + var bez = bezFunction(); | |
| 2501 | + var initFrame = initialDefaultFrame; | |
| 2502 | + var mathAbs = Math.abs; | |
| 2503 | + function interpolateValue(frameNum, caching) { | |
| 2504 | + var offsetTime = this.offsetTime; | |
| 2505 | + var newValue; | |
| 2506 | + if (this.propType === "multidimensional") newValue = createTypedArray("float32", this.pv.length); | |
| 2507 | + var iterationIndex = caching.lastIndex; | |
| 2508 | + var i = iterationIndex; | |
| 2509 | + var len = this.keyframes.length - 1; | |
| 2510 | + var flag = true; | |
| 2511 | + var keyData; | |
| 2512 | + var nextKeyData; | |
| 2513 | + var keyframeMetadata; | |
| 2514 | + while (flag) { | |
| 2515 | + keyData = this.keyframes[i]; | |
| 2516 | + nextKeyData = this.keyframes[i + 1]; | |
| 2517 | + if (i === len - 1 && frameNum >= nextKeyData.t - offsetTime) { | |
| 2518 | + if (keyData.h) keyData = nextKeyData; | |
| 2519 | + iterationIndex = 0; | |
| 2520 | + break; | |
| 2521 | + } | |
| 2522 | + if (nextKeyData.t - offsetTime > frameNum) { | |
| 2523 | + iterationIndex = i; | |
| 2524 | + break; | |
| 2525 | + } | |
| 2526 | + if (i < len - 1) i += 1; | |
| 2527 | + else { | |
| 2528 | + iterationIndex = 0; | |
| 2529 | + flag = false; | |
| 2530 | + } | |
| 2531 | + } | |
| 2532 | + keyframeMetadata = this.keyframesMetadata[i] || {}; | |
| 2533 | + var k; | |
| 2534 | + var kLen; | |
| 2535 | + var perc; | |
| 2536 | + var jLen; | |
| 2537 | + var j; | |
| 2538 | + var fnc; | |
| 2539 | + var nextKeyTime = nextKeyData.t - offsetTime; | |
| 2540 | + var keyTime = keyData.t - offsetTime; | |
| 2541 | + var endValue; | |
| 2542 | + if (keyData.to) { | |
| 2543 | + if (!keyframeMetadata.bezierData) keyframeMetadata.bezierData = bez.buildBezierData(keyData.s, nextKeyData.s || keyData.e, keyData.to, keyData.ti); | |
| 2544 | + var bezierData = keyframeMetadata.bezierData; | |
| 2545 | + if (frameNum >= nextKeyTime || frameNum < keyTime) { | |
| 2546 | + var ind = frameNum >= nextKeyTime ? bezierData.points.length - 1 : 0; | |
| 2547 | + kLen = bezierData.points[ind].point.length; | |
| 2548 | + for (k = 0; k < kLen; k += 1) newValue[k] = bezierData.points[ind].point[k]; | |
| 2549 | + } else { | |
| 2550 | + if (keyframeMetadata.__fnct) fnc = keyframeMetadata.__fnct; | |
| 2551 | + else { | |
| 2552 | + fnc = BezierFactory.getBezierEasing(keyData.o.x, keyData.o.y, keyData.i.x, keyData.i.y, keyData.n).get; | |
| 2553 | + keyframeMetadata.__fnct = fnc; | |
| 2554 | + } | |
| 2555 | + perc = fnc((frameNum - keyTime) / (nextKeyTime - keyTime)); | |
| 2556 | + var distanceInLine = bezierData.segmentLength * perc; | |
| 2557 | + var segmentPerc; | |
| 2558 | + var addedLength = caching.lastFrame < frameNum && caching._lastKeyframeIndex === i ? caching._lastAddedLength : 0; | |
| 2559 | + j = caching.lastFrame < frameNum && caching._lastKeyframeIndex === i ? caching._lastPoint : 0; | |
| 2560 | + flag = true; | |
| 2561 | + jLen = bezierData.points.length; | |
| 2562 | + while (flag) { | |
| 2563 | + addedLength += bezierData.points[j].partialLength; | |
| 2564 | + if (distanceInLine === 0 || perc === 0 || j === bezierData.points.length - 1) { | |
| 2565 | + kLen = bezierData.points[j].point.length; | |
| 2566 | + for (k = 0; k < kLen; k += 1) newValue[k] = bezierData.points[j].point[k]; | |
| 2567 | + break; | |
| 2568 | + } else if (distanceInLine >= addedLength && distanceInLine < addedLength + bezierData.points[j + 1].partialLength) { | |
| 2569 | + segmentPerc = (distanceInLine - addedLength) / bezierData.points[j + 1].partialLength; | |
| 2570 | + kLen = bezierData.points[j].point.length; | |
| 2571 | + for (k = 0; k < kLen; k += 1) newValue[k] = bezierData.points[j].point[k] + (bezierData.points[j + 1].point[k] - bezierData.points[j].point[k]) * segmentPerc; | |
| 2572 | + break; | |
| 2573 | + } | |
| 2574 | + if (j < jLen - 1) j += 1; | |
| 2575 | + else flag = false; | |
| 2576 | + } | |
| 2577 | + caching._lastPoint = j; | |
| 2578 | + caching._lastAddedLength = addedLength - bezierData.points[j].partialLength; | |
| 2579 | + caching._lastKeyframeIndex = i; | |
| 2580 | + } | |
| 2581 | + } else { | |
| 2582 | + var outX; | |
| 2583 | + var outY; | |
| 2584 | + var inX; | |
| 2585 | + var inY; | |
| 2586 | + var keyValue; | |
| 2587 | + len = keyData.s.length; | |
| 2588 | + endValue = nextKeyData.s || keyData.e; | |
| 2589 | + if (this.sh && keyData.h !== 1) if (frameNum >= nextKeyTime) { | |
| 2590 | + newValue[0] = endValue[0]; | |
| 2591 | + newValue[1] = endValue[1]; | |
| 2592 | + newValue[2] = endValue[2]; | |
| 2593 | + } else if (frameNum <= keyTime) { | |
| 2594 | + newValue[0] = keyData.s[0]; | |
| 2595 | + newValue[1] = keyData.s[1]; | |
| 2596 | + newValue[2] = keyData.s[2]; | |
| 2597 | + } else { | |
| 2598 | + var quatStart = createQuaternion(keyData.s); | |
| 2599 | + var quatEnd = createQuaternion(endValue); | |
| 2600 | + var time = (frameNum - keyTime) / (nextKeyTime - keyTime); | |
| 2601 | + quaternionToEuler(newValue, slerp(quatStart, quatEnd, time)); | |
| 2602 | + } | |
| 2603 | + else for (i = 0; i < len; i += 1) { | |
| 2604 | + if (keyData.h !== 1) if (frameNum >= nextKeyTime) perc = 1; | |
| 2605 | + else if (frameNum < keyTime) perc = 0; | |
| 2606 | + else { | |
| 2607 | + if (keyData.o.x.constructor === Array) { | |
| 2608 | + if (!keyframeMetadata.__fnct) keyframeMetadata.__fnct = []; | |
| 2609 | + if (!keyframeMetadata.__fnct[i]) { | |
| 2610 | + outX = keyData.o.x[i] === void 0 ? keyData.o.x[0] : keyData.o.x[i]; | |
| 2611 | + outY = keyData.o.y[i] === void 0 ? keyData.o.y[0] : keyData.o.y[i]; | |
| 2612 | + inX = keyData.i.x[i] === void 0 ? keyData.i.x[0] : keyData.i.x[i]; | |
| 2613 | + inY = keyData.i.y[i] === void 0 ? keyData.i.y[0] : keyData.i.y[i]; | |
| 2614 | + fnc = BezierFactory.getBezierEasing(outX, outY, inX, inY).get; | |
| 2615 | + keyframeMetadata.__fnct[i] = fnc; | |
| 2616 | + } else fnc = keyframeMetadata.__fnct[i]; | |
| 2617 | + } else if (!keyframeMetadata.__fnct) { | |
| 2618 | + outX = keyData.o.x; | |
| 2619 | + outY = keyData.o.y; | |
| 2620 | + inX = keyData.i.x; | |
| 2621 | + inY = keyData.i.y; | |
| 2622 | + fnc = BezierFactory.getBezierEasing(outX, outY, inX, inY).get; | |
| 2623 | + keyData.keyframeMetadata = fnc; | |
| 2624 | + } else fnc = keyframeMetadata.__fnct; | |
| 2625 | + perc = fnc((frameNum - keyTime) / (nextKeyTime - keyTime)); | |
| 2626 | + } | |
| 2627 | + endValue = nextKeyData.s || keyData.e; | |
| 2628 | + keyValue = keyData.h === 1 ? keyData.s[i] : keyData.s[i] + (endValue[i] - keyData.s[i]) * perc; | |
| 2629 | + if (this.propType === "multidimensional") newValue[i] = keyValue; | |
| 2630 | + else newValue = keyValue; | |
| 2631 | + } | |
| 2632 | + } | |
| 2633 | + caching.lastIndex = iterationIndex; | |
| 2634 | + return newValue; | |
| 2635 | + } | |
| 2636 | + function slerp(a, b, t) { | |
| 2637 | + var out = []; | |
| 2638 | + var ax = a[0]; | |
| 2639 | + var ay = a[1]; | |
| 2640 | + var az = a[2]; | |
| 2641 | + var aw = a[3]; | |
| 2642 | + var bx = b[0]; | |
| 2643 | + var by = b[1]; | |
| 2644 | + var bz = b[2]; | |
| 2645 | + var bw = b[3]; | |
| 2646 | + var omega; | |
| 2647 | + var cosom; | |
| 2648 | + var sinom; | |
| 2649 | + var scale0; | |
| 2650 | + var scale1; | |
| 2651 | + cosom = ax * bx + ay * by + az * bz + aw * bw; | |
| 2652 | + if (cosom < 0) { | |
| 2653 | + cosom = -cosom; | |
| 2654 | + bx = -bx; | |
| 2655 | + by = -by; | |
| 2656 | + bz = -bz; | |
| 2657 | + bw = -bw; | |
| 2658 | + } | |
| 2659 | + if (1 - cosom > 1e-6) { | |
| 2660 | + omega = Math.acos(cosom); | |
| 2661 | + sinom = Math.sin(omega); | |
| 2662 | + scale0 = Math.sin((1 - t) * omega) / sinom; | |
| 2663 | + scale1 = Math.sin(t * omega) / sinom; | |
| 2664 | + } else { | |
| 2665 | + scale0 = 1 - t; | |
| 2666 | + scale1 = t; | |
| 2667 | + } | |
| 2668 | + out[0] = scale0 * ax + scale1 * bx; | |
| 2669 | + out[1] = scale0 * ay + scale1 * by; | |
| 2670 | + out[2] = scale0 * az + scale1 * bz; | |
| 2671 | + out[3] = scale0 * aw + scale1 * bw; | |
| 2672 | + return out; | |
| 2673 | + } | |
| 2674 | + function quaternionToEuler(out, quat) { | |
| 2675 | + var qx = quat[0]; | |
| 2676 | + var qy = quat[1]; | |
| 2677 | + var qz = quat[2]; | |
| 2678 | + var qw = quat[3]; | |
| 2679 | + var heading = Math.atan2(2 * qy * qw - 2 * qx * qz, 1 - 2 * qy * qy - 2 * qz * qz); | |
| 2680 | + var attitude = Math.asin(2 * qx * qy + 2 * qz * qw); | |
| 2681 | + var bank = Math.atan2(2 * qx * qw - 2 * qy * qz, 1 - 2 * qx * qx - 2 * qz * qz); | |
| 2682 | + out[0] = heading / degToRads; | |
| 2683 | + out[1] = attitude / degToRads; | |
| 2684 | + out[2] = bank / degToRads; | |
| 2685 | + } | |
| 2686 | + function createQuaternion(values) { | |
| 2687 | + var heading = values[0] * degToRads; | |
| 2688 | + var attitude = values[1] * degToRads; | |
| 2689 | + var bank = values[2] * degToRads; | |
| 2690 | + var c1 = Math.cos(heading / 2); | |
| 2691 | + var c2 = Math.cos(attitude / 2); | |
| 2692 | + var c3 = Math.cos(bank / 2); | |
| 2693 | + var s1 = Math.sin(heading / 2); | |
| 2694 | + var s2 = Math.sin(attitude / 2); | |
| 2695 | + var s3 = Math.sin(bank / 2); | |
| 2696 | + var w = c1 * c2 * c3 - s1 * s2 * s3; | |
| 2697 | + return [ | |
| 2698 | + s1 * s2 * c3 + c1 * c2 * s3, | |
| 2699 | + s1 * c2 * c3 + c1 * s2 * s3, | |
| 2700 | + c1 * s2 * c3 - s1 * c2 * s3, | |
| 2701 | + w | |
| 2702 | + ]; | |
| 2703 | + } | |
| 2704 | + function getValueAtCurrentTime() { | |
| 2705 | + var frameNum = this.comp.renderedFrame - this.offsetTime; | |
| 2706 | + var initTime = this.keyframes[0].t - this.offsetTime; | |
| 2707 | + var endTime = this.keyframes[this.keyframes.length - 1].t - this.offsetTime; | |
| 2708 | + if (!(frameNum === this._caching.lastFrame || this._caching.lastFrame !== initFrame && (this._caching.lastFrame >= endTime && frameNum >= endTime || this._caching.lastFrame < initTime && frameNum < initTime))) { | |
| 2709 | + if (this._caching.lastFrame >= frameNum) { | |
| 2710 | + this._caching._lastKeyframeIndex = -1; | |
| 2711 | + this._caching.lastIndex = 0; | |
| 2712 | + } | |
| 2713 | + var renderResult = this.interpolateValue(frameNum, this._caching); | |
| 2714 | + this.pv = renderResult; | |
| 2715 | + } | |
| 2716 | + this._caching.lastFrame = frameNum; | |
| 2717 | + return this.pv; | |
| 2718 | + } | |
| 2719 | + function setVValue(val) { | |
| 2720 | + var multipliedValue; | |
| 2721 | + if (this.propType === "unidimensional") { | |
| 2722 | + multipliedValue = val * this.mult; | |
| 2723 | + if (mathAbs(this.v - multipliedValue) > 1e-5) { | |
| 2724 | + this.v = multipliedValue; | |
| 2725 | + this._mdf = true; | |
| 2726 | + } | |
| 2727 | + } else { | |
| 2728 | + var i = 0; | |
| 2729 | + var len = this.v.length; | |
| 2730 | + while (i < len) { | |
| 2731 | + multipliedValue = val[i] * this.mult; | |
| 2732 | + if (mathAbs(this.v[i] - multipliedValue) > 1e-5) { | |
| 2733 | + this.v[i] = multipliedValue; | |
| 2734 | + this._mdf = true; | |
| 2735 | + } | |
| 2736 | + i += 1; | |
| 2737 | + } | |
| 2738 | + } | |
| 2739 | + } | |
| 2740 | + function processEffectsSequence() { | |
| 2741 | + if (this.elem.globalData.frameId === this.frameId || !this.effectsSequence.length) return; | |
| 2742 | + if (this.lock) { | |
| 2743 | + this.setVValue(this.pv); | |
| 2744 | + return; | |
| 2745 | + } | |
| 2746 | + this.lock = true; | |
| 2747 | + this._mdf = this._isFirstFrame; | |
| 2748 | + var i; | |
| 2749 | + var len = this.effectsSequence.length; | |
| 2750 | + var finalValue = this.kf ? this.pv : this.data.k; | |
| 2751 | + for (i = 0; i < len; i += 1) finalValue = this.effectsSequence[i](finalValue); | |
| 2752 | + this.setVValue(finalValue); | |
| 2753 | + this._isFirstFrame = false; | |
| 2754 | + this.lock = false; | |
| 2755 | + this.frameId = this.elem.globalData.frameId; | |
| 2756 | + } | |
| 2757 | + function addEffect(effectFunction) { | |
| 2758 | + this.effectsSequence.push(effectFunction); | |
| 2759 | + this.container.addDynamicProperty(this); | |
| 2760 | + } | |
| 2761 | + function ValueProperty(elem, data, mult, container) { | |
| 2762 | + this.propType = "unidimensional"; | |
| 2763 | + this.mult = mult || 1; | |
| 2764 | + this.data = data; | |
| 2765 | + this.v = mult ? data.k * mult : data.k; | |
| 2766 | + this.pv = data.k; | |
| 2767 | + this._mdf = false; | |
| 2768 | + this.elem = elem; | |
| 2769 | + this.container = container; | |
| 2770 | + this.comp = elem.comp; | |
| 2771 | + this.k = false; | |
| 2772 | + this.kf = false; | |
| 2773 | + this.vel = 0; | |
| 2774 | + this.effectsSequence = []; | |
| 2775 | + this._isFirstFrame = true; | |
| 2776 | + this.getValue = processEffectsSequence; | |
| 2777 | + this.setVValue = setVValue; | |
| 2778 | + this.addEffect = addEffect; | |
| 2779 | + } | |
| 2780 | + function MultiDimensionalProperty(elem, data, mult, container) { | |
| 2781 | + this.propType = "multidimensional"; | |
| 2782 | + this.mult = mult || 1; | |
| 2783 | + this.data = data; | |
| 2784 | + this._mdf = false; | |
| 2785 | + this.elem = elem; | |
| 2786 | + this.container = container; | |
| 2787 | + this.comp = elem.comp; | |
| 2788 | + this.k = false; | |
| 2789 | + this.kf = false; | |
| 2790 | + this.frameId = -1; | |
| 2791 | + var i; | |
| 2792 | + var len = data.k.length; | |
| 2793 | + this.v = createTypedArray("float32", len); | |
| 2794 | + this.pv = createTypedArray("float32", len); | |
| 2795 | + this.vel = createTypedArray("float32", len); | |
| 2796 | + for (i = 0; i < len; i += 1) { | |
| 2797 | + this.v[i] = data.k[i] * this.mult; | |
| 2798 | + this.pv[i] = data.k[i]; | |
| 2799 | + } | |
| 2800 | + this._isFirstFrame = true; | |
| 2801 | + this.effectsSequence = []; | |
| 2802 | + this.getValue = processEffectsSequence; | |
| 2803 | + this.setVValue = setVValue; | |
| 2804 | + this.addEffect = addEffect; | |
| 2805 | + } | |
| 2806 | + function KeyframedValueProperty(elem, data, mult, container) { | |
| 2807 | + this.propType = "unidimensional"; | |
| 2808 | + this.keyframes = data.k; | |
| 2809 | + this.keyframesMetadata = []; | |
| 2810 | + this.offsetTime = elem.data.st; | |
| 2811 | + this.frameId = -1; | |
| 2812 | + this._caching = { | |
| 2813 | + lastFrame: initFrame, | |
| 2814 | + lastIndex: 0, | |
| 2815 | + value: 0, | |
| 2816 | + _lastKeyframeIndex: -1 | |
| 2817 | + }; | |
| 2818 | + this.k = true; | |
| 2819 | + this.kf = true; | |
| 2820 | + this.data = data; | |
| 2821 | + this.mult = mult || 1; | |
| 2822 | + this.elem = elem; | |
| 2823 | + this.container = container; | |
| 2824 | + this.comp = elem.comp; | |
| 2825 | + this.v = initFrame; | |
| 2826 | + this.pv = initFrame; | |
| 2827 | + this._isFirstFrame = true; | |
| 2828 | + this.getValue = processEffectsSequence; | |
| 2829 | + this.setVValue = setVValue; | |
| 2830 | + this.interpolateValue = interpolateValue; | |
| 2831 | + this.effectsSequence = [getValueAtCurrentTime.bind(this)]; | |
| 2832 | + this.addEffect = addEffect; | |
| 2833 | + } | |
| 2834 | + function KeyframedMultidimensionalProperty(elem, data, mult, container) { | |
| 2835 | + this.propType = "multidimensional"; | |
| 2836 | + var i; | |
| 2837 | + var len = data.k.length; | |
| 2838 | + var s; | |
| 2839 | + var e; | |
| 2840 | + var to; | |
| 2841 | + var ti; | |
| 2842 | + for (i = 0; i < len - 1; i += 1) if (data.k[i].to && data.k[i].s && data.k[i + 1] && data.k[i + 1].s) { | |
| 2843 | + s = data.k[i].s; | |
| 2844 | + e = data.k[i + 1].s; | |
| 2845 | + to = data.k[i].to; | |
| 2846 | + ti = data.k[i].ti; | |
| 2847 | + if (s.length === 2 && !(s[0] === e[0] && s[1] === e[1]) && bez.pointOnLine2D(s[0], s[1], e[0], e[1], s[0] + to[0], s[1] + to[1]) && bez.pointOnLine2D(s[0], s[1], e[0], e[1], e[0] + ti[0], e[1] + ti[1]) || s.length === 3 && !(s[0] === e[0] && s[1] === e[1] && s[2] === e[2]) && bez.pointOnLine3D(s[0], s[1], s[2], e[0], e[1], e[2], s[0] + to[0], s[1] + to[1], s[2] + to[2]) && bez.pointOnLine3D(s[0], s[1], s[2], e[0], e[1], e[2], e[0] + ti[0], e[1] + ti[1], e[2] + ti[2])) { | |
| 2848 | + data.k[i].to = null; | |
| 2849 | + data.k[i].ti = null; | |
| 2850 | + } | |
| 2851 | + if (s[0] === e[0] && s[1] === e[1] && to[0] === 0 && to[1] === 0 && ti[0] === 0 && ti[1] === 0) { | |
| 2852 | + if (s.length === 2 || s[2] === e[2] && to[2] === 0 && ti[2] === 0) { | |
| 2853 | + data.k[i].to = null; | |
| 2854 | + data.k[i].ti = null; | |
| 2855 | + } | |
| 2856 | + } | |
| 2857 | + } | |
| 2858 | + this.effectsSequence = [getValueAtCurrentTime.bind(this)]; | |
| 2859 | + this.data = data; | |
| 2860 | + this.keyframes = data.k; | |
| 2861 | + this.keyframesMetadata = []; | |
| 2862 | + this.offsetTime = elem.data.st; | |
| 2863 | + this.k = true; | |
| 2864 | + this.kf = true; | |
| 2865 | + this._isFirstFrame = true; | |
| 2866 | + this.mult = mult || 1; | |
| 2867 | + this.elem = elem; | |
| 2868 | + this.container = container; | |
| 2869 | + this.comp = elem.comp; | |
| 2870 | + this.getValue = processEffectsSequence; | |
| 2871 | + this.setVValue = setVValue; | |
| 2872 | + this.interpolateValue = interpolateValue; | |
| 2873 | + this.frameId = -1; | |
| 2874 | + var arrLen = data.k[0].s.length; | |
| 2875 | + this.v = createTypedArray("float32", arrLen); | |
| 2876 | + this.pv = createTypedArray("float32", arrLen); | |
| 2877 | + for (i = 0; i < arrLen; i += 1) { | |
| 2878 | + this.v[i] = initFrame; | |
| 2879 | + this.pv[i] = initFrame; | |
| 2880 | + } | |
| 2881 | + this._caching = { | |
| 2882 | + lastFrame: initFrame, | |
| 2883 | + lastIndex: 0, | |
| 2884 | + value: createTypedArray("float32", arrLen) | |
| 2885 | + }; | |
| 2886 | + this.addEffect = addEffect; | |
| 2887 | + } | |
| 2888 | + var PropertyFactory = function() { | |
| 2889 | + function getProp(elem, data, type, mult, container) { | |
| 2890 | + if (data.sid) data = elem.globalData.slotManager.getProp(data); | |
| 2891 | + var p; | |
| 2892 | + if (!data.k.length) p = new ValueProperty(elem, data, mult, container); | |
| 2893 | + else if (typeof data.k[0] === "number") p = new MultiDimensionalProperty(elem, data, mult, container); | |
| 2894 | + else switch (type) { | |
| 2895 | + case 0: | |
| 2896 | + p = new KeyframedValueProperty(elem, data, mult, container); | |
| 2897 | + break; | |
| 2898 | + case 1: | |
| 2899 | + p = new KeyframedMultidimensionalProperty(elem, data, mult, container); | |
| 2900 | + break; | |
| 2901 | + default: break; | |
| 2902 | + } | |
| 2903 | + if (p.effectsSequence.length) container.addDynamicProperty(p); | |
| 2904 | + return p; | |
| 2905 | + } | |
| 2906 | + return { getProp }; | |
| 2907 | + }(); | |
| 2908 | + function DynamicPropertyContainer() {} | |
| 2909 | + DynamicPropertyContainer.prototype = { | |
| 2910 | + addDynamicProperty: function addDynamicProperty(prop) { | |
| 2911 | + if (this.dynamicProperties.indexOf(prop) === -1) { | |
| 2912 | + this.dynamicProperties.push(prop); | |
| 2913 | + this.container.addDynamicProperty(this); | |
| 2914 | + this._isAnimated = true; | |
| 2915 | + } | |
| 2916 | + }, | |
| 2917 | + iterateDynamicProperties: function iterateDynamicProperties() { | |
| 2918 | + this._mdf = false; | |
| 2919 | + var i; | |
| 2920 | + var len = this.dynamicProperties.length; | |
| 2921 | + for (i = 0; i < len; i += 1) { | |
| 2922 | + this.dynamicProperties[i].getValue(); | |
| 2923 | + if (this.dynamicProperties[i]._mdf) this._mdf = true; | |
| 2924 | + } | |
| 2925 | + }, | |
| 2926 | + initDynamicPropertyContainer: function initDynamicPropertyContainer(container) { | |
| 2927 | + this.container = container; | |
| 2928 | + this.dynamicProperties = []; | |
| 2929 | + this._mdf = false; | |
| 2930 | + this._isAnimated = false; | |
| 2931 | + } | |
| 2932 | + }; | |
| 2933 | + var pointPool = function() { | |
| 2934 | + function create() { | |
| 2935 | + return createTypedArray("float32", 2); | |
| 2936 | + } | |
| 2937 | + return poolFactory(8, create); | |
| 2938 | + }(); | |
| 2939 | + function ShapePath() { | |
| 2940 | + this.c = false; | |
| 2941 | + this._length = 0; | |
| 2942 | + this._maxLength = 8; | |
| 2943 | + this.v = createSizedArray(this._maxLength); | |
| 2944 | + this.o = createSizedArray(this._maxLength); | |
| 2945 | + this.i = createSizedArray(this._maxLength); | |
| 2946 | + } | |
| 2947 | + ShapePath.prototype.setPathData = function(closed, len) { | |
| 2948 | + this.c = closed; | |
| 2949 | + this.setLength(len); | |
| 2950 | + var i = 0; | |
| 2951 | + while (i < len) { | |
| 2952 | + this.v[i] = pointPool.newElement(); | |
| 2953 | + this.o[i] = pointPool.newElement(); | |
| 2954 | + this.i[i] = pointPool.newElement(); | |
| 2955 | + i += 1; | |
| 2956 | + } | |
| 2957 | + }; | |
| 2958 | + ShapePath.prototype.setLength = function(len) { | |
| 2959 | + while (this._maxLength < len) this.doubleArrayLength(); | |
| 2960 | + this._length = len; | |
| 2961 | + }; | |
| 2962 | + ShapePath.prototype.doubleArrayLength = function() { | |
| 2963 | + this.v = this.v.concat(createSizedArray(this._maxLength)); | |
| 2964 | + this.i = this.i.concat(createSizedArray(this._maxLength)); | |
| 2965 | + this.o = this.o.concat(createSizedArray(this._maxLength)); | |
| 2966 | + this._maxLength *= 2; | |
| 2967 | + }; | |
| 2968 | + ShapePath.prototype.setXYAt = function(x, y, type, pos, replace) { | |
| 2969 | + var arr; | |
| 2970 | + this._length = Math.max(this._length, pos + 1); | |
| 2971 | + if (this._length >= this._maxLength) this.doubleArrayLength(); | |
| 2972 | + switch (type) { | |
| 2973 | + case "v": | |
| 2974 | + arr = this.v; | |
| 2975 | + break; | |
| 2976 | + case "i": | |
| 2977 | + arr = this.i; | |
| 2978 | + break; | |
| 2979 | + case "o": | |
| 2980 | + arr = this.o; | |
| 2981 | + break; | |
| 2982 | + default: | |
| 2983 | + arr = []; | |
| 2984 | + break; | |
| 2985 | + } | |
| 2986 | + if (!arr[pos] || arr[pos] && !replace) arr[pos] = pointPool.newElement(); | |
| 2987 | + arr[pos][0] = x; | |
| 2988 | + arr[pos][1] = y; | |
| 2989 | + }; | |
| 2990 | + ShapePath.prototype.setTripleAt = function(vX, vY, oX, oY, iX, iY, pos, replace) { | |
| 2991 | + this.setXYAt(vX, vY, "v", pos, replace); | |
| 2992 | + this.setXYAt(oX, oY, "o", pos, replace); | |
| 2993 | + this.setXYAt(iX, iY, "i", pos, replace); | |
| 2994 | + }; | |
| 2995 | + ShapePath.prototype.reverse = function() { | |
| 2996 | + var newPath = new ShapePath(); | |
| 2997 | + newPath.setPathData(this.c, this._length); | |
| 2998 | + var vertices = this.v; | |
| 2999 | + var outPoints = this.o; | |
| 3000 | + var inPoints = this.i; | |
| 3001 | + var init = 0; | |
| 3002 | + if (this.c) { | |
| 3003 | + newPath.setTripleAt(vertices[0][0], vertices[0][1], inPoints[0][0], inPoints[0][1], outPoints[0][0], outPoints[0][1], 0, false); | |
| 3004 | + init = 1; | |
| 3005 | + } | |
| 3006 | + var cnt = this._length - 1; | |
| 3007 | + var len = this._length; | |
| 3008 | + var i; | |
| 3009 | + for (i = init; i < len; i += 1) { | |
| 3010 | + newPath.setTripleAt(vertices[cnt][0], vertices[cnt][1], inPoints[cnt][0], inPoints[cnt][1], outPoints[cnt][0], outPoints[cnt][1], i, false); | |
| 3011 | + cnt -= 1; | |
| 3012 | + } | |
| 3013 | + return newPath; | |
| 3014 | + }; | |
| 3015 | + ShapePath.prototype.length = function() { | |
| 3016 | + return this._length; | |
| 3017 | + }; | |
| 3018 | + var shapePool = function() { | |
| 3019 | + function create() { | |
| 3020 | + return new ShapePath(); | |
| 3021 | + } | |
| 3022 | + function release(shapePath) { | |
| 3023 | + var len = shapePath._length; | |
| 3024 | + var i; | |
| 3025 | + for (i = 0; i < len; i += 1) { | |
| 3026 | + pointPool.release(shapePath.v[i]); | |
| 3027 | + pointPool.release(shapePath.i[i]); | |
| 3028 | + pointPool.release(shapePath.o[i]); | |
| 3029 | + shapePath.v[i] = null; | |
| 3030 | + shapePath.i[i] = null; | |
| 3031 | + shapePath.o[i] = null; | |
| 3032 | + } | |
| 3033 | + shapePath._length = 0; | |
| 3034 | + shapePath.c = false; | |
| 3035 | + } | |
| 3036 | + function clone(shape) { | |
| 3037 | + var cloned = factory.newElement(); | |
| 3038 | + var i; | |
| 3039 | + var len = shape._length === void 0 ? shape.v.length : shape._length; | |
| 3040 | + cloned.setLength(len); | |
| 3041 | + cloned.c = shape.c; | |
| 3042 | + for (i = 0; i < len; i += 1) cloned.setTripleAt(shape.v[i][0], shape.v[i][1], shape.o[i][0], shape.o[i][1], shape.i[i][0], shape.i[i][1], i); | |
| 3043 | + return cloned; | |
| 3044 | + } | |
| 3045 | + var factory = poolFactory(4, create, release); | |
| 3046 | + factory.clone = clone; | |
| 3047 | + return factory; | |
| 3048 | + }(); | |
| 3049 | + function ShapeCollection() { | |
| 3050 | + this._length = 0; | |
| 3051 | + this._maxLength = 4; | |
| 3052 | + this.shapes = createSizedArray(this._maxLength); | |
| 3053 | + } | |
| 3054 | + ShapeCollection.prototype.addShape = function(shapeData) { | |
| 3055 | + if (this._length === this._maxLength) { | |
| 3056 | + this.shapes = this.shapes.concat(createSizedArray(this._maxLength)); | |
| 3057 | + this._maxLength *= 2; | |
| 3058 | + } | |
| 3059 | + this.shapes[this._length] = shapeData; | |
| 3060 | + this._length += 1; | |
| 3061 | + }; | |
| 3062 | + ShapeCollection.prototype.releaseShapes = function() { | |
| 3063 | + var i; | |
| 3064 | + for (i = 0; i < this._length; i += 1) shapePool.release(this.shapes[i]); | |
| 3065 | + this._length = 0; | |
| 3066 | + }; | |
| 3067 | + var shapeCollectionPool = function() { | |
| 3068 | + var ob = { | |
| 3069 | + newShapeCollection, | |
| 3070 | + release | |
| 3071 | + }; | |
| 3072 | + var _length = 0; | |
| 3073 | + var _maxLength = 4; | |
| 3074 | + var pool = createSizedArray(_maxLength); | |
| 3075 | + function newShapeCollection() { | |
| 3076 | + var shapeCollection; | |
| 3077 | + if (_length) { | |
| 3078 | + _length -= 1; | |
| 3079 | + shapeCollection = pool[_length]; | |
| 3080 | + } else shapeCollection = new ShapeCollection(); | |
| 3081 | + return shapeCollection; | |
| 3082 | + } | |
| 3083 | + function release(shapeCollection) { | |
| 3084 | + var i; | |
| 3085 | + var len = shapeCollection._length; | |
| 3086 | + for (i = 0; i < len; i += 1) shapePool.release(shapeCollection.shapes[i]); | |
| 3087 | + shapeCollection._length = 0; | |
| 3088 | + if (_length === _maxLength) { | |
| 3089 | + pool = pooling["double"](pool); | |
| 3090 | + _maxLength *= 2; | |
| 3091 | + } | |
| 3092 | + pool[_length] = shapeCollection; | |
| 3093 | + _length += 1; | |
| 3094 | + } | |
| 3095 | + return ob; | |
| 3096 | + }(); | |
| 3097 | + var ShapePropertyFactory = function() { | |
| 3098 | + var initFrame = -999999; | |
| 3099 | + function interpolateShape(frameNum, previousValue, caching) { | |
| 3100 | + var iterationIndex = caching.lastIndex; | |
| 3101 | + var keyPropS; | |
| 3102 | + var keyPropE; | |
| 3103 | + var isHold; | |
| 3104 | + var j; | |
| 3105 | + var k; | |
| 3106 | + var jLen; | |
| 3107 | + var kLen; | |
| 3108 | + var perc; | |
| 3109 | + var vertexValue; | |
| 3110 | + var kf = this.keyframes; | |
| 3111 | + if (frameNum < kf[0].t - this.offsetTime) { | |
| 3112 | + keyPropS = kf[0].s[0]; | |
| 3113 | + isHold = true; | |
| 3114 | + iterationIndex = 0; | |
| 3115 | + } else if (frameNum >= kf[kf.length - 1].t - this.offsetTime) { | |
| 3116 | + keyPropS = kf[kf.length - 1].s ? kf[kf.length - 1].s[0] : kf[kf.length - 2].e[0]; | |
| 3117 | + isHold = true; | |
| 3118 | + } else { | |
| 3119 | + var i = iterationIndex; | |
| 3120 | + var len = kf.length - 1; | |
| 3121 | + var flag = true; | |
| 3122 | + var keyData; | |
| 3123 | + var nextKeyData; | |
| 3124 | + var keyframeMetadata; | |
| 3125 | + while (flag) { | |
| 3126 | + keyData = kf[i]; | |
| 3127 | + nextKeyData = kf[i + 1]; | |
| 3128 | + if (nextKeyData.t - this.offsetTime > frameNum) break; | |
| 3129 | + if (i < len - 1) i += 1; | |
| 3130 | + else flag = false; | |
| 3131 | + } | |
| 3132 | + keyframeMetadata = this.keyframesMetadata[i] || {}; | |
| 3133 | + isHold = keyData.h === 1; | |
| 3134 | + iterationIndex = i; | |
| 3135 | + if (!isHold) { | |
| 3136 | + if (frameNum >= nextKeyData.t - this.offsetTime) perc = 1; | |
| 3137 | + else if (frameNum < keyData.t - this.offsetTime) perc = 0; | |
| 3138 | + else { | |
| 3139 | + var fnc; | |
| 3140 | + if (keyframeMetadata.__fnct) fnc = keyframeMetadata.__fnct; | |
| 3141 | + else { | |
| 3142 | + fnc = BezierFactory.getBezierEasing(keyData.o.x, keyData.o.y, keyData.i.x, keyData.i.y).get; | |
| 3143 | + keyframeMetadata.__fnct = fnc; | |
| 3144 | + } | |
| 3145 | + perc = fnc((frameNum - (keyData.t - this.offsetTime)) / (nextKeyData.t - this.offsetTime - (keyData.t - this.offsetTime))); | |
| 3146 | + } | |
| 3147 | + keyPropE = nextKeyData.s ? nextKeyData.s[0] : keyData.e[0]; | |
| 3148 | + } | |
| 3149 | + keyPropS = keyData.s[0]; | |
| 3150 | + } | |
| 3151 | + jLen = previousValue._length; | |
| 3152 | + kLen = keyPropS.i[0].length; | |
| 3153 | + caching.lastIndex = iterationIndex; | |
| 3154 | + for (j = 0; j < jLen; j += 1) for (k = 0; k < kLen; k += 1) { | |
| 3155 | + vertexValue = isHold ? keyPropS.i[j][k] : keyPropS.i[j][k] + (keyPropE.i[j][k] - keyPropS.i[j][k]) * perc; | |
| 3156 | + previousValue.i[j][k] = vertexValue; | |
| 3157 | + vertexValue = isHold ? keyPropS.o[j][k] : keyPropS.o[j][k] + (keyPropE.o[j][k] - keyPropS.o[j][k]) * perc; | |
| 3158 | + previousValue.o[j][k] = vertexValue; | |
| 3159 | + vertexValue = isHold ? keyPropS.v[j][k] : keyPropS.v[j][k] + (keyPropE.v[j][k] - keyPropS.v[j][k]) * perc; | |
| 3160 | + previousValue.v[j][k] = vertexValue; | |
| 3161 | + } | |
| 3162 | + } | |
| 3163 | + function interpolateShapeCurrentTime() { | |
| 3164 | + var frameNum = this.comp.renderedFrame - this.offsetTime; | |
| 3165 | + var initTime = this.keyframes[0].t - this.offsetTime; | |
| 3166 | + var endTime = this.keyframes[this.keyframes.length - 1].t - this.offsetTime; | |
| 3167 | + var lastFrame = this._caching.lastFrame; | |
| 3168 | + if (!(lastFrame !== initFrame && (lastFrame < initTime && frameNum < initTime || lastFrame > endTime && frameNum > endTime))) { | |
| 3169 | + this._caching.lastIndex = lastFrame < frameNum ? this._caching.lastIndex : 0; | |
| 3170 | + this.interpolateShape(frameNum, this.pv, this._caching); | |
| 3171 | + } | |
| 3172 | + this._caching.lastFrame = frameNum; | |
| 3173 | + return this.pv; | |
| 3174 | + } | |
| 3175 | + function resetShape() { | |
| 3176 | + this.paths = this.localShapeCollection; | |
| 3177 | + } | |
| 3178 | + function shapesEqual(shape1, shape2) { | |
| 3179 | + if (shape1._length !== shape2._length || shape1.c !== shape2.c) return false; | |
| 3180 | + var i; | |
| 3181 | + var len = shape1._length; | |
| 3182 | + for (i = 0; i < len; i += 1) if (shape1.v[i][0] !== shape2.v[i][0] || shape1.v[i][1] !== shape2.v[i][1] || shape1.o[i][0] !== shape2.o[i][0] || shape1.o[i][1] !== shape2.o[i][1] || shape1.i[i][0] !== shape2.i[i][0] || shape1.i[i][1] !== shape2.i[i][1]) return false; | |
| 3183 | + return true; | |
| 3184 | + } | |
| 3185 | + function setVValue(newPath) { | |
| 3186 | + if (!shapesEqual(this.v, newPath)) { | |
| 3187 | + this.v = shapePool.clone(newPath); | |
| 3188 | + this.localShapeCollection.releaseShapes(); | |
| 3189 | + this.localShapeCollection.addShape(this.v); | |
| 3190 | + this._mdf = true; | |
| 3191 | + this.paths = this.localShapeCollection; | |
| 3192 | + } | |
| 3193 | + } | |
| 3194 | + function processEffectsSequence() { | |
| 3195 | + if (this.elem.globalData.frameId === this.frameId) return; | |
| 3196 | + if (!this.effectsSequence.length) { | |
| 3197 | + this._mdf = false; | |
| 3198 | + return; | |
| 3199 | + } | |
| 3200 | + if (this.lock) { | |
| 3201 | + this.setVValue(this.pv); | |
| 3202 | + return; | |
| 3203 | + } | |
| 3204 | + this.lock = true; | |
| 3205 | + this._mdf = false; | |
| 3206 | + var finalValue; | |
| 3207 | + if (this.kf) finalValue = this.pv; | |
| 3208 | + else if (this.data.ks) finalValue = this.data.ks.k; | |
| 3209 | + else finalValue = this.data.pt.k; | |
| 3210 | + var i; | |
| 3211 | + var len = this.effectsSequence.length; | |
| 3212 | + for (i = 0; i < len; i += 1) finalValue = this.effectsSequence[i](finalValue); | |
| 3213 | + this.setVValue(finalValue); | |
| 3214 | + this.lock = false; | |
| 3215 | + this.frameId = this.elem.globalData.frameId; | |
| 3216 | + } | |
| 3217 | + function ShapeProperty(elem, data, type) { | |
| 3218 | + this.propType = "shape"; | |
| 3219 | + this.comp = elem.comp; | |
| 3220 | + this.container = elem; | |
| 3221 | + this.elem = elem; | |
| 3222 | + this.data = data; | |
| 3223 | + this.k = false; | |
| 3224 | + this.kf = false; | |
| 3225 | + this._mdf = false; | |
| 3226 | + var pathData = type === 3 ? data.pt.k : data.ks.k; | |
| 3227 | + this.v = shapePool.clone(pathData); | |
| 3228 | + this.pv = shapePool.clone(this.v); | |
| 3229 | + this.localShapeCollection = shapeCollectionPool.newShapeCollection(); | |
| 3230 | + this.paths = this.localShapeCollection; | |
| 3231 | + this.paths.addShape(this.v); | |
| 3232 | + this.reset = resetShape; | |
| 3233 | + this.effectsSequence = []; | |
| 3234 | + } | |
| 3235 | + function addEffect(effectFunction) { | |
| 3236 | + this.effectsSequence.push(effectFunction); | |
| 3237 | + this.container.addDynamicProperty(this); | |
| 3238 | + } | |
| 3239 | + ShapeProperty.prototype.interpolateShape = interpolateShape; | |
| 3240 | + ShapeProperty.prototype.getValue = processEffectsSequence; | |
| 3241 | + ShapeProperty.prototype.setVValue = setVValue; | |
| 3242 | + ShapeProperty.prototype.addEffect = addEffect; | |
| 3243 | + function KeyframedShapeProperty(elem, data, type) { | |
| 3244 | + this.propType = "shape"; | |
| 3245 | + this.comp = elem.comp; | |
| 3246 | + this.elem = elem; | |
| 3247 | + this.container = elem; | |
| 3248 | + this.offsetTime = elem.data.st; | |
| 3249 | + this.keyframes = type === 3 ? data.pt.k : data.ks.k; | |
| 3250 | + this.keyframesMetadata = []; | |
| 3251 | + this.k = true; | |
| 3252 | + this.kf = true; | |
| 3253 | + var len = this.keyframes[0].s[0].i.length; | |
| 3254 | + this.v = shapePool.newElement(); | |
| 3255 | + this.v.setPathData(this.keyframes[0].s[0].c, len); | |
| 3256 | + this.pv = shapePool.clone(this.v); | |
| 3257 | + this.localShapeCollection = shapeCollectionPool.newShapeCollection(); | |
| 3258 | + this.paths = this.localShapeCollection; | |
| 3259 | + this.paths.addShape(this.v); | |
| 3260 | + this.lastFrame = initFrame; | |
| 3261 | + this.reset = resetShape; | |
| 3262 | + this._caching = { | |
| 3263 | + lastFrame: initFrame, | |
| 3264 | + lastIndex: 0 | |
| 3265 | + }; | |
| 3266 | + this.effectsSequence = [interpolateShapeCurrentTime.bind(this)]; | |
| 3267 | + } | |
| 3268 | + KeyframedShapeProperty.prototype.getValue = processEffectsSequence; | |
| 3269 | + KeyframedShapeProperty.prototype.interpolateShape = interpolateShape; | |
| 3270 | + KeyframedShapeProperty.prototype.setVValue = setVValue; | |
| 3271 | + KeyframedShapeProperty.prototype.addEffect = addEffect; | |
| 3272 | + var EllShapeProperty = function() { | |
| 3273 | + var cPoint = roundCorner; | |
| 3274 | + function EllShapePropertyFactory(elem, data) { | |
| 3275 | + this.v = shapePool.newElement(); | |
| 3276 | + this.v.setPathData(true, 4); | |
| 3277 | + this.localShapeCollection = shapeCollectionPool.newShapeCollection(); | |
| 3278 | + this.paths = this.localShapeCollection; | |
| 3279 | + this.localShapeCollection.addShape(this.v); | |
| 3280 | + this.d = data.d; | |
| 3281 | + this.elem = elem; | |
| 3282 | + this.comp = elem.comp; | |
| 3283 | + this.frameId = -1; | |
| 3284 | + this.initDynamicPropertyContainer(elem); | |
| 3285 | + this.p = PropertyFactory.getProp(elem, data.p, 1, 0, this); | |
| 3286 | + this.s = PropertyFactory.getProp(elem, data.s, 1, 0, this); | |
| 3287 | + if (this.dynamicProperties.length) this.k = true; | |
| 3288 | + else { | |
| 3289 | + this.k = false; | |
| 3290 | + this.convertEllToPath(); | |
| 3291 | + } | |
| 3292 | + } | |
| 3293 | + EllShapePropertyFactory.prototype = { | |
| 3294 | + reset: resetShape, | |
| 3295 | + getValue: function getValue() { | |
| 3296 | + if (this.elem.globalData.frameId === this.frameId) return; | |
| 3297 | + this.frameId = this.elem.globalData.frameId; | |
| 3298 | + this.iterateDynamicProperties(); | |
| 3299 | + if (this._mdf) this.convertEllToPath(); | |
| 3300 | + }, | |
| 3301 | + convertEllToPath: function convertEllToPath() { | |
| 3302 | + var p0 = this.p.v[0]; | |
| 3303 | + var p1 = this.p.v[1]; | |
| 3304 | + var s0 = this.s.v[0] / 2; | |
| 3305 | + var s1 = this.s.v[1] / 2; | |
| 3306 | + var _cw = this.d !== 3; | |
| 3307 | + var _v = this.v; | |
| 3308 | + _v.v[0][0] = p0; | |
| 3309 | + _v.v[0][1] = p1 - s1; | |
| 3310 | + _v.v[1][0] = _cw ? p0 + s0 : p0 - s0; | |
| 3311 | + _v.v[1][1] = p1; | |
| 3312 | + _v.v[2][0] = p0; | |
| 3313 | + _v.v[2][1] = p1 + s1; | |
| 3314 | + _v.v[3][0] = _cw ? p0 - s0 : p0 + s0; | |
| 3315 | + _v.v[3][1] = p1; | |
| 3316 | + _v.i[0][0] = _cw ? p0 - s0 * cPoint : p0 + s0 * cPoint; | |
| 3317 | + _v.i[0][1] = p1 - s1; | |
| 3318 | + _v.i[1][0] = _cw ? p0 + s0 : p0 - s0; | |
| 3319 | + _v.i[1][1] = p1 - s1 * cPoint; | |
| 3320 | + _v.i[2][0] = _cw ? p0 + s0 * cPoint : p0 - s0 * cPoint; | |
| 3321 | + _v.i[2][1] = p1 + s1; | |
| 3322 | + _v.i[3][0] = _cw ? p0 - s0 : p0 + s0; | |
| 3323 | + _v.i[3][1] = p1 + s1 * cPoint; | |
| 3324 | + _v.o[0][0] = _cw ? p0 + s0 * cPoint : p0 - s0 * cPoint; | |
| 3325 | + _v.o[0][1] = p1 - s1; | |
| 3326 | + _v.o[1][0] = _cw ? p0 + s0 : p0 - s0; | |
| 3327 | + _v.o[1][1] = p1 + s1 * cPoint; | |
| 3328 | + _v.o[2][0] = _cw ? p0 - s0 * cPoint : p0 + s0 * cPoint; | |
| 3329 | + _v.o[2][1] = p1 + s1; | |
| 3330 | + _v.o[3][0] = _cw ? p0 - s0 : p0 + s0; | |
| 3331 | + _v.o[3][1] = p1 - s1 * cPoint; | |
| 3332 | + } | |
| 3333 | + }; | |
| 3334 | + extendPrototype([DynamicPropertyContainer], EllShapePropertyFactory); | |
| 3335 | + return EllShapePropertyFactory; | |
| 3336 | + }(); | |
| 3337 | + var StarShapeProperty = function() { | |
| 3338 | + function StarShapePropertyFactory(elem, data) { | |
| 3339 | + this.v = shapePool.newElement(); | |
| 3340 | + this.v.setPathData(true, 0); | |
| 3341 | + this.elem = elem; | |
| 3342 | + this.comp = elem.comp; | |
| 3343 | + this.data = data; | |
| 3344 | + this.frameId = -1; | |
| 3345 | + this.d = data.d; | |
| 3346 | + this.initDynamicPropertyContainer(elem); | |
| 3347 | + if (data.sy === 1) { | |
| 3348 | + this.ir = PropertyFactory.getProp(elem, data.ir, 0, 0, this); | |
| 3349 | + this.is = PropertyFactory.getProp(elem, data.is, 0, .01, this); | |
| 3350 | + this.convertToPath = this.convertStarToPath; | |
| 3351 | + } else this.convertToPath = this.convertPolygonToPath; | |
| 3352 | + this.pt = PropertyFactory.getProp(elem, data.pt, 0, 0, this); | |
| 3353 | + this.p = PropertyFactory.getProp(elem, data.p, 1, 0, this); | |
| 3354 | + this.r = PropertyFactory.getProp(elem, data.r, 0, degToRads, this); | |
| 3355 | + this.or = PropertyFactory.getProp(elem, data.or, 0, 0, this); | |
| 3356 | + this.os = PropertyFactory.getProp(elem, data.os, 0, .01, this); | |
| 3357 | + this.localShapeCollection = shapeCollectionPool.newShapeCollection(); | |
| 3358 | + this.localShapeCollection.addShape(this.v); | |
| 3359 | + this.paths = this.localShapeCollection; | |
| 3360 | + if (this.dynamicProperties.length) this.k = true; | |
| 3361 | + else { | |
| 3362 | + this.k = false; | |
| 3363 | + this.convertToPath(); | |
| 3364 | + } | |
| 3365 | + } | |
| 3366 | + StarShapePropertyFactory.prototype = { | |
| 3367 | + reset: resetShape, | |
| 3368 | + getValue: function getValue() { | |
| 3369 | + if (this.elem.globalData.frameId === this.frameId) return; | |
| 3370 | + this.frameId = this.elem.globalData.frameId; | |
| 3371 | + this.iterateDynamicProperties(); | |
| 3372 | + if (this._mdf) this.convertToPath(); | |
| 3373 | + }, | |
| 3374 | + convertStarToPath: function convertStarToPath() { | |
| 3375 | + var numPts = Math.floor(this.pt.v) * 2; | |
| 3376 | + var angle = Math.PI * 2 / numPts; | |
| 3377 | + var longFlag = true; | |
| 3378 | + var longRad = this.or.v; | |
| 3379 | + var shortRad = this.ir.v; | |
| 3380 | + var longRound = this.os.v; | |
| 3381 | + var shortRound = this.is.v; | |
| 3382 | + var longPerimSegment = 2 * Math.PI * longRad / (numPts * 2); | |
| 3383 | + var shortPerimSegment = 2 * Math.PI * shortRad / (numPts * 2); | |
| 3384 | + var i; | |
| 3385 | + var rad; | |
| 3386 | + var roundness; | |
| 3387 | + var perimSegment; | |
| 3388 | + var currentAng = -Math.PI / 2; | |
| 3389 | + currentAng += this.r.v; | |
| 3390 | + var dir = this.data.d === 3 ? -1 : 1; | |
| 3391 | + this.v._length = 0; | |
| 3392 | + for (i = 0; i < numPts; i += 1) { | |
| 3393 | + rad = longFlag ? longRad : shortRad; | |
| 3394 | + roundness = longFlag ? longRound : shortRound; | |
| 3395 | + perimSegment = longFlag ? longPerimSegment : shortPerimSegment; | |
| 3396 | + var x = rad * Math.cos(currentAng); | |
| 3397 | + var y = rad * Math.sin(currentAng); | |
| 3398 | + var ox = x === 0 && y === 0 ? 0 : y / Math.sqrt(x * x + y * y); | |
| 3399 | + var oy = x === 0 && y === 0 ? 0 : -x / Math.sqrt(x * x + y * y); | |
| 3400 | + x += +this.p.v[0]; | |
| 3401 | + y += +this.p.v[1]; | |
| 3402 | + this.v.setTripleAt(x, y, x - ox * perimSegment * roundness * dir, y - oy * perimSegment * roundness * dir, x + ox * perimSegment * roundness * dir, y + oy * perimSegment * roundness * dir, i, true); | |
| 3403 | + longFlag = !longFlag; | |
| 3404 | + currentAng += angle * dir; | |
| 3405 | + } | |
| 3406 | + }, | |
| 3407 | + convertPolygonToPath: function convertPolygonToPath() { | |
| 3408 | + var numPts = Math.floor(this.pt.v); | |
| 3409 | + var angle = Math.PI * 2 / numPts; | |
| 3410 | + var rad = this.or.v; | |
| 3411 | + var roundness = this.os.v; | |
| 3412 | + var perimSegment = 2 * Math.PI * rad / (numPts * 4); | |
| 3413 | + var i; | |
| 3414 | + var currentAng = -Math.PI * .5; | |
| 3415 | + var dir = this.data.d === 3 ? -1 : 1; | |
| 3416 | + currentAng += this.r.v; | |
| 3417 | + this.v._length = 0; | |
| 3418 | + for (i = 0; i < numPts; i += 1) { | |
| 3419 | + var x = rad * Math.cos(currentAng); | |
| 3420 | + var y = rad * Math.sin(currentAng); | |
| 3421 | + var ox = x === 0 && y === 0 ? 0 : y / Math.sqrt(x * x + y * y); | |
| 3422 | + var oy = x === 0 && y === 0 ? 0 : -x / Math.sqrt(x * x + y * y); | |
| 3423 | + x += +this.p.v[0]; | |
| 3424 | + y += +this.p.v[1]; | |
| 3425 | + this.v.setTripleAt(x, y, x - ox * perimSegment * roundness * dir, y - oy * perimSegment * roundness * dir, x + ox * perimSegment * roundness * dir, y + oy * perimSegment * roundness * dir, i, true); | |
| 3426 | + currentAng += angle * dir; | |
| 3427 | + } | |
| 3428 | + this.paths.length = 0; | |
| 3429 | + this.paths[0] = this.v; | |
| 3430 | + } | |
| 3431 | + }; | |
| 3432 | + extendPrototype([DynamicPropertyContainer], StarShapePropertyFactory); | |
| 3433 | + return StarShapePropertyFactory; | |
| 3434 | + }(); | |
| 3435 | + var RectShapeProperty = function() { | |
| 3436 | + function RectShapePropertyFactory(elem, data) { | |
| 3437 | + this.v = shapePool.newElement(); | |
| 3438 | + this.v.c = true; | |
| 3439 | + this.localShapeCollection = shapeCollectionPool.newShapeCollection(); | |
| 3440 | + this.localShapeCollection.addShape(this.v); | |
| 3441 | + this.paths = this.localShapeCollection; | |
| 3442 | + this.elem = elem; | |
| 3443 | + this.comp = elem.comp; | |
| 3444 | + this.frameId = -1; | |
| 3445 | + this.d = data.d; | |
| 3446 | + this.initDynamicPropertyContainer(elem); | |
| 3447 | + this.p = PropertyFactory.getProp(elem, data.p, 1, 0, this); | |
| 3448 | + this.s = PropertyFactory.getProp(elem, data.s, 1, 0, this); | |
| 3449 | + this.r = PropertyFactory.getProp(elem, data.r, 0, 0, this); | |
| 3450 | + if (this.dynamicProperties.length) this.k = true; | |
| 3451 | + else { | |
| 3452 | + this.k = false; | |
| 3453 | + this.convertRectToPath(); | |
| 3454 | + } | |
| 3455 | + } | |
| 3456 | + RectShapePropertyFactory.prototype = { | |
| 3457 | + convertRectToPath: function convertRectToPath() { | |
| 3458 | + var p0 = this.p.v[0]; | |
| 3459 | + var p1 = this.p.v[1]; | |
| 3460 | + var v0 = this.s.v[0] / 2; | |
| 3461 | + var v1 = this.s.v[1] / 2; | |
| 3462 | + var round = bmMin(v0, v1, this.r.v); | |
| 3463 | + var cPoint = round * (1 - roundCorner); | |
| 3464 | + this.v._length = 0; | |
| 3465 | + if (this.d === 2 || this.d === 1) { | |
| 3466 | + this.v.setTripleAt(p0 + v0, p1 - v1 + round, p0 + v0, p1 - v1 + round, p0 + v0, p1 - v1 + cPoint, 0, true); | |
| 3467 | + this.v.setTripleAt(p0 + v0, p1 + v1 - round, p0 + v0, p1 + v1 - cPoint, p0 + v0, p1 + v1 - round, 1, true); | |
| 3468 | + if (round !== 0) { | |
| 3469 | + this.v.setTripleAt(p0 + v0 - round, p1 + v1, p0 + v0 - round, p1 + v1, p0 + v0 - cPoint, p1 + v1, 2, true); | |
| 3470 | + this.v.setTripleAt(p0 - v0 + round, p1 + v1, p0 - v0 + cPoint, p1 + v1, p0 - v0 + round, p1 + v1, 3, true); | |
| 3471 | + this.v.setTripleAt(p0 - v0, p1 + v1 - round, p0 - v0, p1 + v1 - round, p0 - v0, p1 + v1 - cPoint, 4, true); | |
| 3472 | + this.v.setTripleAt(p0 - v0, p1 - v1 + round, p0 - v0, p1 - v1 + cPoint, p0 - v0, p1 - v1 + round, 5, true); | |
| 3473 | + this.v.setTripleAt(p0 - v0 + round, p1 - v1, p0 - v0 + round, p1 - v1, p0 - v0 + cPoint, p1 - v1, 6, true); | |
| 3474 | + this.v.setTripleAt(p0 + v0 - round, p1 - v1, p0 + v0 - cPoint, p1 - v1, p0 + v0 - round, p1 - v1, 7, true); | |
| 3475 | + } else { | |
| 3476 | + this.v.setTripleAt(p0 - v0, p1 + v1, p0 - v0 + cPoint, p1 + v1, p0 - v0, p1 + v1, 2); | |
| 3477 | + this.v.setTripleAt(p0 - v0, p1 - v1, p0 - v0, p1 - v1 + cPoint, p0 - v0, p1 - v1, 3); | |
| 3478 | + } | |
| 3479 | + } else { | |
| 3480 | + this.v.setTripleAt(p0 + v0, p1 - v1 + round, p0 + v0, p1 - v1 + cPoint, p0 + v0, p1 - v1 + round, 0, true); | |
| 3481 | + if (round !== 0) { | |
| 3482 | + this.v.setTripleAt(p0 + v0 - round, p1 - v1, p0 + v0 - round, p1 - v1, p0 + v0 - cPoint, p1 - v1, 1, true); | |
| 3483 | + this.v.setTripleAt(p0 - v0 + round, p1 - v1, p0 - v0 + cPoint, p1 - v1, p0 - v0 + round, p1 - v1, 2, true); | |
| 3484 | + this.v.setTripleAt(p0 - v0, p1 - v1 + round, p0 - v0, p1 - v1 + round, p0 - v0, p1 - v1 + cPoint, 3, true); | |
| 3485 | + this.v.setTripleAt(p0 - v0, p1 + v1 - round, p0 - v0, p1 + v1 - cPoint, p0 - v0, p1 + v1 - round, 4, true); | |
| 3486 | + this.v.setTripleAt(p0 - v0 + round, p1 + v1, p0 - v0 + round, p1 + v1, p0 - v0 + cPoint, p1 + v1, 5, true); | |
| 3487 | + this.v.setTripleAt(p0 + v0 - round, p1 + v1, p0 + v0 - cPoint, p1 + v1, p0 + v0 - round, p1 + v1, 6, true); | |
| 3488 | + this.v.setTripleAt(p0 + v0, p1 + v1 - round, p0 + v0, p1 + v1 - round, p0 + v0, p1 + v1 - cPoint, 7, true); | |
| 3489 | + } else { | |
| 3490 | + this.v.setTripleAt(p0 - v0, p1 - v1, p0 - v0 + cPoint, p1 - v1, p0 - v0, p1 - v1, 1, true); | |
| 3491 | + this.v.setTripleAt(p0 - v0, p1 + v1, p0 - v0, p1 + v1 - cPoint, p0 - v0, p1 + v1, 2, true); | |
| 3492 | + this.v.setTripleAt(p0 + v0, p1 + v1, p0 + v0 - cPoint, p1 + v1, p0 + v0, p1 + v1, 3, true); | |
| 3493 | + } | |
| 3494 | + } | |
| 3495 | + }, | |
| 3496 | + getValue: function getValue() { | |
| 3497 | + if (this.elem.globalData.frameId === this.frameId) return; | |
| 3498 | + this.frameId = this.elem.globalData.frameId; | |
| 3499 | + this.iterateDynamicProperties(); | |
| 3500 | + if (this._mdf) this.convertRectToPath(); | |
| 3501 | + }, | |
| 3502 | + reset: resetShape | |
| 3503 | + }; | |
| 3504 | + extendPrototype([DynamicPropertyContainer], RectShapePropertyFactory); | |
| 3505 | + return RectShapePropertyFactory; | |
| 3506 | + }(); | |
| 3507 | + function getShapeProp(elem, data, type) { | |
| 3508 | + var prop; | |
| 3509 | + if (type === 3 || type === 4) if ((type === 3 ? data.pt : data.ks).k.length) prop = new KeyframedShapeProperty(elem, data, type); | |
| 3510 | + else prop = new ShapeProperty(elem, data, type); | |
| 3511 | + else if (type === 5) prop = new RectShapeProperty(elem, data); | |
| 3512 | + else if (type === 6) prop = new EllShapeProperty(elem, data); | |
| 3513 | + else if (type === 7) prop = new StarShapeProperty(elem, data); | |
| 3514 | + if (prop.k) elem.addDynamicProperty(prop); | |
| 3515 | + return prop; | |
| 3516 | + } | |
| 3517 | + function getConstructorFunction() { | |
| 3518 | + return ShapeProperty; | |
| 3519 | + } | |
| 3520 | + function getKeyframedConstructorFunction() { | |
| 3521 | + return KeyframedShapeProperty; | |
| 3522 | + } | |
| 3523 | + var ob = {}; | |
| 3524 | + ob.getShapeProp = getShapeProp; | |
| 3525 | + ob.getConstructorFunction = getConstructorFunction; | |
| 3526 | + ob.getKeyframedConstructorFunction = getKeyframedConstructorFunction; | |
| 3527 | + return ob; | |
| 3528 | + }(); | |
| 3529 | + /*! | |
| 3530 | + Transformation Matrix v2.0 | |
| 3531 | + (c) Epistemex 2014-2015 | |
| 3532 | + www.epistemex.com | |
| 3533 | + By Ken Fyrstenberg | |
| 3534 | + Contributions by leeoniya. | |
| 3535 | + License: MIT, header required. | |
| 3536 | + */ | |
| 3537 | + /** | |
| 3538 | + * 2D transformation matrix object initialized with identity matrix. | |
| 3539 | + * | |
| 3540 | + * The matrix can synchronize a canvas context by supplying the context | |
| 3541 | + * as an argument, or later apply current absolute transform to an | |
| 3542 | + * existing context. | |
| 3543 | + * | |
| 3544 | + * All values are handled as floating point values. | |
| 3545 | + * | |
| 3546 | + * @param {CanvasRenderingContext2D} [context] - Optional context to sync with Matrix | |
| 3547 | + * @prop {number} a - scale x | |
| 3548 | + * @prop {number} b - shear y | |
| 3549 | + * @prop {number} c - shear x | |
| 3550 | + * @prop {number} d - scale y | |
| 3551 | + * @prop {number} e - translate x | |
| 3552 | + * @prop {number} f - translate y | |
| 3553 | + * @prop {CanvasRenderingContext2D|null} [context=null] - set or get current canvas context | |
| 3554 | + * @constructor | |
| 3555 | + */ | |
| 3556 | + var Matrix = function() { | |
| 3557 | + var _cos = Math.cos; | |
| 3558 | + var _sin = Math.sin; | |
| 3559 | + var _tan = Math.tan; | |
| 3560 | + var _rnd = Math.round; | |
| 3561 | + function reset() { | |
| 3562 | + this.props[0] = 1; | |
| 3563 | + this.props[1] = 0; | |
| 3564 | + this.props[2] = 0; | |
| 3565 | + this.props[3] = 0; | |
| 3566 | + this.props[4] = 0; | |
| 3567 | + this.props[5] = 1; | |
| 3568 | + this.props[6] = 0; | |
| 3569 | + this.props[7] = 0; | |
| 3570 | + this.props[8] = 0; | |
| 3571 | + this.props[9] = 0; | |
| 3572 | + this.props[10] = 1; | |
| 3573 | + this.props[11] = 0; | |
| 3574 | + this.props[12] = 0; | |
| 3575 | + this.props[13] = 0; | |
| 3576 | + this.props[14] = 0; | |
| 3577 | + this.props[15] = 1; | |
| 3578 | + return this; | |
| 3579 | + } | |
| 3580 | + function rotate(angle) { | |
| 3581 | + if (angle === 0) return this; | |
| 3582 | + var mCos = _cos(angle); | |
| 3583 | + var mSin = _sin(angle); | |
| 3584 | + return this._t(mCos, -mSin, 0, 0, mSin, mCos, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); | |
| 3585 | + } | |
| 3586 | + function rotateX(angle) { | |
| 3587 | + if (angle === 0) return this; | |
| 3588 | + var mCos = _cos(angle); | |
| 3589 | + var mSin = _sin(angle); | |
| 3590 | + return this._t(1, 0, 0, 0, 0, mCos, -mSin, 0, 0, mSin, mCos, 0, 0, 0, 0, 1); | |
| 3591 | + } | |
| 3592 | + function rotateY(angle) { | |
| 3593 | + if (angle === 0) return this; | |
| 3594 | + var mCos = _cos(angle); | |
| 3595 | + var mSin = _sin(angle); | |
| 3596 | + return this._t(mCos, 0, mSin, 0, 0, 1, 0, 0, -mSin, 0, mCos, 0, 0, 0, 0, 1); | |
| 3597 | + } | |
| 3598 | + function rotateZ(angle) { | |
| 3599 | + if (angle === 0) return this; | |
| 3600 | + var mCos = _cos(angle); | |
| 3601 | + var mSin = _sin(angle); | |
| 3602 | + return this._t(mCos, -mSin, 0, 0, mSin, mCos, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); | |
| 3603 | + } | |
| 3604 | + function shear(sx, sy) { | |
| 3605 | + return this._t(1, sy, sx, 1, 0, 0); | |
| 3606 | + } | |
| 3607 | + function skew(ax, ay) { | |
| 3608 | + return this.shear(_tan(ax), _tan(ay)); | |
| 3609 | + } | |
| 3610 | + function skewFromAxis(ax, angle) { | |
| 3611 | + var mCos = _cos(angle); | |
| 3612 | + var mSin = _sin(angle); | |
| 3613 | + return this._t(mCos, mSin, 0, 0, -mSin, mCos, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)._t(1, 0, 0, 0, _tan(ax), 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)._t(mCos, -mSin, 0, 0, mSin, mCos, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); | |
| 3614 | + } | |
| 3615 | + function scale(sx, sy, sz) { | |
| 3616 | + if (!sz && sz !== 0) sz = 1; | |
| 3617 | + if (sx === 1 && sy === 1 && sz === 1) return this; | |
| 3618 | + return this._t(sx, 0, 0, 0, 0, sy, 0, 0, 0, 0, sz, 0, 0, 0, 0, 1); | |
| 3619 | + } | |
| 3620 | + function setTransform(a, b, c, d, e, f, g, h, i, j, k, l, m, n, o, p) { | |
| 3621 | + this.props[0] = a; | |
| 3622 | + this.props[1] = b; | |
| 3623 | + this.props[2] = c; | |
| 3624 | + this.props[3] = d; | |
| 3625 | + this.props[4] = e; | |
| 3626 | + this.props[5] = f; | |
| 3627 | + this.props[6] = g; | |
| 3628 | + this.props[7] = h; | |
| 3629 | + this.props[8] = i; | |
| 3630 | + this.props[9] = j; | |
| 3631 | + this.props[10] = k; | |
| 3632 | + this.props[11] = l; | |
| 3633 | + this.props[12] = m; | |
| 3634 | + this.props[13] = n; | |
| 3635 | + this.props[14] = o; | |
| 3636 | + this.props[15] = p; | |
| 3637 | + return this; | |
| 3638 | + } | |
| 3639 | + function translate(tx, ty, tz) { | |
| 3640 | + tz = tz || 0; | |
| 3641 | + if (tx !== 0 || ty !== 0 || tz !== 0) return this._t(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, tx, ty, tz, 1); | |
| 3642 | + return this; | |
| 3643 | + } | |
| 3644 | + function transform(a2, b2, c2, d2, e2, f2, g2, h2, i2, j2, k2, l2, m2, n2, o2, p2) { | |
| 3645 | + var _p = this.props; | |
| 3646 | + if (a2 === 1 && b2 === 0 && c2 === 0 && d2 === 0 && e2 === 0 && f2 === 1 && g2 === 0 && h2 === 0 && i2 === 0 && j2 === 0 && k2 === 1 && l2 === 0) { | |
| 3647 | + _p[12] = _p[12] * a2 + _p[15] * m2; | |
| 3648 | + _p[13] = _p[13] * f2 + _p[15] * n2; | |
| 3649 | + _p[14] = _p[14] * k2 + _p[15] * o2; | |
| 3650 | + _p[15] *= p2; | |
| 3651 | + this._identityCalculated = false; | |
| 3652 | + return this; | |
| 3653 | + } | |
| 3654 | + var a1 = _p[0]; | |
| 3655 | + var b1 = _p[1]; | |
| 3656 | + var c1 = _p[2]; | |
| 3657 | + var d1 = _p[3]; | |
| 3658 | + var e1 = _p[4]; | |
| 3659 | + var f1 = _p[5]; | |
| 3660 | + var g1 = _p[6]; | |
| 3661 | + var h1 = _p[7]; | |
| 3662 | + var i1 = _p[8]; | |
| 3663 | + var j1 = _p[9]; | |
| 3664 | + var k1 = _p[10]; | |
| 3665 | + var l1 = _p[11]; | |
| 3666 | + var m1 = _p[12]; | |
| 3667 | + var n1 = _p[13]; | |
| 3668 | + var o1 = _p[14]; | |
| 3669 | + var p1 = _p[15]; | |
| 3670 | + _p[0] = a1 * a2 + b1 * e2 + c1 * i2 + d1 * m2; | |
| 3671 | + _p[1] = a1 * b2 + b1 * f2 + c1 * j2 + d1 * n2; | |
| 3672 | + _p[2] = a1 * c2 + b1 * g2 + c1 * k2 + d1 * o2; | |
| 3673 | + _p[3] = a1 * d2 + b1 * h2 + c1 * l2 + d1 * p2; | |
| 3674 | + _p[4] = e1 * a2 + f1 * e2 + g1 * i2 + h1 * m2; | |
| 3675 | + _p[5] = e1 * b2 + f1 * f2 + g1 * j2 + h1 * n2; | |
| 3676 | + _p[6] = e1 * c2 + f1 * g2 + g1 * k2 + h1 * o2; | |
| 3677 | + _p[7] = e1 * d2 + f1 * h2 + g1 * l2 + h1 * p2; | |
| 3678 | + _p[8] = i1 * a2 + j1 * e2 + k1 * i2 + l1 * m2; | |
| 3679 | + _p[9] = i1 * b2 + j1 * f2 + k1 * j2 + l1 * n2; | |
| 3680 | + _p[10] = i1 * c2 + j1 * g2 + k1 * k2 + l1 * o2; | |
| 3681 | + _p[11] = i1 * d2 + j1 * h2 + k1 * l2 + l1 * p2; | |
| 3682 | + _p[12] = m1 * a2 + n1 * e2 + o1 * i2 + p1 * m2; | |
| 3683 | + _p[13] = m1 * b2 + n1 * f2 + o1 * j2 + p1 * n2; | |
| 3684 | + _p[14] = m1 * c2 + n1 * g2 + o1 * k2 + p1 * o2; | |
| 3685 | + _p[15] = m1 * d2 + n1 * h2 + o1 * l2 + p1 * p2; | |
| 3686 | + this._identityCalculated = false; | |
| 3687 | + return this; | |
| 3688 | + } | |
| 3689 | + function multiply(matrix) { | |
| 3690 | + var matrixProps = matrix.props; | |
| 3691 | + return this.transform(matrixProps[0], matrixProps[1], matrixProps[2], matrixProps[3], matrixProps[4], matrixProps[5], matrixProps[6], matrixProps[7], matrixProps[8], matrixProps[9], matrixProps[10], matrixProps[11], matrixProps[12], matrixProps[13], matrixProps[14], matrixProps[15]); | |
| 3692 | + } | |
| 3693 | + function isIdentity() { | |
| 3694 | + if (!this._identityCalculated) { | |
| 3695 | + this._identity = !(this.props[0] !== 1 || this.props[1] !== 0 || this.props[2] !== 0 || this.props[3] !== 0 || this.props[4] !== 0 || this.props[5] !== 1 || this.props[6] !== 0 || this.props[7] !== 0 || this.props[8] !== 0 || this.props[9] !== 0 || this.props[10] !== 1 || this.props[11] !== 0 || this.props[12] !== 0 || this.props[13] !== 0 || this.props[14] !== 0 || this.props[15] !== 1); | |
| 3696 | + this._identityCalculated = true; | |
| 3697 | + } | |
| 3698 | + return this._identity; | |
| 3699 | + } | |
| 3700 | + function equals(matr) { | |
| 3701 | + var i = 0; | |
| 3702 | + while (i < 16) { | |
| 3703 | + if (matr.props[i] !== this.props[i]) return false; | |
| 3704 | + i += 1; | |
| 3705 | + } | |
| 3706 | + return true; | |
| 3707 | + } | |
| 3708 | + function clone(matr) { | |
| 3709 | + var i; | |
| 3710 | + for (i = 0; i < 16; i += 1) matr.props[i] = this.props[i]; | |
| 3711 | + return matr; | |
| 3712 | + } | |
| 3713 | + function cloneFromProps(props) { | |
| 3714 | + var i; | |
| 3715 | + for (i = 0; i < 16; i += 1) this.props[i] = props[i]; | |
| 3716 | + } | |
| 3717 | + function applyToPoint(x, y, z) { | |
| 3718 | + return { | |
| 3719 | + x: x * this.props[0] + y * this.props[4] + z * this.props[8] + this.props[12], | |
| 3720 | + y: x * this.props[1] + y * this.props[5] + z * this.props[9] + this.props[13], | |
| 3721 | + z: x * this.props[2] + y * this.props[6] + z * this.props[10] + this.props[14] | |
| 3722 | + }; | |
| 3723 | + } | |
| 3724 | + function applyToX(x, y, z) { | |
| 3725 | + return x * this.props[0] + y * this.props[4] + z * this.props[8] + this.props[12]; | |
| 3726 | + } | |
| 3727 | + function applyToY(x, y, z) { | |
| 3728 | + return x * this.props[1] + y * this.props[5] + z * this.props[9] + this.props[13]; | |
| 3729 | + } | |
| 3730 | + function applyToZ(x, y, z) { | |
| 3731 | + return x * this.props[2] + y * this.props[6] + z * this.props[10] + this.props[14]; | |
| 3732 | + } | |
| 3733 | + function getInverseMatrix() { | |
| 3734 | + var determinant = this.props[0] * this.props[5] - this.props[1] * this.props[4]; | |
| 3735 | + var a = this.props[5] / determinant; | |
| 3736 | + var b = -this.props[1] / determinant; | |
| 3737 | + var c = -this.props[4] / determinant; | |
| 3738 | + var d = this.props[0] / determinant; | |
| 3739 | + var e = (this.props[4] * this.props[13] - this.props[5] * this.props[12]) / determinant; | |
| 3740 | + var f = -(this.props[0] * this.props[13] - this.props[1] * this.props[12]) / determinant; | |
| 3741 | + var inverseMatrix = new Matrix(); | |
| 3742 | + inverseMatrix.props[0] = a; | |
| 3743 | + inverseMatrix.props[1] = b; | |
| 3744 | + inverseMatrix.props[4] = c; | |
| 3745 | + inverseMatrix.props[5] = d; | |
| 3746 | + inverseMatrix.props[12] = e; | |
| 3747 | + inverseMatrix.props[13] = f; | |
| 3748 | + return inverseMatrix; | |
| 3749 | + } | |
| 3750 | + function inversePoint(pt) { | |
| 3751 | + return this.getInverseMatrix().applyToPointArray(pt[0], pt[1], pt[2] || 0); | |
| 3752 | + } | |
| 3753 | + function inversePoints(pts) { | |
| 3754 | + var i; | |
| 3755 | + var len = pts.length; | |
| 3756 | + var retPts = []; | |
| 3757 | + for (i = 0; i < len; i += 1) retPts[i] = inversePoint(pts[i]); | |
| 3758 | + return retPts; | |
| 3759 | + } | |
| 3760 | + function applyToTriplePoints(pt1, pt2, pt3) { | |
| 3761 | + var arr = createTypedArray("float32", 6); | |
| 3762 | + if (this.isIdentity()) { | |
| 3763 | + arr[0] = pt1[0]; | |
| 3764 | + arr[1] = pt1[1]; | |
| 3765 | + arr[2] = pt2[0]; | |
| 3766 | + arr[3] = pt2[1]; | |
| 3767 | + arr[4] = pt3[0]; | |
| 3768 | + arr[5] = pt3[1]; | |
| 3769 | + } else { | |
| 3770 | + var p0 = this.props[0]; | |
| 3771 | + var p1 = this.props[1]; | |
| 3772 | + var p4 = this.props[4]; | |
| 3773 | + var p5 = this.props[5]; | |
| 3774 | + var p12 = this.props[12]; | |
| 3775 | + var p13 = this.props[13]; | |
| 3776 | + arr[0] = pt1[0] * p0 + pt1[1] * p4 + p12; | |
| 3777 | + arr[1] = pt1[0] * p1 + pt1[1] * p5 + p13; | |
| 3778 | + arr[2] = pt2[0] * p0 + pt2[1] * p4 + p12; | |
| 3779 | + arr[3] = pt2[0] * p1 + pt2[1] * p5 + p13; | |
| 3780 | + arr[4] = pt3[0] * p0 + pt3[1] * p4 + p12; | |
| 3781 | + arr[5] = pt3[0] * p1 + pt3[1] * p5 + p13; | |
| 3782 | + } | |
| 3783 | + return arr; | |
| 3784 | + } | |
| 3785 | + function applyToPointArray(x, y, z) { | |
| 3786 | + var arr; | |
| 3787 | + if (this.isIdentity()) arr = [ | |
| 3788 | + x, | |
| 3789 | + y, | |
| 3790 | + z | |
| 3791 | + ]; | |
| 3792 | + else arr = [ | |
| 3793 | + x * this.props[0] + y * this.props[4] + z * this.props[8] + this.props[12], | |
| 3794 | + x * this.props[1] + y * this.props[5] + z * this.props[9] + this.props[13], | |
| 3795 | + x * this.props[2] + y * this.props[6] + z * this.props[10] + this.props[14] | |
| 3796 | + ]; | |
| 3797 | + return arr; | |
| 3798 | + } | |
| 3799 | + function applyToPointStringified(x, y) { | |
| 3800 | + if (this.isIdentity()) return x + "," + y; | |
| 3801 | + var _p = this.props; | |
| 3802 | + return Math.round((x * _p[0] + y * _p[4] + _p[12]) * 100) / 100 + "," + Math.round((x * _p[1] + y * _p[5] + _p[13]) * 100) / 100; | |
| 3803 | + } | |
| 3804 | + function toCSS() { | |
| 3805 | + var i = 0; | |
| 3806 | + var props = this.props; | |
| 3807 | + var cssValue = "matrix3d("; | |
| 3808 | + var v = 1e4; | |
| 3809 | + while (i < 16) { | |
| 3810 | + cssValue += _rnd(props[i] * v) / v; | |
| 3811 | + cssValue += i === 15 ? ")" : ","; | |
| 3812 | + i += 1; | |
| 3813 | + } | |
| 3814 | + return cssValue; | |
| 3815 | + } | |
| 3816 | + function roundMatrixProperty(val) { | |
| 3817 | + var v = 1e4; | |
| 3818 | + if (val < 1e-6 && val > 0 || val > -1e-6 && val < 0) return _rnd(val * v) / v; | |
| 3819 | + return val; | |
| 3820 | + } | |
| 3821 | + function to2dCSS() { | |
| 3822 | + var props = this.props; | |
| 3823 | + var _a = roundMatrixProperty(props[0]); | |
| 3824 | + var _b = roundMatrixProperty(props[1]); | |
| 3825 | + var _c = roundMatrixProperty(props[4]); | |
| 3826 | + var _d = roundMatrixProperty(props[5]); | |
| 3827 | + var _e = roundMatrixProperty(props[12]); | |
| 3828 | + var _f = roundMatrixProperty(props[13]); | |
| 3829 | + return "matrix(" + _a + "," + _b + "," + _c + "," + _d + "," + _e + "," + _f + ")"; | |
| 3830 | + } | |
| 3831 | + return function() { | |
| 3832 | + this.reset = reset; | |
| 3833 | + this.rotate = rotate; | |
| 3834 | + this.rotateX = rotateX; | |
| 3835 | + this.rotateY = rotateY; | |
| 3836 | + this.rotateZ = rotateZ; | |
| 3837 | + this.skew = skew; | |
| 3838 | + this.skewFromAxis = skewFromAxis; | |
| 3839 | + this.shear = shear; | |
| 3840 | + this.scale = scale; | |
| 3841 | + this.setTransform = setTransform; | |
| 3842 | + this.translate = translate; | |
| 3843 | + this.transform = transform; | |
| 3844 | + this.multiply = multiply; | |
| 3845 | + this.applyToPoint = applyToPoint; | |
| 3846 | + this.applyToX = applyToX; | |
| 3847 | + this.applyToY = applyToY; | |
| 3848 | + this.applyToZ = applyToZ; | |
| 3849 | + this.applyToPointArray = applyToPointArray; | |
| 3850 | + this.applyToTriplePoints = applyToTriplePoints; | |
| 3851 | + this.applyToPointStringified = applyToPointStringified; | |
| 3852 | + this.toCSS = toCSS; | |
| 3853 | + this.to2dCSS = to2dCSS; | |
| 3854 | + this.clone = clone; | |
| 3855 | + this.cloneFromProps = cloneFromProps; | |
| 3856 | + this.equals = equals; | |
| 3857 | + this.inversePoints = inversePoints; | |
| 3858 | + this.inversePoint = inversePoint; | |
| 3859 | + this.getInverseMatrix = getInverseMatrix; | |
| 3860 | + this._t = this.transform; | |
| 3861 | + this.isIdentity = isIdentity; | |
| 3862 | + this._identity = true; | |
| 3863 | + this._identityCalculated = false; | |
| 3864 | + this.props = createTypedArray("float32", 16); | |
| 3865 | + this.reset(); | |
| 3866 | + }; | |
| 3867 | + }(); | |
| 3868 | + function _typeof$3(o) { | |
| 3869 | + "@babel/helpers - typeof"; | |
| 3870 | + return _typeof$3 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o) { | |
| 3871 | + return typeof o; | |
| 3872 | + } : function(o) { | |
| 3873 | + return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; | |
| 3874 | + }, _typeof$3(o); | |
| 3875 | + } | |
| 3876 | + var lottie = {}; | |
| 3877 | + var standalone = "__[STANDALONE]__"; | |
| 3878 | + var animationData = "__[ANIMATIONDATA]__"; | |
| 3879 | + var renderer = ""; | |
| 3880 | + function setLocation(href) { | |
| 3881 | + setLocationHref(href); | |
| 3882 | + } | |
| 3883 | + function searchAnimations() { | |
| 3884 | + if (standalone === true) animationManager.searchAnimations(animationData, standalone, renderer); | |
| 3885 | + else animationManager.searchAnimations(); | |
| 3886 | + } | |
| 3887 | + function setSubframeRendering(flag) { | |
| 3888 | + setSubframeEnabled(flag); | |
| 3889 | + } | |
| 3890 | + function setPrefix(prefix) { | |
| 3891 | + setIdPrefix(prefix); | |
| 3892 | + } | |
| 3893 | + function loadAnimation(params) { | |
| 3894 | + if (standalone === true) params.animationData = JSON.parse(animationData); | |
| 3895 | + return animationManager.loadAnimation(params); | |
| 3896 | + } | |
| 3897 | + function setQuality(value) { | |
| 3898 | + if (typeof value === "string") switch (value) { | |
| 3899 | + case "high": | |
| 3900 | + setDefaultCurveSegments(200); | |
| 3901 | + break; | |
| 3902 | + default: | |
| 3903 | + case "medium": | |
| 3904 | + setDefaultCurveSegments(50); | |
| 3905 | + break; | |
| 3906 | + case "low": | |
| 3907 | + setDefaultCurveSegments(10); | |
| 3908 | + break; | |
| 3909 | + } | |
| 3910 | + else if (!isNaN(value) && value > 1) setDefaultCurveSegments(value); | |
| 3911 | + if (getDefaultCurveSegments() >= 50) roundValues(false); | |
| 3912 | + else roundValues(true); | |
| 3913 | + } | |
| 3914 | + function inBrowser() { | |
| 3915 | + return typeof navigator !== "undefined"; | |
| 3916 | + } | |
| 3917 | + function installPlugin(type, plugin) { | |
| 3918 | + if (type === "expressions") setExpressionsPlugin(plugin); | |
| 3919 | + } | |
| 3920 | + function getFactory(name) { | |
| 3921 | + switch (name) { | |
| 3922 | + case "propertyFactory": return PropertyFactory; | |
| 3923 | + case "shapePropertyFactory": return ShapePropertyFactory; | |
| 3924 | + case "matrix": return Matrix; | |
| 3925 | + default: return null; | |
| 3926 | + } | |
| 3927 | + } | |
| 3928 | + lottie.play = animationManager.play; | |
| 3929 | + lottie.pause = animationManager.pause; | |
| 3930 | + lottie.setLocationHref = setLocation; | |
| 3931 | + lottie.togglePause = animationManager.togglePause; | |
| 3932 | + lottie.setSpeed = animationManager.setSpeed; | |
| 3933 | + lottie.setDirection = animationManager.setDirection; | |
| 3934 | + lottie.stop = animationManager.stop; | |
| 3935 | + lottie.searchAnimations = searchAnimations; | |
| 3936 | + lottie.registerAnimation = animationManager.registerAnimation; | |
| 3937 | + lottie.loadAnimation = loadAnimation; | |
| 3938 | + lottie.setSubframeRendering = setSubframeRendering; | |
| 3939 | + lottie.resize = animationManager.resize; | |
| 3940 | + lottie.goToAndStop = animationManager.goToAndStop; | |
| 3941 | + lottie.destroy = animationManager.destroy; | |
| 3942 | + lottie.setQuality = setQuality; | |
| 3943 | + lottie.inBrowser = inBrowser; | |
| 3944 | + lottie.installPlugin = installPlugin; | |
| 3945 | + lottie.freeze = animationManager.freeze; | |
| 3946 | + lottie.unfreeze = animationManager.unfreeze; | |
| 3947 | + lottie.setVolume = animationManager.setVolume; | |
| 3948 | + lottie.mute = animationManager.mute; | |
| 3949 | + lottie.unmute = animationManager.unmute; | |
| 3950 | + lottie.getRegisteredAnimations = animationManager.getRegisteredAnimations; | |
| 3951 | + lottie.useWebWorker = setWebWorker; | |
| 3952 | + lottie.setIDPrefix = setPrefix; | |
| 3953 | + lottie.__getFactory = getFactory; | |
| 3954 | + lottie.version = "5.13.0"; | |
| 3955 | + function checkReady() { | |
| 3956 | + if (document.readyState === "complete") { | |
| 3957 | + clearInterval(readyStateCheckInterval); | |
| 3958 | + searchAnimations(); | |
| 3959 | + } | |
| 3960 | + } | |
| 3961 | + function getQueryVariable(variable) { | |
| 3962 | + var vars = queryString.split("&"); | |
| 3963 | + for (var i = 0; i < vars.length; i += 1) { | |
| 3964 | + var pair = vars[i].split("="); | |
| 3965 | + if (decodeURIComponent(pair[0]) == variable) return decodeURIComponent(pair[1]); | |
| 3966 | + } | |
| 3967 | + return null; | |
| 3968 | + } | |
| 3969 | + var queryString = ""; | |
| 3970 | + if (standalone) { | |
| 3971 | + var scripts = document.getElementsByTagName("script"); | |
| 3972 | + var myScript = scripts[scripts.length - 1] || { src: "" }; | |
| 3973 | + queryString = myScript.src ? myScript.src.replace(/^[^\?]+\??/, "") : ""; | |
| 3974 | + renderer = getQueryVariable("renderer"); | |
| 3975 | + } | |
| 3976 | + var readyStateCheckInterval = setInterval(checkReady, 100); | |
| 3977 | + try { | |
| 3978 | + if (!((typeof exports === "undefined" ? "undefined" : _typeof$3(exports)) === "object" && typeof module !== "undefined") && !(typeof define === "function" && define.amd)) window.bodymovin = lottie; | |
| 3979 | + } catch (err) {} | |
| 3980 | + var ShapeModifiers = function() { | |
| 3981 | + var ob = {}; | |
| 3982 | + var modifiers = {}; | |
| 3983 | + ob.registerModifier = registerModifier; | |
| 3984 | + ob.getModifier = getModifier; | |
| 3985 | + function registerModifier(nm, factory) { | |
| 3986 | + if (!modifiers[nm]) modifiers[nm] = factory; | |
| 3987 | + } | |
| 3988 | + function getModifier(nm, elem, data) { | |
| 3989 | + return new modifiers[nm](elem, data); | |
| 3990 | + } | |
| 3991 | + return ob; | |
| 3992 | + }(); | |
| 3993 | + function ShapeModifier() {} | |
| 3994 | + ShapeModifier.prototype.initModifierProperties = function() {}; | |
| 3995 | + ShapeModifier.prototype.addShapeToModifier = function() {}; | |
| 3996 | + ShapeModifier.prototype.addShape = function(data) { | |
| 3997 | + if (!this.closed) { | |
| 3998 | + data.sh.container.addDynamicProperty(data.sh); | |
| 3999 | + var shapeData = { | |
| 4000 | + shape: data.sh, | |
| 4001 | + data, | |
| 4002 | + localShapeCollection: shapeCollectionPool.newShapeCollection() | |
| 4003 | + }; | |
| 4004 | + this.shapes.push(shapeData); | |
| 4005 | + this.addShapeToModifier(shapeData); | |
| 4006 | + if (this._isAnimated) data.setAsAnimated(); | |
| 4007 | + } | |
| 4008 | + }; | |
| 4009 | + ShapeModifier.prototype.init = function(elem, data) { | |
| 4010 | + this.shapes = []; | |
| 4011 | + this.elem = elem; | |
| 4012 | + this.initDynamicPropertyContainer(elem); | |
| 4013 | + this.initModifierProperties(elem, data); | |
| 4014 | + this.frameId = initialDefaultFrame; | |
| 4015 | + this.closed = false; | |
| 4016 | + this.k = false; | |
| 4017 | + if (this.dynamicProperties.length) this.k = true; | |
| 4018 | + else this.getValue(true); | |
| 4019 | + }; | |
| 4020 | + ShapeModifier.prototype.processKeys = function() { | |
| 4021 | + if (this.elem.globalData.frameId === this.frameId) return; | |
| 4022 | + this.frameId = this.elem.globalData.frameId; | |
| 4023 | + this.iterateDynamicProperties(); | |
| 4024 | + }; | |
| 4025 | + extendPrototype([DynamicPropertyContainer], ShapeModifier); | |
| 4026 | + function TrimModifier() {} | |
| 4027 | + extendPrototype([ShapeModifier], TrimModifier); | |
| 4028 | + TrimModifier.prototype.initModifierProperties = function(elem, data) { | |
| 4029 | + this.s = PropertyFactory.getProp(elem, data.s, 0, .01, this); | |
| 4030 | + this.e = PropertyFactory.getProp(elem, data.e, 0, .01, this); | |
| 4031 | + this.o = PropertyFactory.getProp(elem, data.o, 0, 0, this); | |
| 4032 | + this.sValue = 0; | |
| 4033 | + this.eValue = 0; | |
| 4034 | + this.getValue = this.processKeys; | |
| 4035 | + this.m = data.m; | |
| 4036 | + this._isAnimated = !!this.s.effectsSequence.length || !!this.e.effectsSequence.length || !!this.o.effectsSequence.length; | |
| 4037 | + }; | |
| 4038 | + TrimModifier.prototype.addShapeToModifier = function(shapeData) { | |
| 4039 | + shapeData.pathsData = []; | |
| 4040 | + }; | |
| 4041 | + TrimModifier.prototype.calculateShapeEdges = function(s, e, shapeLength, addedLength, totalModifierLength) { | |
| 4042 | + var segments = []; | |
| 4043 | + if (e <= 1) segments.push({ | |
| 4044 | + s, | |
| 4045 | + e | |
| 4046 | + }); | |
| 4047 | + else if (s >= 1) segments.push({ | |
| 4048 | + s: s - 1, | |
| 4049 | + e: e - 1 | |
| 4050 | + }); | |
| 4051 | + else { | |
| 4052 | + segments.push({ | |
| 4053 | + s, | |
| 4054 | + e: 1 | |
| 4055 | + }); | |
| 4056 | + segments.push({ | |
| 4057 | + s: 0, | |
| 4058 | + e: e - 1 | |
| 4059 | + }); | |
| 4060 | + } | |
| 4061 | + var shapeSegments = []; | |
| 4062 | + var i; | |
| 4063 | + var len = segments.length; | |
| 4064 | + var segmentOb; | |
| 4065 | + for (i = 0; i < len; i += 1) { | |
| 4066 | + segmentOb = segments[i]; | |
| 4067 | + if (!(segmentOb.e * totalModifierLength < addedLength || segmentOb.s * totalModifierLength > addedLength + shapeLength)) { | |
| 4068 | + var shapeS; | |
| 4069 | + var shapeE; | |
| 4070 | + if (segmentOb.s * totalModifierLength <= addedLength) shapeS = 0; | |
| 4071 | + else shapeS = (segmentOb.s * totalModifierLength - addedLength) / shapeLength; | |
| 4072 | + if (segmentOb.e * totalModifierLength >= addedLength + shapeLength) shapeE = 1; | |
| 4073 | + else shapeE = (segmentOb.e * totalModifierLength - addedLength) / shapeLength; | |
| 4074 | + shapeSegments.push([shapeS, shapeE]); | |
| 4075 | + } | |
| 4076 | + } | |
| 4077 | + if (!shapeSegments.length) shapeSegments.push([0, 0]); | |
| 4078 | + return shapeSegments; | |
| 4079 | + }; | |
| 4080 | + TrimModifier.prototype.releasePathsData = function(pathsData) { | |
| 4081 | + var i; | |
| 4082 | + var len = pathsData.length; | |
| 4083 | + for (i = 0; i < len; i += 1) segmentsLengthPool.release(pathsData[i]); | |
| 4084 | + pathsData.length = 0; | |
| 4085 | + return pathsData; | |
| 4086 | + }; | |
| 4087 | + TrimModifier.prototype.processShapes = function(_isFirstFrame) { | |
| 4088 | + var s; | |
| 4089 | + var e; | |
| 4090 | + if (this._mdf || _isFirstFrame) { | |
| 4091 | + var o = this.o.v % 360 / 360; | |
| 4092 | + if (o < 0) o += 1; | |
| 4093 | + if (this.s.v > 1) s = 1 + o; | |
| 4094 | + else if (this.s.v < 0) s = 0 + o; | |
| 4095 | + else s = this.s.v + o; | |
| 4096 | + if (this.e.v > 1) e = 1 + o; | |
| 4097 | + else if (this.e.v < 0) e = 0 + o; | |
| 4098 | + else e = this.e.v + o; | |
| 4099 | + if (s > e) { | |
| 4100 | + var _s = s; | |
| 4101 | + s = e; | |
| 4102 | + e = _s; | |
| 4103 | + } | |
| 4104 | + s = Math.round(s * 1e4) * 1e-4; | |
| 4105 | + e = Math.round(e * 1e4) * 1e-4; | |
| 4106 | + this.sValue = s; | |
| 4107 | + this.eValue = e; | |
| 4108 | + } else { | |
| 4109 | + s = this.sValue; | |
| 4110 | + e = this.eValue; | |
| 4111 | + } | |
| 4112 | + var shapePaths; | |
| 4113 | + var i; | |
| 4114 | + var len = this.shapes.length; | |
| 4115 | + var j; | |
| 4116 | + var jLen; | |
| 4117 | + var pathsData; | |
| 4118 | + var pathData; | |
| 4119 | + var totalShapeLength; | |
| 4120 | + var totalModifierLength = 0; | |
| 4121 | + if (e === s) for (i = 0; i < len; i += 1) { | |
| 4122 | + this.shapes[i].localShapeCollection.releaseShapes(); | |
| 4123 | + this.shapes[i].shape._mdf = true; | |
| 4124 | + this.shapes[i].shape.paths = this.shapes[i].localShapeCollection; | |
| 4125 | + if (this._mdf) this.shapes[i].pathsData.length = 0; | |
| 4126 | + } | |
| 4127 | + else if (!(e === 1 && s === 0 || e === 0 && s === 1)) { | |
| 4128 | + var segments = []; | |
| 4129 | + var shapeData; | |
| 4130 | + var localShapeCollection; | |
| 4131 | + for (i = 0; i < len; i += 1) { | |
| 4132 | + shapeData = this.shapes[i]; | |
| 4133 | + if (!shapeData.shape._mdf && !this._mdf && !_isFirstFrame && this.m !== 2) shapeData.shape.paths = shapeData.localShapeCollection; | |
| 4134 | + else { | |
| 4135 | + shapePaths = shapeData.shape.paths; | |
| 4136 | + jLen = shapePaths._length; | |
| 4137 | + totalShapeLength = 0; | |
| 4138 | + if (!shapeData.shape._mdf && shapeData.pathsData.length) totalShapeLength = shapeData.totalShapeLength; | |
| 4139 | + else { | |
| 4140 | + pathsData = this.releasePathsData(shapeData.pathsData); | |
| 4141 | + for (j = 0; j < jLen; j += 1) { | |
| 4142 | + pathData = bez.getSegmentsLength(shapePaths.shapes[j]); | |
| 4143 | + pathsData.push(pathData); | |
| 4144 | + totalShapeLength += pathData.totalLength; | |
| 4145 | + } | |
| 4146 | + shapeData.totalShapeLength = totalShapeLength; | |
| 4147 | + shapeData.pathsData = pathsData; | |
| 4148 | + } | |
| 4149 | + totalModifierLength += totalShapeLength; | |
| 4150 | + shapeData.shape._mdf = true; | |
| 4151 | + } | |
| 4152 | + } | |
| 4153 | + var shapeS = s; | |
| 4154 | + var shapeE = e; | |
| 4155 | + var addedLength = 0; | |
| 4156 | + var edges; | |
| 4157 | + for (i = len - 1; i >= 0; i -= 1) { | |
| 4158 | + shapeData = this.shapes[i]; | |
| 4159 | + if (shapeData.shape._mdf) { | |
| 4160 | + localShapeCollection = shapeData.localShapeCollection; | |
| 4161 | + localShapeCollection.releaseShapes(); | |
| 4162 | + if (this.m === 2 && len > 1) { | |
| 4163 | + edges = this.calculateShapeEdges(s, e, shapeData.totalShapeLength, addedLength, totalModifierLength); | |
| 4164 | + addedLength += shapeData.totalShapeLength; | |
| 4165 | + } else edges = [[shapeS, shapeE]]; | |
| 4166 | + jLen = edges.length; | |
| 4167 | + for (j = 0; j < jLen; j += 1) { | |
| 4168 | + shapeS = edges[j][0]; | |
| 4169 | + shapeE = edges[j][1]; | |
| 4170 | + segments.length = 0; | |
| 4171 | + if (shapeE <= 1) segments.push({ | |
| 4172 | + s: shapeData.totalShapeLength * shapeS, | |
| 4173 | + e: shapeData.totalShapeLength * shapeE | |
| 4174 | + }); | |
| 4175 | + else if (shapeS >= 1) segments.push({ | |
| 4176 | + s: shapeData.totalShapeLength * (shapeS - 1), | |
| 4177 | + e: shapeData.totalShapeLength * (shapeE - 1) | |
| 4178 | + }); | |
| 4179 | + else { | |
| 4180 | + segments.push({ | |
| 4181 | + s: shapeData.totalShapeLength * shapeS, | |
| 4182 | + e: shapeData.totalShapeLength | |
| 4183 | + }); | |
| 4184 | + segments.push({ | |
| 4185 | + s: 0, | |
| 4186 | + e: shapeData.totalShapeLength * (shapeE - 1) | |
| 4187 | + }); | |
| 4188 | + } | |
| 4189 | + var newShapesData = this.addShapes(shapeData, segments[0]); | |
| 4190 | + if (segments[0].s !== segments[0].e) { | |
| 4191 | + if (segments.length > 1) if (shapeData.shape.paths.shapes[shapeData.shape.paths._length - 1].c) { | |
| 4192 | + var lastShape = newShapesData.pop(); | |
| 4193 | + this.addPaths(newShapesData, localShapeCollection); | |
| 4194 | + newShapesData = this.addShapes(shapeData, segments[1], lastShape); | |
| 4195 | + } else { | |
| 4196 | + this.addPaths(newShapesData, localShapeCollection); | |
| 4197 | + newShapesData = this.addShapes(shapeData, segments[1]); | |
| 4198 | + } | |
| 4199 | + this.addPaths(newShapesData, localShapeCollection); | |
| 4200 | + } | |
| 4201 | + } | |
| 4202 | + shapeData.shape.paths = localShapeCollection; | |
| 4203 | + } | |
| 4204 | + } | |
| 4205 | + } else if (this._mdf) for (i = 0; i < len; i += 1) { | |
| 4206 | + this.shapes[i].pathsData.length = 0; | |
| 4207 | + this.shapes[i].shape._mdf = true; | |
| 4208 | + } | |
| 4209 | + }; | |
| 4210 | + TrimModifier.prototype.addPaths = function(newPaths, localShapeCollection) { | |
| 4211 | + var i; | |
| 4212 | + var len = newPaths.length; | |
| 4213 | + for (i = 0; i < len; i += 1) localShapeCollection.addShape(newPaths[i]); | |
| 4214 | + }; | |
| 4215 | + TrimModifier.prototype.addSegment = function(pt1, pt2, pt3, pt4, shapePath, pos, newShape) { | |
| 4216 | + shapePath.setXYAt(pt2[0], pt2[1], "o", pos); | |
| 4217 | + shapePath.setXYAt(pt3[0], pt3[1], "i", pos + 1); | |
| 4218 | + if (newShape) shapePath.setXYAt(pt1[0], pt1[1], "v", pos); | |
| 4219 | + shapePath.setXYAt(pt4[0], pt4[1], "v", pos + 1); | |
| 4220 | + }; | |
| 4221 | + TrimModifier.prototype.addSegmentFromArray = function(points, shapePath, pos, newShape) { | |
| 4222 | + shapePath.setXYAt(points[1], points[5], "o", pos); | |
| 4223 | + shapePath.setXYAt(points[2], points[6], "i", pos + 1); | |
| 4224 | + if (newShape) shapePath.setXYAt(points[0], points[4], "v", pos); | |
| 4225 | + shapePath.setXYAt(points[3], points[7], "v", pos + 1); | |
| 4226 | + }; | |
| 4227 | + TrimModifier.prototype.addShapes = function(shapeData, shapeSegment, shapePath) { | |
| 4228 | + var pathsData = shapeData.pathsData; | |
| 4229 | + var shapePaths = shapeData.shape.paths.shapes; | |
| 4230 | + var i; | |
| 4231 | + var len = shapeData.shape.paths._length; | |
| 4232 | + var j; | |
| 4233 | + var jLen; | |
| 4234 | + var addedLength = 0; | |
| 4235 | + var currentLengthData; | |
| 4236 | + var segmentCount; | |
| 4237 | + var lengths; | |
| 4238 | + var segment; | |
| 4239 | + var shapes = []; | |
| 4240 | + var initPos; | |
| 4241 | + var newShape = true; | |
| 4242 | + if (!shapePath) { | |
| 4243 | + shapePath = shapePool.newElement(); | |
| 4244 | + segmentCount = 0; | |
| 4245 | + initPos = 0; | |
| 4246 | + } else { | |
| 4247 | + segmentCount = shapePath._length; | |
| 4248 | + initPos = shapePath._length; | |
| 4249 | + } | |
| 4250 | + shapes.push(shapePath); | |
| 4251 | + for (i = 0; i < len; i += 1) { | |
| 4252 | + lengths = pathsData[i].lengths; | |
| 4253 | + shapePath.c = shapePaths[i].c; | |
| 4254 | + jLen = shapePaths[i].c ? lengths.length : lengths.length + 1; | |
| 4255 | + for (j = 1; j < jLen; j += 1) { | |
| 4256 | + currentLengthData = lengths[j - 1]; | |
| 4257 | + if (addedLength + currentLengthData.addedLength < shapeSegment.s) { | |
| 4258 | + addedLength += currentLengthData.addedLength; | |
| 4259 | + shapePath.c = false; | |
| 4260 | + } else if (addedLength > shapeSegment.e) { | |
| 4261 | + shapePath.c = false; | |
| 4262 | + break; | |
| 4263 | + } else { | |
| 4264 | + if (shapeSegment.s <= addedLength && shapeSegment.e >= addedLength + currentLengthData.addedLength) { | |
| 4265 | + this.addSegment(shapePaths[i].v[j - 1], shapePaths[i].o[j - 1], shapePaths[i].i[j], shapePaths[i].v[j], shapePath, segmentCount, newShape); | |
| 4266 | + newShape = false; | |
| 4267 | + } else { | |
| 4268 | + segment = bez.getNewSegment(shapePaths[i].v[j - 1], shapePaths[i].v[j], shapePaths[i].o[j - 1], shapePaths[i].i[j], (shapeSegment.s - addedLength) / currentLengthData.addedLength, (shapeSegment.e - addedLength) / currentLengthData.addedLength, lengths[j - 1]); | |
| 4269 | + this.addSegmentFromArray(segment, shapePath, segmentCount, newShape); | |
| 4270 | + newShape = false; | |
| 4271 | + shapePath.c = false; | |
| 4272 | + } | |
| 4273 | + addedLength += currentLengthData.addedLength; | |
| 4274 | + segmentCount += 1; | |
| 4275 | + } | |
| 4276 | + } | |
| 4277 | + if (shapePaths[i].c && lengths.length) { | |
| 4278 | + currentLengthData = lengths[j - 1]; | |
| 4279 | + if (addedLength <= shapeSegment.e) { | |
| 4280 | + var segmentLength = lengths[j - 1].addedLength; | |
| 4281 | + if (shapeSegment.s <= addedLength && shapeSegment.e >= addedLength + segmentLength) { | |
| 4282 | + this.addSegment(shapePaths[i].v[j - 1], shapePaths[i].o[j - 1], shapePaths[i].i[0], shapePaths[i].v[0], shapePath, segmentCount, newShape); | |
| 4283 | + newShape = false; | |
| 4284 | + } else { | |
| 4285 | + segment = bez.getNewSegment(shapePaths[i].v[j - 1], shapePaths[i].v[0], shapePaths[i].o[j - 1], shapePaths[i].i[0], (shapeSegment.s - addedLength) / segmentLength, (shapeSegment.e - addedLength) / segmentLength, lengths[j - 1]); | |
| 4286 | + this.addSegmentFromArray(segment, shapePath, segmentCount, newShape); | |
| 4287 | + newShape = false; | |
| 4288 | + shapePath.c = false; | |
| 4289 | + } | |
| 4290 | + } else shapePath.c = false; | |
| 4291 | + addedLength += currentLengthData.addedLength; | |
| 4292 | + segmentCount += 1; | |
| 4293 | + } | |
| 4294 | + if (shapePath._length) { | |
| 4295 | + shapePath.setXYAt(shapePath.v[initPos][0], shapePath.v[initPos][1], "i", initPos); | |
| 4296 | + shapePath.setXYAt(shapePath.v[shapePath._length - 1][0], shapePath.v[shapePath._length - 1][1], "o", shapePath._length - 1); | |
| 4297 | + } | |
| 4298 | + if (addedLength > shapeSegment.e) break; | |
| 4299 | + if (i < len - 1) { | |
| 4300 | + shapePath = shapePool.newElement(); | |
| 4301 | + newShape = true; | |
| 4302 | + shapes.push(shapePath); | |
| 4303 | + segmentCount = 0; | |
| 4304 | + } | |
| 4305 | + } | |
| 4306 | + return shapes; | |
| 4307 | + }; | |
| 4308 | + function PuckerAndBloatModifier() {} | |
| 4309 | + extendPrototype([ShapeModifier], PuckerAndBloatModifier); | |
| 4310 | + PuckerAndBloatModifier.prototype.initModifierProperties = function(elem, data) { | |
| 4311 | + this.getValue = this.processKeys; | |
| 4312 | + this.amount = PropertyFactory.getProp(elem, data.a, 0, null, this); | |
| 4313 | + this._isAnimated = !!this.amount.effectsSequence.length; | |
| 4314 | + }; | |
| 4315 | + PuckerAndBloatModifier.prototype.processPath = function(path, amount) { | |
| 4316 | + var percent = amount / 100; | |
| 4317 | + var centerPoint = [0, 0]; | |
| 4318 | + var pathLength = path._length; | |
| 4319 | + var i = 0; | |
| 4320 | + for (i = 0; i < pathLength; i += 1) { | |
| 4321 | + centerPoint[0] += path.v[i][0]; | |
| 4322 | + centerPoint[1] += path.v[i][1]; | |
| 4323 | + } | |
| 4324 | + centerPoint[0] /= pathLength; | |
| 4325 | + centerPoint[1] /= pathLength; | |
| 4326 | + var clonedPath = shapePool.newElement(); | |
| 4327 | + clonedPath.c = path.c; | |
| 4328 | + var vX; | |
| 4329 | + var vY; | |
| 4330 | + var oX; | |
| 4331 | + var oY; | |
| 4332 | + var iX; | |
| 4333 | + var iY; | |
| 4334 | + for (i = 0; i < pathLength; i += 1) { | |
| 4335 | + vX = path.v[i][0] + (centerPoint[0] - path.v[i][0]) * percent; | |
| 4336 | + vY = path.v[i][1] + (centerPoint[1] - path.v[i][1]) * percent; | |
| 4337 | + oX = path.o[i][0] + (centerPoint[0] - path.o[i][0]) * -percent; | |
| 4338 | + oY = path.o[i][1] + (centerPoint[1] - path.o[i][1]) * -percent; | |
| 4339 | + iX = path.i[i][0] + (centerPoint[0] - path.i[i][0]) * -percent; | |
| 4340 | + iY = path.i[i][1] + (centerPoint[1] - path.i[i][1]) * -percent; | |
| 4341 | + clonedPath.setTripleAt(vX, vY, oX, oY, iX, iY, i); | |
| 4342 | + } | |
| 4343 | + return clonedPath; | |
| 4344 | + }; | |
| 4345 | + PuckerAndBloatModifier.prototype.processShapes = function(_isFirstFrame) { | |
| 4346 | + var shapePaths; | |
| 4347 | + var i; | |
| 4348 | + var len = this.shapes.length; | |
| 4349 | + var j; | |
| 4350 | + var jLen; | |
| 4351 | + var amount = this.amount.v; | |
| 4352 | + if (amount !== 0) { | |
| 4353 | + var shapeData; | |
| 4354 | + var localShapeCollection; | |
| 4355 | + for (i = 0; i < len; i += 1) { | |
| 4356 | + shapeData = this.shapes[i]; | |
| 4357 | + localShapeCollection = shapeData.localShapeCollection; | |
| 4358 | + if (!(!shapeData.shape._mdf && !this._mdf && !_isFirstFrame)) { | |
| 4359 | + localShapeCollection.releaseShapes(); | |
| 4360 | + shapeData.shape._mdf = true; | |
| 4361 | + shapePaths = shapeData.shape.paths.shapes; | |
| 4362 | + jLen = shapeData.shape.paths._length; | |
| 4363 | + for (j = 0; j < jLen; j += 1) localShapeCollection.addShape(this.processPath(shapePaths[j], amount)); | |
| 4364 | + } | |
| 4365 | + shapeData.shape.paths = shapeData.localShapeCollection; | |
| 4366 | + } | |
| 4367 | + } | |
| 4368 | + if (!this.dynamicProperties.length) this._mdf = false; | |
| 4369 | + }; | |
| 4370 | + var TransformPropertyFactory = function() { | |
| 4371 | + var defaultVector = [0, 0]; | |
| 4372 | + function applyToMatrix(mat) { | |
| 4373 | + var _mdf = this._mdf; | |
| 4374 | + this.iterateDynamicProperties(); | |
| 4375 | + this._mdf = this._mdf || _mdf; | |
| 4376 | + if (this.a) mat.translate(-this.a.v[0], -this.a.v[1], this.a.v[2]); | |
| 4377 | + if (this.s) mat.scale(this.s.v[0], this.s.v[1], this.s.v[2]); | |
| 4378 | + if (this.sk) mat.skewFromAxis(-this.sk.v, this.sa.v); | |
| 4379 | + if (this.r) mat.rotate(-this.r.v); | |
| 4380 | + else mat.rotateZ(-this.rz.v).rotateY(this.ry.v).rotateX(this.rx.v).rotateZ(-this.or.v[2]).rotateY(this.or.v[1]).rotateX(this.or.v[0]); | |
| 4381 | + if (this.data.p.s) if (this.data.p.z) mat.translate(this.px.v, this.py.v, -this.pz.v); | |
| 4382 | + else mat.translate(this.px.v, this.py.v, 0); | |
| 4383 | + else mat.translate(this.p.v[0], this.p.v[1], -this.p.v[2]); | |
| 4384 | + } | |
| 4385 | + function processKeys(forceRender) { | |
| 4386 | + if (this.elem.globalData.frameId === this.frameId) return; | |
| 4387 | + if (this._isDirty) { | |
| 4388 | + this.precalculateMatrix(); | |
| 4389 | + this._isDirty = false; | |
| 4390 | + } | |
| 4391 | + this.iterateDynamicProperties(); | |
| 4392 | + if (this._mdf || forceRender) { | |
| 4393 | + var frameRate; | |
| 4394 | + this.v.cloneFromProps(this.pre.props); | |
| 4395 | + if (this.appliedTransformations < 1) this.v.translate(-this.a.v[0], -this.a.v[1], this.a.v[2]); | |
| 4396 | + if (this.appliedTransformations < 2) this.v.scale(this.s.v[0], this.s.v[1], this.s.v[2]); | |
| 4397 | + if (this.sk && this.appliedTransformations < 3) this.v.skewFromAxis(-this.sk.v, this.sa.v); | |
| 4398 | + if (this.r && this.appliedTransformations < 4) this.v.rotate(-this.r.v); | |
| 4399 | + else if (!this.r && this.appliedTransformations < 4) this.v.rotateZ(-this.rz.v).rotateY(this.ry.v).rotateX(this.rx.v).rotateZ(-this.or.v[2]).rotateY(this.or.v[1]).rotateX(this.or.v[0]); | |
| 4400 | + if (this.autoOriented) { | |
| 4401 | + var v1; | |
| 4402 | + var v2; | |
| 4403 | + frameRate = this.elem.globalData.frameRate; | |
| 4404 | + if (this.p && this.p.keyframes && this.p.getValueAtTime) if (this.p._caching.lastFrame + this.p.offsetTime <= this.p.keyframes[0].t) { | |
| 4405 | + v1 = this.p.getValueAtTime((this.p.keyframes[0].t + .01) / frameRate, 0); | |
| 4406 | + v2 = this.p.getValueAtTime(this.p.keyframes[0].t / frameRate, 0); | |
| 4407 | + } else if (this.p._caching.lastFrame + this.p.offsetTime >= this.p.keyframes[this.p.keyframes.length - 1].t) { | |
| 4408 | + v1 = this.p.getValueAtTime(this.p.keyframes[this.p.keyframes.length - 1].t / frameRate, 0); | |
| 4409 | + v2 = this.p.getValueAtTime((this.p.keyframes[this.p.keyframes.length - 1].t - .05) / frameRate, 0); | |
| 4410 | + } else { | |
| 4411 | + v1 = this.p.pv; | |
| 4412 | + v2 = this.p.getValueAtTime((this.p._caching.lastFrame + this.p.offsetTime - .01) / frameRate, this.p.offsetTime); | |
| 4413 | + } | |
| 4414 | + else if (this.px && this.px.keyframes && this.py.keyframes && this.px.getValueAtTime && this.py.getValueAtTime) { | |
| 4415 | + v1 = []; | |
| 4416 | + v2 = []; | |
| 4417 | + var px = this.px; | |
| 4418 | + var py = this.py; | |
| 4419 | + if (px._caching.lastFrame + px.offsetTime <= px.keyframes[0].t) { | |
| 4420 | + v1[0] = px.getValueAtTime((px.keyframes[0].t + .01) / frameRate, 0); | |
| 4421 | + v1[1] = py.getValueAtTime((py.keyframes[0].t + .01) / frameRate, 0); | |
| 4422 | + v2[0] = px.getValueAtTime(px.keyframes[0].t / frameRate, 0); | |
| 4423 | + v2[1] = py.getValueAtTime(py.keyframes[0].t / frameRate, 0); | |
| 4424 | + } else if (px._caching.lastFrame + px.offsetTime >= px.keyframes[px.keyframes.length - 1].t) { | |
| 4425 | + v1[0] = px.getValueAtTime(px.keyframes[px.keyframes.length - 1].t / frameRate, 0); | |
| 4426 | + v1[1] = py.getValueAtTime(py.keyframes[py.keyframes.length - 1].t / frameRate, 0); | |
| 4427 | + v2[0] = px.getValueAtTime((px.keyframes[px.keyframes.length - 1].t - .01) / frameRate, 0); | |
| 4428 | + v2[1] = py.getValueAtTime((py.keyframes[py.keyframes.length - 1].t - .01) / frameRate, 0); | |
| 4429 | + } else { | |
| 4430 | + v1 = [px.pv, py.pv]; | |
| 4431 | + v2[0] = px.getValueAtTime((px._caching.lastFrame + px.offsetTime - .01) / frameRate, px.offsetTime); | |
| 4432 | + v2[1] = py.getValueAtTime((py._caching.lastFrame + py.offsetTime - .01) / frameRate, py.offsetTime); | |
| 4433 | + } | |
| 4434 | + } else { | |
| 4435 | + v2 = defaultVector; | |
| 4436 | + v1 = v2; | |
| 4437 | + } | |
| 4438 | + this.v.rotate(-Math.atan2(v1[1] - v2[1], v1[0] - v2[0])); | |
| 4439 | + } | |
| 4440 | + if (this.data.p && this.data.p.s) if (this.data.p.z) this.v.translate(this.px.v, this.py.v, -this.pz.v); | |
| 4441 | + else this.v.translate(this.px.v, this.py.v, 0); | |
| 4442 | + else this.v.translate(this.p.v[0], this.p.v[1], -this.p.v[2]); | |
| 4443 | + } | |
| 4444 | + this.frameId = this.elem.globalData.frameId; | |
| 4445 | + } | |
| 4446 | + function precalculateMatrix() { | |
| 4447 | + this.appliedTransformations = 0; | |
| 4448 | + this.pre.reset(); | |
| 4449 | + if (!this.a.effectsSequence.length) { | |
| 4450 | + this.pre.translate(-this.a.v[0], -this.a.v[1], this.a.v[2]); | |
| 4451 | + this.appliedTransformations = 1; | |
| 4452 | + } else return; | |
| 4453 | + if (!this.s.effectsSequence.length) { | |
| 4454 | + this.pre.scale(this.s.v[0], this.s.v[1], this.s.v[2]); | |
| 4455 | + this.appliedTransformations = 2; | |
| 4456 | + } else return; | |
| 4457 | + if (this.sk) if (!this.sk.effectsSequence.length && !this.sa.effectsSequence.length) { | |
| 4458 | + this.pre.skewFromAxis(-this.sk.v, this.sa.v); | |
| 4459 | + this.appliedTransformations = 3; | |
| 4460 | + } else return; | |
| 4461 | + if (this.r) { | |
| 4462 | + if (!this.r.effectsSequence.length) { | |
| 4463 | + this.pre.rotate(-this.r.v); | |
| 4464 | + this.appliedTransformations = 4; | |
| 4465 | + } | |
| 4466 | + } else if (!this.rz.effectsSequence.length && !this.ry.effectsSequence.length && !this.rx.effectsSequence.length && !this.or.effectsSequence.length) { | |
| 4467 | + this.pre.rotateZ(-this.rz.v).rotateY(this.ry.v).rotateX(this.rx.v).rotateZ(-this.or.v[2]).rotateY(this.or.v[1]).rotateX(this.or.v[0]); | |
| 4468 | + this.appliedTransformations = 4; | |
| 4469 | + } | |
| 4470 | + } | |
| 4471 | + function autoOrient() {} | |
| 4472 | + function addDynamicProperty(prop) { | |
| 4473 | + this._addDynamicProperty(prop); | |
| 4474 | + this.elem.addDynamicProperty(prop); | |
| 4475 | + this._isDirty = true; | |
| 4476 | + } | |
| 4477 | + function TransformProperty(elem, data, container) { | |
| 4478 | + this.elem = elem; | |
| 4479 | + this.frameId = -1; | |
| 4480 | + this.propType = "transform"; | |
| 4481 | + this.data = data; | |
| 4482 | + this.v = new Matrix(); | |
| 4483 | + this.pre = new Matrix(); | |
| 4484 | + this.appliedTransformations = 0; | |
| 4485 | + this.initDynamicPropertyContainer(container || elem); | |
| 4486 | + if (data.p && data.p.s) { | |
| 4487 | + this.px = PropertyFactory.getProp(elem, data.p.x, 0, 0, this); | |
| 4488 | + this.py = PropertyFactory.getProp(elem, data.p.y, 0, 0, this); | |
| 4489 | + if (data.p.z) this.pz = PropertyFactory.getProp(elem, data.p.z, 0, 0, this); | |
| 4490 | + } else this.p = PropertyFactory.getProp(elem, data.p || { k: [ | |
| 4491 | + 0, | |
| 4492 | + 0, | |
| 4493 | + 0 | |
| 4494 | + ] }, 1, 0, this); | |
| 4495 | + if (data.rx) { | |
| 4496 | + this.rx = PropertyFactory.getProp(elem, data.rx, 0, degToRads, this); | |
| 4497 | + this.ry = PropertyFactory.getProp(elem, data.ry, 0, degToRads, this); | |
| 4498 | + this.rz = PropertyFactory.getProp(elem, data.rz, 0, degToRads, this); | |
| 4499 | + if (data.or.k[0].ti) { | |
| 4500 | + var i; | |
| 4501 | + var len = data.or.k.length; | |
| 4502 | + for (i = 0; i < len; i += 1) { | |
| 4503 | + data.or.k[i].to = null; | |
| 4504 | + data.or.k[i].ti = null; | |
| 4505 | + } | |
| 4506 | + } | |
| 4507 | + this.or = PropertyFactory.getProp(elem, data.or, 1, degToRads, this); | |
| 4508 | + this.or.sh = true; | |
| 4509 | + } else this.r = PropertyFactory.getProp(elem, data.r || { k: 0 }, 0, degToRads, this); | |
| 4510 | + if (data.sk) { | |
| 4511 | + this.sk = PropertyFactory.getProp(elem, data.sk, 0, degToRads, this); | |
| 4512 | + this.sa = PropertyFactory.getProp(elem, data.sa, 0, degToRads, this); | |
| 4513 | + } | |
| 4514 | + this.a = PropertyFactory.getProp(elem, data.a || { k: [ | |
| 4515 | + 0, | |
| 4516 | + 0, | |
| 4517 | + 0 | |
| 4518 | + ] }, 1, 0, this); | |
| 4519 | + this.s = PropertyFactory.getProp(elem, data.s || { k: [ | |
| 4520 | + 100, | |
| 4521 | + 100, | |
| 4522 | + 100 | |
| 4523 | + ] }, 1, .01, this); | |
| 4524 | + if (data.o) this.o = PropertyFactory.getProp(elem, data.o, 0, .01, elem); | |
| 4525 | + else this.o = { | |
| 4526 | + _mdf: false, | |
| 4527 | + v: 1 | |
| 4528 | + }; | |
| 4529 | + this._isDirty = true; | |
| 4530 | + if (!this.dynamicProperties.length) this.getValue(true); | |
| 4531 | + } | |
| 4532 | + TransformProperty.prototype = { | |
| 4533 | + applyToMatrix, | |
| 4534 | + getValue: processKeys, | |
| 4535 | + precalculateMatrix, | |
| 4536 | + autoOrient | |
| 4537 | + }; | |
| 4538 | + extendPrototype([DynamicPropertyContainer], TransformProperty); | |
| 4539 | + TransformProperty.prototype.addDynamicProperty = addDynamicProperty; | |
| 4540 | + TransformProperty.prototype._addDynamicProperty = DynamicPropertyContainer.prototype.addDynamicProperty; | |
| 4541 | + function getTransformProperty(elem, data, container) { | |
| 4542 | + return new TransformProperty(elem, data, container); | |
| 4543 | + } | |
| 4544 | + return { getTransformProperty }; | |
| 4545 | + }(); | |
| 4546 | + function RepeaterModifier() {} | |
| 4547 | + extendPrototype([ShapeModifier], RepeaterModifier); | |
| 4548 | + RepeaterModifier.prototype.initModifierProperties = function(elem, data) { | |
| 4549 | + this.getValue = this.processKeys; | |
| 4550 | + this.c = PropertyFactory.getProp(elem, data.c, 0, null, this); | |
| 4551 | + this.o = PropertyFactory.getProp(elem, data.o, 0, null, this); | |
| 4552 | + this.tr = TransformPropertyFactory.getTransformProperty(elem, data.tr, this); | |
| 4553 | + this.so = PropertyFactory.getProp(elem, data.tr.so, 0, .01, this); | |
| 4554 | + this.eo = PropertyFactory.getProp(elem, data.tr.eo, 0, .01, this); | |
| 4555 | + this.data = data; | |
| 4556 | + if (!this.dynamicProperties.length) this.getValue(true); | |
| 4557 | + this._isAnimated = !!this.dynamicProperties.length; | |
| 4558 | + this.pMatrix = new Matrix(); | |
| 4559 | + this.rMatrix = new Matrix(); | |
| 4560 | + this.sMatrix = new Matrix(); | |
| 4561 | + this.tMatrix = new Matrix(); | |
| 4562 | + this.matrix = new Matrix(); | |
| 4563 | + }; | |
| 4564 | + RepeaterModifier.prototype.applyTransforms = function(pMatrix, rMatrix, sMatrix, transform, perc, inv) { | |
| 4565 | + var dir = inv ? -1 : 1; | |
| 4566 | + var scaleX = transform.s.v[0] + (1 - transform.s.v[0]) * (1 - perc); | |
| 4567 | + var scaleY = transform.s.v[1] + (1 - transform.s.v[1]) * (1 - perc); | |
| 4568 | + pMatrix.translate(transform.p.v[0] * dir * perc, transform.p.v[1] * dir * perc, transform.p.v[2]); | |
| 4569 | + rMatrix.translate(-transform.a.v[0], -transform.a.v[1], transform.a.v[2]); | |
| 4570 | + rMatrix.rotate(-transform.r.v * dir * perc); | |
| 4571 | + rMatrix.translate(transform.a.v[0], transform.a.v[1], transform.a.v[2]); | |
| 4572 | + sMatrix.translate(-transform.a.v[0], -transform.a.v[1], transform.a.v[2]); | |
| 4573 | + sMatrix.scale(inv ? 1 / scaleX : scaleX, inv ? 1 / scaleY : scaleY); | |
| 4574 | + sMatrix.translate(transform.a.v[0], transform.a.v[1], transform.a.v[2]); | |
| 4575 | + }; | |
| 4576 | + RepeaterModifier.prototype.init = function(elem, arr, pos, elemsData) { | |
| 4577 | + this.elem = elem; | |
| 4578 | + this.arr = arr; | |
| 4579 | + this.pos = pos; | |
| 4580 | + this.elemsData = elemsData; | |
| 4581 | + this._currentCopies = 0; | |
| 4582 | + this._elements = []; | |
| 4583 | + this._groups = []; | |
| 4584 | + this.frameId = -1; | |
| 4585 | + this.initDynamicPropertyContainer(elem); | |
| 4586 | + this.initModifierProperties(elem, arr[pos]); | |
| 4587 | + while (pos > 0) { | |
| 4588 | + pos -= 1; | |
| 4589 | + this._elements.unshift(arr[pos]); | |
| 4590 | + } | |
| 4591 | + if (this.dynamicProperties.length) this.k = true; | |
| 4592 | + else this.getValue(true); | |
| 4593 | + }; | |
| 4594 | + RepeaterModifier.prototype.resetElements = function(elements) { | |
| 4595 | + var i; | |
| 4596 | + var len = elements.length; | |
| 4597 | + for (i = 0; i < len; i += 1) { | |
| 4598 | + elements[i]._processed = false; | |
| 4599 | + if (elements[i].ty === "gr") this.resetElements(elements[i].it); | |
| 4600 | + } | |
| 4601 | + }; | |
| 4602 | + RepeaterModifier.prototype.cloneElements = function(elements) { | |
| 4603 | + var newElements = JSON.parse(JSON.stringify(elements)); | |
| 4604 | + this.resetElements(newElements); | |
| 4605 | + return newElements; | |
| 4606 | + }; | |
| 4607 | + RepeaterModifier.prototype.changeGroupRender = function(elements, renderFlag) { | |
| 4608 | + var i; | |
| 4609 | + var len = elements.length; | |
| 4610 | + for (i = 0; i < len; i += 1) { | |
| 4611 | + elements[i]._render = renderFlag; | |
| 4612 | + if (elements[i].ty === "gr") this.changeGroupRender(elements[i].it, renderFlag); | |
| 4613 | + } | |
| 4614 | + }; | |
| 4615 | + RepeaterModifier.prototype.processShapes = function(_isFirstFrame) { | |
| 4616 | + var items; | |
| 4617 | + var itemsTransform; | |
| 4618 | + var i; | |
| 4619 | + var dir; | |
| 4620 | + var cont; | |
| 4621 | + var hasReloaded = false; | |
| 4622 | + if (this._mdf || _isFirstFrame) { | |
| 4623 | + var copies = Math.ceil(this.c.v); | |
| 4624 | + if (this._groups.length < copies) { | |
| 4625 | + while (this._groups.length < copies) { | |
| 4626 | + var group = { | |
| 4627 | + it: this.cloneElements(this._elements), | |
| 4628 | + ty: "gr" | |
| 4629 | + }; | |
| 4630 | + group.it.push({ | |
| 4631 | + a: { | |
| 4632 | + a: 0, | |
| 4633 | + ix: 1, | |
| 4634 | + k: [0, 0] | |
| 4635 | + }, | |
| 4636 | + nm: "Transform", | |
| 4637 | + o: { | |
| 4638 | + a: 0, | |
| 4639 | + ix: 7, | |
| 4640 | + k: 100 | |
| 4641 | + }, | |
| 4642 | + p: { | |
| 4643 | + a: 0, | |
| 4644 | + ix: 2, | |
| 4645 | + k: [0, 0] | |
| 4646 | + }, | |
| 4647 | + r: { | |
| 4648 | + a: 1, | |
| 4649 | + ix: 6, | |
| 4650 | + k: [{ | |
| 4651 | + s: 0, | |
| 4652 | + e: 0, | |
| 4653 | + t: 0 | |
| 4654 | + }, { | |
| 4655 | + s: 0, | |
| 4656 | + e: 0, | |
| 4657 | + t: 1 | |
| 4658 | + }] | |
| 4659 | + }, | |
| 4660 | + s: { | |
| 4661 | + a: 0, | |
| 4662 | + ix: 3, | |
| 4663 | + k: [100, 100] | |
| 4664 | + }, | |
| 4665 | + sa: { | |
| 4666 | + a: 0, | |
| 4667 | + ix: 5, | |
| 4668 | + k: 0 | |
| 4669 | + }, | |
| 4670 | + sk: { | |
| 4671 | + a: 0, | |
| 4672 | + ix: 4, | |
| 4673 | + k: 0 | |
| 4674 | + }, | |
| 4675 | + ty: "tr" | |
| 4676 | + }); | |
| 4677 | + this.arr.splice(0, 0, group); | |
| 4678 | + this._groups.splice(0, 0, group); | |
| 4679 | + this._currentCopies += 1; | |
| 4680 | + } | |
| 4681 | + this.elem.reloadShapes(); | |
| 4682 | + hasReloaded = true; | |
| 4683 | + } | |
| 4684 | + cont = 0; | |
| 4685 | + var renderFlag; | |
| 4686 | + for (i = 0; i <= this._groups.length - 1; i += 1) { | |
| 4687 | + renderFlag = cont < copies; | |
| 4688 | + this._groups[i]._render = renderFlag; | |
| 4689 | + this.changeGroupRender(this._groups[i].it, renderFlag); | |
| 4690 | + if (!renderFlag) { | |
| 4691 | + var elems = this.elemsData[i].it; | |
| 4692 | + var transformData = elems[elems.length - 1]; | |
| 4693 | + if (transformData.transform.op.v !== 0) { | |
| 4694 | + transformData.transform.op._mdf = true; | |
| 4695 | + transformData.transform.op.v = 0; | |
| 4696 | + } else transformData.transform.op._mdf = false; | |
| 4697 | + } | |
| 4698 | + cont += 1; | |
| 4699 | + } | |
| 4700 | + this._currentCopies = copies; | |
| 4701 | + var offset = this.o.v; | |
| 4702 | + var offsetModulo = offset % 1; | |
| 4703 | + var roundOffset = offset > 0 ? Math.floor(offset) : Math.ceil(offset); | |
| 4704 | + var pProps = this.pMatrix.props; | |
| 4705 | + var rProps = this.rMatrix.props; | |
| 4706 | + var sProps = this.sMatrix.props; | |
| 4707 | + this.pMatrix.reset(); | |
| 4708 | + this.rMatrix.reset(); | |
| 4709 | + this.sMatrix.reset(); | |
| 4710 | + this.tMatrix.reset(); | |
| 4711 | + this.matrix.reset(); | |
| 4712 | + var iteration = 0; | |
| 4713 | + if (offset > 0) { | |
| 4714 | + while (iteration < roundOffset) { | |
| 4715 | + this.applyTransforms(this.pMatrix, this.rMatrix, this.sMatrix, this.tr, 1, false); | |
| 4716 | + iteration += 1; | |
| 4717 | + } | |
| 4718 | + if (offsetModulo) { | |
| 4719 | + this.applyTransforms(this.pMatrix, this.rMatrix, this.sMatrix, this.tr, offsetModulo, false); | |
| 4720 | + iteration += offsetModulo; | |
| 4721 | + } | |
| 4722 | + } else if (offset < 0) { | |
| 4723 | + while (iteration > roundOffset) { | |
| 4724 | + this.applyTransforms(this.pMatrix, this.rMatrix, this.sMatrix, this.tr, 1, true); | |
| 4725 | + iteration -= 1; | |
| 4726 | + } | |
| 4727 | + if (offsetModulo) { | |
| 4728 | + this.applyTransforms(this.pMatrix, this.rMatrix, this.sMatrix, this.tr, -offsetModulo, true); | |
| 4729 | + iteration -= offsetModulo; | |
| 4730 | + } | |
| 4731 | + } | |
| 4732 | + i = this.data.m === 1 ? 0 : this._currentCopies - 1; | |
| 4733 | + dir = this.data.m === 1 ? 1 : -1; | |
| 4734 | + cont = this._currentCopies; | |
| 4735 | + var j; | |
| 4736 | + var jLen; | |
| 4737 | + while (cont) { | |
| 4738 | + items = this.elemsData[i].it; | |
| 4739 | + itemsTransform = items[items.length - 1].transform.mProps.v.props; | |
| 4740 | + jLen = itemsTransform.length; | |
| 4741 | + items[items.length - 1].transform.mProps._mdf = true; | |
| 4742 | + items[items.length - 1].transform.op._mdf = true; | |
| 4743 | + items[items.length - 1].transform.op.v = this._currentCopies === 1 ? this.so.v : this.so.v + (this.eo.v - this.so.v) * (i / (this._currentCopies - 1)); | |
| 4744 | + if (iteration !== 0) { | |
| 4745 | + if (i !== 0 && dir === 1 || i !== this._currentCopies - 1 && dir === -1) this.applyTransforms(this.pMatrix, this.rMatrix, this.sMatrix, this.tr, 1, false); | |
| 4746 | + this.matrix.transform(rProps[0], rProps[1], rProps[2], rProps[3], rProps[4], rProps[5], rProps[6], rProps[7], rProps[8], rProps[9], rProps[10], rProps[11], rProps[12], rProps[13], rProps[14], rProps[15]); | |
| 4747 | + this.matrix.transform(sProps[0], sProps[1], sProps[2], sProps[3], sProps[4], sProps[5], sProps[6], sProps[7], sProps[8], sProps[9], sProps[10], sProps[11], sProps[12], sProps[13], sProps[14], sProps[15]); | |
| 4748 | + this.matrix.transform(pProps[0], pProps[1], pProps[2], pProps[3], pProps[4], pProps[5], pProps[6], pProps[7], pProps[8], pProps[9], pProps[10], pProps[11], pProps[12], pProps[13], pProps[14], pProps[15]); | |
| 4749 | + for (j = 0; j < jLen; j += 1) itemsTransform[j] = this.matrix.props[j]; | |
| 4750 | + this.matrix.reset(); | |
| 4751 | + } else { | |
| 4752 | + this.matrix.reset(); | |
| 4753 | + for (j = 0; j < jLen; j += 1) itemsTransform[j] = this.matrix.props[j]; | |
| 4754 | + } | |
| 4755 | + iteration += 1; | |
| 4756 | + cont -= 1; | |
| 4757 | + i += dir; | |
| 4758 | + } | |
| 4759 | + } else { | |
| 4760 | + cont = this._currentCopies; | |
| 4761 | + i = 0; | |
| 4762 | + dir = 1; | |
| 4763 | + while (cont) { | |
| 4764 | + items = this.elemsData[i].it; | |
| 4765 | + itemsTransform = items[items.length - 1].transform.mProps.v.props; | |
| 4766 | + items[items.length - 1].transform.mProps._mdf = false; | |
| 4767 | + items[items.length - 1].transform.op._mdf = false; | |
| 4768 | + cont -= 1; | |
| 4769 | + i += dir; | |
| 4770 | + } | |
| 4771 | + } | |
| 4772 | + return hasReloaded; | |
| 4773 | + }; | |
| 4774 | + RepeaterModifier.prototype.addShape = function() {}; | |
| 4775 | + function RoundCornersModifier() {} | |
| 4776 | + extendPrototype([ShapeModifier], RoundCornersModifier); | |
| 4777 | + RoundCornersModifier.prototype.initModifierProperties = function(elem, data) { | |
| 4778 | + this.getValue = this.processKeys; | |
| 4779 | + this.rd = PropertyFactory.getProp(elem, data.r, 0, null, this); | |
| 4780 | + this._isAnimated = !!this.rd.effectsSequence.length; | |
| 4781 | + }; | |
| 4782 | + RoundCornersModifier.prototype.processPath = function(path, round) { | |
| 4783 | + var clonedPath = shapePool.newElement(); | |
| 4784 | + clonedPath.c = path.c; | |
| 4785 | + var i; | |
| 4786 | + var len = path._length; | |
| 4787 | + var currentV; | |
| 4788 | + var currentI; | |
| 4789 | + var currentO; | |
| 4790 | + var closerV; | |
| 4791 | + var distance; | |
| 4792 | + var newPosPerc; | |
| 4793 | + var index = 0; | |
| 4794 | + var vX; | |
| 4795 | + var vY; | |
| 4796 | + var oX; | |
| 4797 | + var oY; | |
| 4798 | + var iX; | |
| 4799 | + var iY; | |
| 4800 | + for (i = 0; i < len; i += 1) { | |
| 4801 | + currentV = path.v[i]; | |
| 4802 | + currentO = path.o[i]; | |
| 4803 | + currentI = path.i[i]; | |
| 4804 | + if (currentV[0] === currentO[0] && currentV[1] === currentO[1] && currentV[0] === currentI[0] && currentV[1] === currentI[1]) if ((i === 0 || i === len - 1) && !path.c) { | |
| 4805 | + clonedPath.setTripleAt(currentV[0], currentV[1], currentO[0], currentO[1], currentI[0], currentI[1], index); | |
| 4806 | + index += 1; | |
| 4807 | + } else { | |
| 4808 | + if (i === 0) closerV = path.v[len - 1]; | |
| 4809 | + else closerV = path.v[i - 1]; | |
| 4810 | + distance = Math.sqrt(Math.pow(currentV[0] - closerV[0], 2) + Math.pow(currentV[1] - closerV[1], 2)); | |
| 4811 | + newPosPerc = distance ? Math.min(distance / 2, round) / distance : 0; | |
| 4812 | + iX = currentV[0] + (closerV[0] - currentV[0]) * newPosPerc; | |
| 4813 | + vX = iX; | |
| 4814 | + iY = currentV[1] - (currentV[1] - closerV[1]) * newPosPerc; | |
| 4815 | + vY = iY; | |
| 4816 | + oX = vX - (vX - currentV[0]) * roundCorner; | |
| 4817 | + oY = vY - (vY - currentV[1]) * roundCorner; | |
| 4818 | + clonedPath.setTripleAt(vX, vY, oX, oY, iX, iY, index); | |
| 4819 | + index += 1; | |
| 4820 | + if (i === len - 1) closerV = path.v[0]; | |
| 4821 | + else closerV = path.v[i + 1]; | |
| 4822 | + distance = Math.sqrt(Math.pow(currentV[0] - closerV[0], 2) + Math.pow(currentV[1] - closerV[1], 2)); | |
| 4823 | + newPosPerc = distance ? Math.min(distance / 2, round) / distance : 0; | |
| 4824 | + oX = currentV[0] + (closerV[0] - currentV[0]) * newPosPerc; | |
| 4825 | + vX = oX; | |
| 4826 | + oY = currentV[1] + (closerV[1] - currentV[1]) * newPosPerc; | |
| 4827 | + vY = oY; | |
| 4828 | + iX = vX - (vX - currentV[0]) * roundCorner; | |
| 4829 | + iY = vY - (vY - currentV[1]) * roundCorner; | |
| 4830 | + clonedPath.setTripleAt(vX, vY, oX, oY, iX, iY, index); | |
| 4831 | + index += 1; | |
| 4832 | + } | |
| 4833 | + else { | |
| 4834 | + clonedPath.setTripleAt(path.v[i][0], path.v[i][1], path.o[i][0], path.o[i][1], path.i[i][0], path.i[i][1], index); | |
| 4835 | + index += 1; | |
| 4836 | + } | |
| 4837 | + } | |
| 4838 | + return clonedPath; | |
| 4839 | + }; | |
| 4840 | + RoundCornersModifier.prototype.processShapes = function(_isFirstFrame) { | |
| 4841 | + var shapePaths; | |
| 4842 | + var i; | |
| 4843 | + var len = this.shapes.length; | |
| 4844 | + var j; | |
| 4845 | + var jLen; | |
| 4846 | + var rd = this.rd.v; | |
| 4847 | + if (rd !== 0) { | |
| 4848 | + var shapeData; | |
| 4849 | + var localShapeCollection; | |
| 4850 | + for (i = 0; i < len; i += 1) { | |
| 4851 | + shapeData = this.shapes[i]; | |
| 4852 | + localShapeCollection = shapeData.localShapeCollection; | |
| 4853 | + if (!(!shapeData.shape._mdf && !this._mdf && !_isFirstFrame)) { | |
| 4854 | + localShapeCollection.releaseShapes(); | |
| 4855 | + shapeData.shape._mdf = true; | |
| 4856 | + shapePaths = shapeData.shape.paths.shapes; | |
| 4857 | + jLen = shapeData.shape.paths._length; | |
| 4858 | + for (j = 0; j < jLen; j += 1) localShapeCollection.addShape(this.processPath(shapePaths[j], rd)); | |
| 4859 | + } | |
| 4860 | + shapeData.shape.paths = shapeData.localShapeCollection; | |
| 4861 | + } | |
| 4862 | + } | |
| 4863 | + if (!this.dynamicProperties.length) this._mdf = false; | |
| 4864 | + }; | |
| 4865 | + function floatEqual(a, b) { | |
| 4866 | + return Math.abs(a - b) * 1e5 <= Math.min(Math.abs(a), Math.abs(b)); | |
| 4867 | + } | |
| 4868 | + function floatZero(f) { | |
| 4869 | + return Math.abs(f) <= 1e-5; | |
| 4870 | + } | |
| 4871 | + function lerp(p0, p1, amount) { | |
| 4872 | + return p0 * (1 - amount) + p1 * amount; | |
| 4873 | + } | |
| 4874 | + function lerpPoint(p0, p1, amount) { | |
| 4875 | + return [lerp(p0[0], p1[0], amount), lerp(p0[1], p1[1], amount)]; | |
| 4876 | + } | |
| 4877 | + function quadRoots(a, b, c) { | |
| 4878 | + if (a === 0) return []; | |
| 4879 | + var s = b * b - 4 * a * c; | |
| 4880 | + if (s < 0) return []; | |
| 4881 | + var singleRoot = -b / (2 * a); | |
| 4882 | + if (s === 0) return [singleRoot]; | |
| 4883 | + var delta = Math.sqrt(s) / (2 * a); | |
| 4884 | + return [singleRoot - delta, singleRoot + delta]; | |
| 4885 | + } | |
| 4886 | + function polynomialCoefficients(p0, p1, p2, p3) { | |
| 4887 | + return [ | |
| 4888 | + -p0 + 3 * p1 - 3 * p2 + p3, | |
| 4889 | + 3 * p0 - 6 * p1 + 3 * p2, | |
| 4890 | + -3 * p0 + 3 * p1, | |
| 4891 | + p0 | |
| 4892 | + ]; | |
| 4893 | + } | |
| 4894 | + function singlePoint(p) { | |
| 4895 | + return new PolynomialBezier(p, p, p, p, false); | |
| 4896 | + } | |
| 4897 | + function PolynomialBezier(p0, p1, p2, p3, linearize) { | |
| 4898 | + if (linearize && pointEqual(p0, p1)) p1 = lerpPoint(p0, p3, 1 / 3); | |
| 4899 | + if (linearize && pointEqual(p2, p3)) p2 = lerpPoint(p0, p3, 2 / 3); | |
| 4900 | + var coeffx = polynomialCoefficients(p0[0], p1[0], p2[0], p3[0]); | |
| 4901 | + var coeffy = polynomialCoefficients(p0[1], p1[1], p2[1], p3[1]); | |
| 4902 | + this.a = [coeffx[0], coeffy[0]]; | |
| 4903 | + this.b = [coeffx[1], coeffy[1]]; | |
| 4904 | + this.c = [coeffx[2], coeffy[2]]; | |
| 4905 | + this.d = [coeffx[3], coeffy[3]]; | |
| 4906 | + this.points = [ | |
| 4907 | + p0, | |
| 4908 | + p1, | |
| 4909 | + p2, | |
| 4910 | + p3 | |
| 4911 | + ]; | |
| 4912 | + } | |
| 4913 | + PolynomialBezier.prototype.point = function(t) { | |
| 4914 | + return [((this.a[0] * t + this.b[0]) * t + this.c[0]) * t + this.d[0], ((this.a[1] * t + this.b[1]) * t + this.c[1]) * t + this.d[1]]; | |
| 4915 | + }; | |
| 4916 | + PolynomialBezier.prototype.derivative = function(t) { | |
| 4917 | + return [(3 * t * this.a[0] + 2 * this.b[0]) * t + this.c[0], (3 * t * this.a[1] + 2 * this.b[1]) * t + this.c[1]]; | |
| 4918 | + }; | |
| 4919 | + PolynomialBezier.prototype.tangentAngle = function(t) { | |
| 4920 | + var p = this.derivative(t); | |
| 4921 | + return Math.atan2(p[1], p[0]); | |
| 4922 | + }; | |
| 4923 | + PolynomialBezier.prototype.normalAngle = function(t) { | |
| 4924 | + var p = this.derivative(t); | |
| 4925 | + return Math.atan2(p[0], p[1]); | |
| 4926 | + }; | |
| 4927 | + PolynomialBezier.prototype.inflectionPoints = function() { | |
| 4928 | + var denom = this.a[1] * this.b[0] - this.a[0] * this.b[1]; | |
| 4929 | + if (floatZero(denom)) return []; | |
| 4930 | + var tcusp = -.5 * (this.a[1] * this.c[0] - this.a[0] * this.c[1]) / denom; | |
| 4931 | + var square = tcusp * tcusp - 1 / 3 * (this.b[1] * this.c[0] - this.b[0] * this.c[1]) / denom; | |
| 4932 | + if (square < 0) return []; | |
| 4933 | + var root = Math.sqrt(square); | |
| 4934 | + if (floatZero(root)) { | |
| 4935 | + if (root > 0 && root < 1) return [tcusp]; | |
| 4936 | + return []; | |
| 4937 | + } | |
| 4938 | + return [tcusp - root, tcusp + root].filter(function(r) { | |
| 4939 | + return r > 0 && r < 1; | |
| 4940 | + }); | |
| 4941 | + }; | |
| 4942 | + PolynomialBezier.prototype.split = function(t) { | |
| 4943 | + if (t <= 0) return [singlePoint(this.points[0]), this]; | |
| 4944 | + if (t >= 1) return [this, singlePoint(this.points[this.points.length - 1])]; | |
| 4945 | + var p10 = lerpPoint(this.points[0], this.points[1], t); | |
| 4946 | + var p11 = lerpPoint(this.points[1], this.points[2], t); | |
| 4947 | + var p12 = lerpPoint(this.points[2], this.points[3], t); | |
| 4948 | + var p20 = lerpPoint(p10, p11, t); | |
| 4949 | + var p21 = lerpPoint(p11, p12, t); | |
| 4950 | + var p3 = lerpPoint(p20, p21, t); | |
| 4951 | + return [new PolynomialBezier(this.points[0], p10, p20, p3, true), new PolynomialBezier(p3, p21, p12, this.points[3], true)]; | |
| 4952 | + }; | |
| 4953 | + function extrema(bez, comp) { | |
| 4954 | + var min = bez.points[0][comp]; | |
| 4955 | + var max = bez.points[bez.points.length - 1][comp]; | |
| 4956 | + if (min > max) { | |
| 4957 | + var e = max; | |
| 4958 | + max = min; | |
| 4959 | + min = e; | |
| 4960 | + } | |
| 4961 | + var f = quadRoots(3 * bez.a[comp], 2 * bez.b[comp], bez.c[comp]); | |
| 4962 | + for (var i = 0; i < f.length; i += 1) if (f[i] > 0 && f[i] < 1) { | |
| 4963 | + var val = bez.point(f[i])[comp]; | |
| 4964 | + if (val < min) min = val; | |
| 4965 | + else if (val > max) max = val; | |
| 4966 | + } | |
| 4967 | + return { | |
| 4968 | + min, | |
| 4969 | + max | |
| 4970 | + }; | |
| 4971 | + } | |
| 4972 | + PolynomialBezier.prototype.bounds = function() { | |
| 4973 | + return { | |
| 4974 | + x: extrema(this, 0), | |
| 4975 | + y: extrema(this, 1) | |
| 4976 | + }; | |
| 4977 | + }; | |
| 4978 | + PolynomialBezier.prototype.boundingBox = function() { | |
| 4979 | + var bounds = this.bounds(); | |
| 4980 | + return { | |
| 4981 | + left: bounds.x.min, | |
| 4982 | + right: bounds.x.max, | |
| 4983 | + top: bounds.y.min, | |
| 4984 | + bottom: bounds.y.max, | |
| 4985 | + width: bounds.x.max - bounds.x.min, | |
| 4986 | + height: bounds.y.max - bounds.y.min, | |
| 4987 | + cx: (bounds.x.max + bounds.x.min) / 2, | |
| 4988 | + cy: (bounds.y.max + bounds.y.min) / 2 | |
| 4989 | + }; | |
| 4990 | + }; | |
| 4991 | + function intersectData(bez, t1, t2) { | |
| 4992 | + var box = bez.boundingBox(); | |
| 4993 | + return { | |
| 4994 | + cx: box.cx, | |
| 4995 | + cy: box.cy, | |
| 4996 | + width: box.width, | |
| 4997 | + height: box.height, | |
| 4998 | + bez, | |
| 4999 | + t: (t1 + t2) / 2, | |
| 5000 | + t1, | |
| 5001 | + t2 | |
| 5002 | + }; | |
| 5003 | + } | |
| 5004 | + function splitData(data) { | |
| 5005 | + var split = data.bez.split(.5); | |
| 5006 | + return [intersectData(split[0], data.t1, data.t), intersectData(split[1], data.t, data.t2)]; | |
| 5007 | + } | |
| 5008 | + function boxIntersect(b1, b2) { | |
| 5009 | + return Math.abs(b1.cx - b2.cx) * 2 < b1.width + b2.width && Math.abs(b1.cy - b2.cy) * 2 < b1.height + b2.height; | |
| 5010 | + } | |
| 5011 | + function intersectsImpl(d1, d2, depth, tolerance, intersections, maxRecursion) { | |
| 5012 | + if (!boxIntersect(d1, d2)) return; | |
| 5013 | + if (depth >= maxRecursion || d1.width <= tolerance && d1.height <= tolerance && d2.width <= tolerance && d2.height <= tolerance) { | |
| 5014 | + intersections.push([d1.t, d2.t]); | |
| 5015 | + return; | |
| 5016 | + } | |
| 5017 | + var d1s = splitData(d1); | |
| 5018 | + var d2s = splitData(d2); | |
| 5019 | + intersectsImpl(d1s[0], d2s[0], depth + 1, tolerance, intersections, maxRecursion); | |
| 5020 | + intersectsImpl(d1s[0], d2s[1], depth + 1, tolerance, intersections, maxRecursion); | |
| 5021 | + intersectsImpl(d1s[1], d2s[0], depth + 1, tolerance, intersections, maxRecursion); | |
| 5022 | + intersectsImpl(d1s[1], d2s[1], depth + 1, tolerance, intersections, maxRecursion); | |
| 5023 | + } | |
| 5024 | + PolynomialBezier.prototype.intersections = function(other, tolerance, maxRecursion) { | |
| 5025 | + if (tolerance === void 0) tolerance = 2; | |
| 5026 | + if (maxRecursion === void 0) maxRecursion = 7; | |
| 5027 | + var intersections = []; | |
| 5028 | + intersectsImpl(intersectData(this, 0, 1), intersectData(other, 0, 1), 0, tolerance, intersections, maxRecursion); | |
| 5029 | + return intersections; | |
| 5030 | + }; | |
| 5031 | + PolynomialBezier.shapeSegment = function(shapePath, index) { | |
| 5032 | + var nextIndex = (index + 1) % shapePath.length(); | |
| 5033 | + return new PolynomialBezier(shapePath.v[index], shapePath.o[index], shapePath.i[nextIndex], shapePath.v[nextIndex], true); | |
| 5034 | + }; | |
| 5035 | + PolynomialBezier.shapeSegmentInverted = function(shapePath, index) { | |
| 5036 | + var nextIndex = (index + 1) % shapePath.length(); | |
| 5037 | + return new PolynomialBezier(shapePath.v[nextIndex], shapePath.i[nextIndex], shapePath.o[index], shapePath.v[index], true); | |
| 5038 | + }; | |
| 5039 | + function crossProduct(a, b) { | |
| 5040 | + return [ | |
| 5041 | + a[1] * b[2] - a[2] * b[1], | |
| 5042 | + a[2] * b[0] - a[0] * b[2], | |
| 5043 | + a[0] * b[1] - a[1] * b[0] | |
| 5044 | + ]; | |
| 5045 | + } | |
| 5046 | + function lineIntersection(start1, end1, start2, end2) { | |
| 5047 | + var v1 = [ | |
| 5048 | + start1[0], | |
| 5049 | + start1[1], | |
| 5050 | + 1 | |
| 5051 | + ]; | |
| 5052 | + var v2 = [ | |
| 5053 | + end1[0], | |
| 5054 | + end1[1], | |
| 5055 | + 1 | |
| 5056 | + ]; | |
| 5057 | + var v3 = [ | |
| 5058 | + start2[0], | |
| 5059 | + start2[1], | |
| 5060 | + 1 | |
| 5061 | + ]; | |
| 5062 | + var v4 = [ | |
| 5063 | + end2[0], | |
| 5064 | + end2[1], | |
| 5065 | + 1 | |
| 5066 | + ]; | |
| 5067 | + var r = crossProduct(crossProduct(v1, v2), crossProduct(v3, v4)); | |
| 5068 | + if (floatZero(r[2])) return null; | |
| 5069 | + return [r[0] / r[2], r[1] / r[2]]; | |
| 5070 | + } | |
| 5071 | + function polarOffset(p, angle, length) { | |
| 5072 | + return [p[0] + Math.cos(angle) * length, p[1] - Math.sin(angle) * length]; | |
| 5073 | + } | |
| 5074 | + function pointDistance(p1, p2) { | |
| 5075 | + return Math.hypot(p1[0] - p2[0], p1[1] - p2[1]); | |
| 5076 | + } | |
| 5077 | + function pointEqual(p1, p2) { | |
| 5078 | + return floatEqual(p1[0], p2[0]) && floatEqual(p1[1], p2[1]); | |
| 5079 | + } | |
| 5080 | + function ZigZagModifier() {} | |
| 5081 | + extendPrototype([ShapeModifier], ZigZagModifier); | |
| 5082 | + ZigZagModifier.prototype.initModifierProperties = function(elem, data) { | |
| 5083 | + this.getValue = this.processKeys; | |
| 5084 | + this.amplitude = PropertyFactory.getProp(elem, data.s, 0, null, this); | |
| 5085 | + this.frequency = PropertyFactory.getProp(elem, data.r, 0, null, this); | |
| 5086 | + this.pointsType = PropertyFactory.getProp(elem, data.pt, 0, null, this); | |
| 5087 | + this._isAnimated = this.amplitude.effectsSequence.length !== 0 || this.frequency.effectsSequence.length !== 0 || this.pointsType.effectsSequence.length !== 0; | |
| 5088 | + }; | |
| 5089 | + function setPoint(outputBezier, point, angle, direction, amplitude, outAmplitude, inAmplitude) { | |
| 5090 | + var angO = angle - Math.PI / 2; | |
| 5091 | + var angI = angle + Math.PI / 2; | |
| 5092 | + var px = point[0] + Math.cos(angle) * direction * amplitude; | |
| 5093 | + var py = point[1] - Math.sin(angle) * direction * amplitude; | |
| 5094 | + outputBezier.setTripleAt(px, py, px + Math.cos(angO) * outAmplitude, py - Math.sin(angO) * outAmplitude, px + Math.cos(angI) * inAmplitude, py - Math.sin(angI) * inAmplitude, outputBezier.length()); | |
| 5095 | + } | |
| 5096 | + function getPerpendicularVector(pt1, pt2) { | |
| 5097 | + var vector = [pt2[0] - pt1[0], pt2[1] - pt1[1]]; | |
| 5098 | + var rot = -Math.PI * .5; | |
| 5099 | + return [Math.cos(rot) * vector[0] - Math.sin(rot) * vector[1], Math.sin(rot) * vector[0] + Math.cos(rot) * vector[1]]; | |
| 5100 | + } | |
| 5101 | + function getProjectingAngle(path, cur) { | |
| 5102 | + var prevIndex = cur === 0 ? path.length() - 1 : cur - 1; | |
| 5103 | + var nextIndex = (cur + 1) % path.length(); | |
| 5104 | + var prevPoint = path.v[prevIndex]; | |
| 5105 | + var nextPoint = path.v[nextIndex]; | |
| 5106 | + var pVector = getPerpendicularVector(prevPoint, nextPoint); | |
| 5107 | + return Math.atan2(0, 1) - Math.atan2(pVector[1], pVector[0]); | |
| 5108 | + } | |
| 5109 | + function zigZagCorner(outputBezier, path, cur, amplitude, frequency, pointType, direction) { | |
| 5110 | + var angle = getProjectingAngle(path, cur); | |
| 5111 | + var point = path.v[cur % path._length]; | |
| 5112 | + var prevPoint = path.v[cur === 0 ? path._length - 1 : cur - 1]; | |
| 5113 | + var nextPoint = path.v[(cur + 1) % path._length]; | |
| 5114 | + var prevDist = pointType === 2 ? Math.sqrt(Math.pow(point[0] - prevPoint[0], 2) + Math.pow(point[1] - prevPoint[1], 2)) : 0; | |
| 5115 | + var nextDist = pointType === 2 ? Math.sqrt(Math.pow(point[0] - nextPoint[0], 2) + Math.pow(point[1] - nextPoint[1], 2)) : 0; | |
| 5116 | + setPoint(outputBezier, path.v[cur % path._length], angle, direction, amplitude, nextDist / ((frequency + 1) * 2), prevDist / ((frequency + 1) * 2), pointType); | |
| 5117 | + } | |
| 5118 | + function zigZagSegment(outputBezier, segment, amplitude, frequency, pointType, direction) { | |
| 5119 | + for (var i = 0; i < frequency; i += 1) { | |
| 5120 | + var t = (i + 1) / (frequency + 1); | |
| 5121 | + var dist = pointType === 2 ? Math.sqrt(Math.pow(segment.points[3][0] - segment.points[0][0], 2) + Math.pow(segment.points[3][1] - segment.points[0][1], 2)) : 0; | |
| 5122 | + var angle = segment.normalAngle(t); | |
| 5123 | + setPoint(outputBezier, segment.point(t), angle, direction, amplitude, dist / ((frequency + 1) * 2), dist / ((frequency + 1) * 2), pointType); | |
| 5124 | + direction = -direction; | |
| 5125 | + } | |
| 5126 | + return direction; | |
| 5127 | + } | |
| 5128 | + ZigZagModifier.prototype.processPath = function(path, amplitude, frequency, pointType) { | |
| 5129 | + var count = path._length; | |
| 5130 | + var clonedPath = shapePool.newElement(); | |
| 5131 | + clonedPath.c = path.c; | |
| 5132 | + if (!path.c) count -= 1; | |
| 5133 | + if (count === 0) return clonedPath; | |
| 5134 | + var direction = -1; | |
| 5135 | + var segment = PolynomialBezier.shapeSegment(path, 0); | |
| 5136 | + zigZagCorner(clonedPath, path, 0, amplitude, frequency, pointType, direction); | |
| 5137 | + for (var i = 0; i < count; i += 1) { | |
| 5138 | + direction = zigZagSegment(clonedPath, segment, amplitude, frequency, pointType, -direction); | |
| 5139 | + if (i === count - 1 && !path.c) segment = null; | |
| 5140 | + else segment = PolynomialBezier.shapeSegment(path, (i + 1) % count); | |
| 5141 | + zigZagCorner(clonedPath, path, i + 1, amplitude, frequency, pointType, direction); | |
| 5142 | + } | |
| 5143 | + return clonedPath; | |
| 5144 | + }; | |
| 5145 | + ZigZagModifier.prototype.processShapes = function(_isFirstFrame) { | |
| 5146 | + var shapePaths; | |
| 5147 | + var i; | |
| 5148 | + var len = this.shapes.length; | |
| 5149 | + var j; | |
| 5150 | + var jLen; | |
| 5151 | + var amplitude = this.amplitude.v; | |
| 5152 | + var frequency = Math.max(0, Math.round(this.frequency.v)); | |
| 5153 | + var pointType = this.pointsType.v; | |
| 5154 | + if (amplitude !== 0) { | |
| 5155 | + var shapeData; | |
| 5156 | + var localShapeCollection; | |
| 5157 | + for (i = 0; i < len; i += 1) { | |
| 5158 | + shapeData = this.shapes[i]; | |
| 5159 | + localShapeCollection = shapeData.localShapeCollection; | |
| 5160 | + if (!(!shapeData.shape._mdf && !this._mdf && !_isFirstFrame)) { | |
| 5161 | + localShapeCollection.releaseShapes(); | |
| 5162 | + shapeData.shape._mdf = true; | |
| 5163 | + shapePaths = shapeData.shape.paths.shapes; | |
| 5164 | + jLen = shapeData.shape.paths._length; | |
| 5165 | + for (j = 0; j < jLen; j += 1) localShapeCollection.addShape(this.processPath(shapePaths[j], amplitude, frequency, pointType)); | |
| 5166 | + } | |
| 5167 | + shapeData.shape.paths = shapeData.localShapeCollection; | |
| 5168 | + } | |
| 5169 | + } | |
| 5170 | + if (!this.dynamicProperties.length) this._mdf = false; | |
| 5171 | + }; | |
| 5172 | + function linearOffset(p1, p2, amount) { | |
| 5173 | + var angle = Math.atan2(p2[0] - p1[0], p2[1] - p1[1]); | |
| 5174 | + return [polarOffset(p1, angle, amount), polarOffset(p2, angle, amount)]; | |
| 5175 | + } | |
| 5176 | + function offsetSegment(segment, amount) { | |
| 5177 | + var p0; | |
| 5178 | + var p1a; | |
| 5179 | + var p1b; | |
| 5180 | + var p2b; | |
| 5181 | + var p2a; | |
| 5182 | + var p3; | |
| 5183 | + var e = linearOffset(segment.points[0], segment.points[1], amount); | |
| 5184 | + p0 = e[0]; | |
| 5185 | + p1a = e[1]; | |
| 5186 | + e = linearOffset(segment.points[1], segment.points[2], amount); | |
| 5187 | + p1b = e[0]; | |
| 5188 | + p2b = e[1]; | |
| 5189 | + e = linearOffset(segment.points[2], segment.points[3], amount); | |
| 5190 | + p2a = e[0]; | |
| 5191 | + p3 = e[1]; | |
| 5192 | + var p1 = lineIntersection(p0, p1a, p1b, p2b); | |
| 5193 | + if (p1 === null) p1 = p1a; | |
| 5194 | + var p2 = lineIntersection(p2a, p3, p1b, p2b); | |
| 5195 | + if (p2 === null) p2 = p2a; | |
| 5196 | + return new PolynomialBezier(p0, p1, p2, p3); | |
| 5197 | + } | |
| 5198 | + function joinLines(outputBezier, seg1, seg2, lineJoin, miterLimit) { | |
| 5199 | + var p0 = seg1.points[3]; | |
| 5200 | + var p1 = seg2.points[0]; | |
| 5201 | + if (lineJoin === 3) return p0; | |
| 5202 | + if (pointEqual(p0, p1)) return p0; | |
| 5203 | + if (lineJoin === 2) { | |
| 5204 | + var angleOut = -seg1.tangentAngle(1); | |
| 5205 | + var angleIn = -seg2.tangentAngle(0) + Math.PI; | |
| 5206 | + var center = lineIntersection(p0, polarOffset(p0, angleOut + Math.PI / 2, 100), p1, polarOffset(p1, angleOut + Math.PI / 2, 100)); | |
| 5207 | + var radius = center ? pointDistance(center, p0) : pointDistance(p0, p1) / 2; | |
| 5208 | + var tan = polarOffset(p0, angleOut, 2 * radius * roundCorner); | |
| 5209 | + outputBezier.setXYAt(tan[0], tan[1], "o", outputBezier.length() - 1); | |
| 5210 | + tan = polarOffset(p1, angleIn, 2 * radius * roundCorner); | |
| 5211 | + outputBezier.setTripleAt(p1[0], p1[1], p1[0], p1[1], tan[0], tan[1], outputBezier.length()); | |
| 5212 | + return p1; | |
| 5213 | + } | |
| 5214 | + var intersection = lineIntersection(pointEqual(p0, seg1.points[2]) ? seg1.points[0] : seg1.points[2], p0, p1, pointEqual(p1, seg2.points[1]) ? seg2.points[3] : seg2.points[1]); | |
| 5215 | + if (intersection && pointDistance(intersection, p0) < miterLimit) { | |
| 5216 | + outputBezier.setTripleAt(intersection[0], intersection[1], intersection[0], intersection[1], intersection[0], intersection[1], outputBezier.length()); | |
| 5217 | + return intersection; | |
| 5218 | + } | |
| 5219 | + return p0; | |
| 5220 | + } | |
| 5221 | + function getIntersection(a, b) { | |
| 5222 | + var intersect = a.intersections(b); | |
| 5223 | + if (intersect.length && floatEqual(intersect[0][0], 1)) intersect.shift(); | |
| 5224 | + if (intersect.length) return intersect[0]; | |
| 5225 | + return null; | |
| 5226 | + } | |
| 5227 | + function pruneSegmentIntersection(a, b) { | |
| 5228 | + var outa = a.slice(); | |
| 5229 | + var outb = b.slice(); | |
| 5230 | + var intersect = getIntersection(a[a.length - 1], b[0]); | |
| 5231 | + if (intersect) { | |
| 5232 | + outa[a.length - 1] = a[a.length - 1].split(intersect[0])[0]; | |
| 5233 | + outb[0] = b[0].split(intersect[1])[1]; | |
| 5234 | + } | |
| 5235 | + if (a.length > 1 && b.length > 1) { | |
| 5236 | + intersect = getIntersection(a[0], b[b.length - 1]); | |
| 5237 | + if (intersect) return [[a[0].split(intersect[0])[0]], [b[b.length - 1].split(intersect[1])[1]]]; | |
| 5238 | + } | |
| 5239 | + return [outa, outb]; | |
| 5240 | + } | |
| 5241 | + function pruneIntersections(segments) { | |
| 5242 | + var e; | |
| 5243 | + for (var i = 1; i < segments.length; i += 1) { | |
| 5244 | + e = pruneSegmentIntersection(segments[i - 1], segments[i]); | |
| 5245 | + segments[i - 1] = e[0]; | |
| 5246 | + segments[i] = e[1]; | |
| 5247 | + } | |
| 5248 | + if (segments.length > 1) { | |
| 5249 | + e = pruneSegmentIntersection(segments[segments.length - 1], segments[0]); | |
| 5250 | + segments[segments.length - 1] = e[0]; | |
| 5251 | + segments[0] = e[1]; | |
| 5252 | + } | |
| 5253 | + return segments; | |
| 5254 | + } | |
| 5255 | + function offsetSegmentSplit(segment, amount) { | |
| 5256 | + var flex = segment.inflectionPoints(); | |
| 5257 | + var left; | |
| 5258 | + var right; | |
| 5259 | + var split; | |
| 5260 | + var mid; | |
| 5261 | + if (flex.length === 0) return [offsetSegment(segment, amount)]; | |
| 5262 | + if (flex.length === 1 || floatEqual(flex[1], 1)) { | |
| 5263 | + split = segment.split(flex[0]); | |
| 5264 | + left = split[0]; | |
| 5265 | + right = split[1]; | |
| 5266 | + return [offsetSegment(left, amount), offsetSegment(right, amount)]; | |
| 5267 | + } | |
| 5268 | + split = segment.split(flex[0]); | |
| 5269 | + left = split[0]; | |
| 5270 | + var t = (flex[1] - flex[0]) / (1 - flex[0]); | |
| 5271 | + split = split[1].split(t); | |
| 5272 | + mid = split[0]; | |
| 5273 | + right = split[1]; | |
| 5274 | + return [ | |
| 5275 | + offsetSegment(left, amount), | |
| 5276 | + offsetSegment(mid, amount), | |
| 5277 | + offsetSegment(right, amount) | |
| 5278 | + ]; | |
| 5279 | + } | |
| 5280 | + function OffsetPathModifier() {} | |
| 5281 | + extendPrototype([ShapeModifier], OffsetPathModifier); | |
| 5282 | + OffsetPathModifier.prototype.initModifierProperties = function(elem, data) { | |
| 5283 | + this.getValue = this.processKeys; | |
| 5284 | + this.amount = PropertyFactory.getProp(elem, data.a, 0, null, this); | |
| 5285 | + this.miterLimit = PropertyFactory.getProp(elem, data.ml, 0, null, this); | |
| 5286 | + this.lineJoin = data.lj; | |
| 5287 | + this._isAnimated = this.amount.effectsSequence.length !== 0; | |
| 5288 | + }; | |
| 5289 | + OffsetPathModifier.prototype.processPath = function(inputBezier, amount, lineJoin, miterLimit) { | |
| 5290 | + var outputBezier = shapePool.newElement(); | |
| 5291 | + outputBezier.c = inputBezier.c; | |
| 5292 | + var count = inputBezier.length(); | |
| 5293 | + if (!inputBezier.c) count -= 1; | |
| 5294 | + var i; | |
| 5295 | + var j; | |
| 5296 | + var segment; | |
| 5297 | + var multiSegments = []; | |
| 5298 | + for (i = 0; i < count; i += 1) { | |
| 5299 | + segment = PolynomialBezier.shapeSegment(inputBezier, i); | |
| 5300 | + multiSegments.push(offsetSegmentSplit(segment, amount)); | |
| 5301 | + } | |
| 5302 | + if (!inputBezier.c) for (i = count - 1; i >= 0; i -= 1) { | |
| 5303 | + segment = PolynomialBezier.shapeSegmentInverted(inputBezier, i); | |
| 5304 | + multiSegments.push(offsetSegmentSplit(segment, amount)); | |
| 5305 | + } | |
| 5306 | + multiSegments = pruneIntersections(multiSegments); | |
| 5307 | + var lastPoint = null; | |
| 5308 | + var lastSeg = null; | |
| 5309 | + for (i = 0; i < multiSegments.length; i += 1) { | |
| 5310 | + var multiSegment = multiSegments[i]; | |
| 5311 | + if (lastSeg) lastPoint = joinLines(outputBezier, lastSeg, multiSegment[0], lineJoin, miterLimit); | |
| 5312 | + lastSeg = multiSegment[multiSegment.length - 1]; | |
| 5313 | + for (j = 0; j < multiSegment.length; j += 1) { | |
| 5314 | + segment = multiSegment[j]; | |
| 5315 | + if (lastPoint && pointEqual(segment.points[0], lastPoint)) outputBezier.setXYAt(segment.points[1][0], segment.points[1][1], "o", outputBezier.length() - 1); | |
| 5316 | + else outputBezier.setTripleAt(segment.points[0][0], segment.points[0][1], segment.points[1][0], segment.points[1][1], segment.points[0][0], segment.points[0][1], outputBezier.length()); | |
| 5317 | + outputBezier.setTripleAt(segment.points[3][0], segment.points[3][1], segment.points[3][0], segment.points[3][1], segment.points[2][0], segment.points[2][1], outputBezier.length()); | |
| 5318 | + lastPoint = segment.points[3]; | |
| 5319 | + } | |
| 5320 | + } | |
| 5321 | + if (multiSegments.length) joinLines(outputBezier, lastSeg, multiSegments[0][0], lineJoin, miterLimit); | |
| 5322 | + return outputBezier; | |
| 5323 | + }; | |
| 5324 | + OffsetPathModifier.prototype.processShapes = function(_isFirstFrame) { | |
| 5325 | + var shapePaths; | |
| 5326 | + var i; | |
| 5327 | + var len = this.shapes.length; | |
| 5328 | + var j; | |
| 5329 | + var jLen; | |
| 5330 | + var amount = this.amount.v; | |
| 5331 | + var miterLimit = this.miterLimit.v; | |
| 5332 | + var lineJoin = this.lineJoin; | |
| 5333 | + if (amount !== 0) { | |
| 5334 | + var shapeData; | |
| 5335 | + var localShapeCollection; | |
| 5336 | + for (i = 0; i < len; i += 1) { | |
| 5337 | + shapeData = this.shapes[i]; | |
| 5338 | + localShapeCollection = shapeData.localShapeCollection; | |
| 5339 | + if (!(!shapeData.shape._mdf && !this._mdf && !_isFirstFrame)) { | |
| 5340 | + localShapeCollection.releaseShapes(); | |
| 5341 | + shapeData.shape._mdf = true; | |
| 5342 | + shapePaths = shapeData.shape.paths.shapes; | |
| 5343 | + jLen = shapeData.shape.paths._length; | |
| 5344 | + for (j = 0; j < jLen; j += 1) localShapeCollection.addShape(this.processPath(shapePaths[j], amount, lineJoin, miterLimit)); | |
| 5345 | + } | |
| 5346 | + shapeData.shape.paths = shapeData.localShapeCollection; | |
| 5347 | + } | |
| 5348 | + } | |
| 5349 | + if (!this.dynamicProperties.length) this._mdf = false; | |
| 5350 | + }; | |
| 5351 | + function getFontProperties(fontData) { | |
| 5352 | + var styles = fontData.fStyle ? fontData.fStyle.split(" ") : []; | |
| 5353 | + var fWeight = "normal"; | |
| 5354 | + var fStyle = "normal"; | |
| 5355 | + var len = styles.length; | |
| 5356 | + var styleName; | |
| 5357 | + for (var i = 0; i < len; i += 1) { | |
| 5358 | + styleName = styles[i].toLowerCase(); | |
| 5359 | + switch (styleName) { | |
| 5360 | + case "italic": | |
| 5361 | + fStyle = "italic"; | |
| 5362 | + break; | |
| 5363 | + case "bold": | |
| 5364 | + fWeight = "700"; | |
| 5365 | + break; | |
| 5366 | + case "black": | |
| 5367 | + fWeight = "900"; | |
| 5368 | + break; | |
| 5369 | + case "medium": | |
| 5370 | + fWeight = "500"; | |
| 5371 | + break; | |
| 5372 | + case "regular": | |
| 5373 | + case "normal": | |
| 5374 | + fWeight = "400"; | |
| 5375 | + break; | |
| 5376 | + case "light": | |
| 5377 | + case "thin": | |
| 5378 | + fWeight = "200"; | |
| 5379 | + break; | |
| 5380 | + default: break; | |
| 5381 | + } | |
| 5382 | + } | |
| 5383 | + return { | |
| 5384 | + style: fStyle, | |
| 5385 | + weight: fontData.fWeight || fWeight | |
| 5386 | + }; | |
| 5387 | + } | |
| 5388 | + var FontManager = function() { | |
| 5389 | + var maxWaitingTime = 5e3; | |
| 5390 | + var emptyChar = { | |
| 5391 | + w: 0, | |
| 5392 | + size: 0, | |
| 5393 | + shapes: [], | |
| 5394 | + data: { shapes: [] } | |
| 5395 | + }; | |
| 5396 | + var combinedCharacters = []; | |
| 5397 | + combinedCharacters = combinedCharacters.concat([ | |
| 5398 | + 2304, | |
| 5399 | + 2305, | |
| 5400 | + 2306, | |
| 5401 | + 2307, | |
| 5402 | + 2362, | |
| 5403 | + 2363, | |
| 5404 | + 2364, | |
| 5405 | + 2364, | |
| 5406 | + 2366, | |
| 5407 | + 2367, | |
| 5408 | + 2368, | |
| 5409 | + 2369, | |
| 5410 | + 2370, | |
| 5411 | + 2371, | |
| 5412 | + 2372, | |
| 5413 | + 2373, | |
| 5414 | + 2374, | |
| 5415 | + 2375, | |
| 5416 | + 2376, | |
| 5417 | + 2377, | |
| 5418 | + 2378, | |
| 5419 | + 2379, | |
| 5420 | + 2380, | |
| 5421 | + 2381, | |
| 5422 | + 2382, | |
| 5423 | + 2383, | |
| 5424 | + 2387, | |
| 5425 | + 2388, | |
| 5426 | + 2389, | |
| 5427 | + 2390, | |
| 5428 | + 2391, | |
| 5429 | + 2402, | |
| 5430 | + 2403 | |
| 5431 | + ]); | |
| 5432 | + var BLACK_FLAG_CODE_POINT = 127988; | |
| 5433 | + var CANCEL_TAG_CODE_POINT = 917631; | |
| 5434 | + var A_TAG_CODE_POINT = 917601; | |
| 5435 | + var Z_TAG_CODE_POINT = 917626; | |
| 5436 | + var VARIATION_SELECTOR_16_CODE_POINT = 65039; | |
| 5437 | + var ZERO_WIDTH_JOINER_CODE_POINT = 8205; | |
| 5438 | + var REGIONAL_CHARACTER_A_CODE_POINT = 127462; | |
| 5439 | + var REGIONAL_CHARACTER_Z_CODE_POINT = 127487; | |
| 5440 | + var surrogateModifiers = [ | |
| 5441 | + "d83cdffb", | |
| 5442 | + "d83cdffc", | |
| 5443 | + "d83cdffd", | |
| 5444 | + "d83cdffe", | |
| 5445 | + "d83cdfff" | |
| 5446 | + ]; | |
| 5447 | + function trimFontOptions(font) { | |
| 5448 | + var familyArray = font.split(","); | |
| 5449 | + var i; | |
| 5450 | + var len = familyArray.length; | |
| 5451 | + var enabledFamilies = []; | |
| 5452 | + for (i = 0; i < len; i += 1) if (familyArray[i] !== "sans-serif" && familyArray[i] !== "monospace") enabledFamilies.push(familyArray[i]); | |
| 5453 | + return enabledFamilies.join(","); | |
| 5454 | + } | |
| 5455 | + function setUpNode(font, family) { | |
| 5456 | + var parentNode = createTag("span"); | |
| 5457 | + parentNode.setAttribute("aria-hidden", true); | |
| 5458 | + parentNode.style.fontFamily = family; | |
| 5459 | + var node = createTag("span"); | |
| 5460 | + node.innerText = "giItT1WQy@!-/#"; | |
| 5461 | + parentNode.style.position = "absolute"; | |
| 5462 | + parentNode.style.left = "-10000px"; | |
| 5463 | + parentNode.style.top = "-10000px"; | |
| 5464 | + parentNode.style.fontSize = "300px"; | |
| 5465 | + parentNode.style.fontVariant = "normal"; | |
| 5466 | + parentNode.style.fontStyle = "normal"; | |
| 5467 | + parentNode.style.fontWeight = "normal"; | |
| 5468 | + parentNode.style.letterSpacing = "0"; | |
| 5469 | + parentNode.appendChild(node); | |
| 5470 | + document.body.appendChild(parentNode); | |
| 5471 | + var width = node.offsetWidth; | |
| 5472 | + node.style.fontFamily = trimFontOptions(font) + ", " + family; | |
| 5473 | + return { | |
| 5474 | + node, | |
| 5475 | + w: width, | |
| 5476 | + parent: parentNode | |
| 5477 | + }; | |
| 5478 | + } | |
| 5479 | + function checkLoadedFonts() { | |
| 5480 | + var i; | |
| 5481 | + var len = this.fonts.length; | |
| 5482 | + var node; | |
| 5483 | + var w; | |
| 5484 | + var loadedCount = len; | |
| 5485 | + for (i = 0; i < len; i += 1) if (this.fonts[i].loaded) loadedCount -= 1; | |
| 5486 | + else if (this.fonts[i].fOrigin === "n" || this.fonts[i].origin === 0) this.fonts[i].loaded = true; | |
| 5487 | + else { | |
| 5488 | + node = this.fonts[i].monoCase.node; | |
| 5489 | + w = this.fonts[i].monoCase.w; | |
| 5490 | + if (node.offsetWidth !== w) { | |
| 5491 | + loadedCount -= 1; | |
| 5492 | + this.fonts[i].loaded = true; | |
| 5493 | + } else { | |
| 5494 | + node = this.fonts[i].sansCase.node; | |
| 5495 | + w = this.fonts[i].sansCase.w; | |
| 5496 | + if (node.offsetWidth !== w) { | |
| 5497 | + loadedCount -= 1; | |
| 5498 | + this.fonts[i].loaded = true; | |
| 5499 | + } | |
| 5500 | + } | |
| 5501 | + if (this.fonts[i].loaded) { | |
| 5502 | + this.fonts[i].sansCase.parent.parentNode.removeChild(this.fonts[i].sansCase.parent); | |
| 5503 | + this.fonts[i].monoCase.parent.parentNode.removeChild(this.fonts[i].monoCase.parent); | |
| 5504 | + } | |
| 5505 | + } | |
| 5506 | + if (loadedCount !== 0 && Date.now() - this.initTime < maxWaitingTime) setTimeout(this.checkLoadedFontsBinded, 20); | |
| 5507 | + else setTimeout(this.setIsLoadedBinded, 10); | |
| 5508 | + } | |
| 5509 | + function createHelper(fontData, def) { | |
| 5510 | + var engine = document.body && def ? "svg" : "canvas"; | |
| 5511 | + var helper; | |
| 5512 | + var fontProps = getFontProperties(fontData); | |
| 5513 | + if (engine === "svg") { | |
| 5514 | + var tHelper = createNS("text"); | |
| 5515 | + tHelper.style.fontSize = "100px"; | |
| 5516 | + tHelper.setAttribute("font-family", fontData.fFamily); | |
| 5517 | + tHelper.setAttribute("font-style", fontProps.style); | |
| 5518 | + tHelper.setAttribute("font-weight", fontProps.weight); | |
| 5519 | + tHelper.textContent = "1"; | |
| 5520 | + if (fontData.fClass) { | |
| 5521 | + tHelper.style.fontFamily = "inherit"; | |
| 5522 | + tHelper.setAttribute("class", fontData.fClass); | |
| 5523 | + } else tHelper.style.fontFamily = fontData.fFamily; | |
| 5524 | + def.appendChild(tHelper); | |
| 5525 | + helper = tHelper; | |
| 5526 | + } else { | |
| 5527 | + var tCanvasHelper = new OffscreenCanvas(500, 500).getContext("2d"); | |
| 5528 | + tCanvasHelper.font = fontProps.style + " " + fontProps.weight + " 100px " + fontData.fFamily; | |
| 5529 | + helper = tCanvasHelper; | |
| 5530 | + } | |
| 5531 | + function measure(text) { | |
| 5532 | + if (engine === "svg") { | |
| 5533 | + helper.textContent = text; | |
| 5534 | + return helper.getComputedTextLength(); | |
| 5535 | + } | |
| 5536 | + return helper.measureText(text).width; | |
| 5537 | + } | |
| 5538 | + return { measureText: measure }; | |
| 5539 | + } | |
| 5540 | + function addFonts(fontData, defs) { | |
| 5541 | + if (!fontData) { | |
| 5542 | + this.isLoaded = true; | |
| 5543 | + return; | |
| 5544 | + } | |
| 5545 | + if (this.chars) { | |
| 5546 | + this.isLoaded = true; | |
| 5547 | + this.fonts = fontData.list; | |
| 5548 | + return; | |
| 5549 | + } | |
| 5550 | + if (!document.body) { | |
| 5551 | + this.isLoaded = true; | |
| 5552 | + fontData.list.forEach(function(data) { | |
| 5553 | + data.helper = createHelper(data); | |
| 5554 | + data.cache = {}; | |
| 5555 | + }); | |
| 5556 | + this.fonts = fontData.list; | |
| 5557 | + return; | |
| 5558 | + } | |
| 5559 | + var fontArr = fontData.list; | |
| 5560 | + var i; | |
| 5561 | + var len = fontArr.length; | |
| 5562 | + var _pendingFonts = len; | |
| 5563 | + for (i = 0; i < len; i += 1) { | |
| 5564 | + var shouldLoadFont = true; | |
| 5565 | + var loadedSelector; | |
| 5566 | + var j; | |
| 5567 | + fontArr[i].loaded = false; | |
| 5568 | + fontArr[i].monoCase = setUpNode(fontArr[i].fFamily, "monospace"); | |
| 5569 | + fontArr[i].sansCase = setUpNode(fontArr[i].fFamily, "sans-serif"); | |
| 5570 | + if (!fontArr[i].fPath) { | |
| 5571 | + fontArr[i].loaded = true; | |
| 5572 | + _pendingFonts -= 1; | |
| 5573 | + } else if (fontArr[i].fOrigin === "p" || fontArr[i].origin === 3) { | |
| 5574 | + loadedSelector = document.querySelectorAll("style[f-forigin=\"p\"][f-family=\"" + fontArr[i].fFamily + "\"], style[f-origin=\"3\"][f-family=\"" + fontArr[i].fFamily + "\"]"); | |
| 5575 | + if (loadedSelector.length > 0) shouldLoadFont = false; | |
| 5576 | + if (shouldLoadFont) { | |
| 5577 | + var s = createTag("style"); | |
| 5578 | + s.setAttribute("f-forigin", fontArr[i].fOrigin); | |
| 5579 | + s.setAttribute("f-origin", fontArr[i].origin); | |
| 5580 | + s.setAttribute("f-family", fontArr[i].fFamily); | |
| 5581 | + s.type = "text/css"; | |
| 5582 | + s.innerText = "@font-face {font-family: " + fontArr[i].fFamily + "; font-style: normal; src: url('" + fontArr[i].fPath + "');}"; | |
| 5583 | + defs.appendChild(s); | |
| 5584 | + } | |
| 5585 | + } else if (fontArr[i].fOrigin === "g" || fontArr[i].origin === 1) { | |
| 5586 | + loadedSelector = document.querySelectorAll("link[f-forigin=\"g\"], link[f-origin=\"1\"]"); | |
| 5587 | + for (j = 0; j < loadedSelector.length; j += 1) if (loadedSelector[j].href.indexOf(fontArr[i].fPath) !== -1) shouldLoadFont = false; | |
| 5588 | + if (shouldLoadFont) { | |
| 5589 | + var l = createTag("link"); | |
| 5590 | + l.setAttribute("f-forigin", fontArr[i].fOrigin); | |
| 5591 | + l.setAttribute("f-origin", fontArr[i].origin); | |
| 5592 | + l.type = "text/css"; | |
| 5593 | + l.rel = "stylesheet"; | |
| 5594 | + l.href = fontArr[i].fPath; | |
| 5595 | + document.body.appendChild(l); | |
| 5596 | + } | |
| 5597 | + } else if (fontArr[i].fOrigin === "t" || fontArr[i].origin === 2) { | |
| 5598 | + loadedSelector = document.querySelectorAll("script[f-forigin=\"t\"], script[f-origin=\"2\"]"); | |
| 5599 | + for (j = 0; j < loadedSelector.length; j += 1) if (fontArr[i].fPath === loadedSelector[j].src) shouldLoadFont = false; | |
| 5600 | + if (shouldLoadFont) { | |
| 5601 | + var sc = createTag("link"); | |
| 5602 | + sc.setAttribute("f-forigin", fontArr[i].fOrigin); | |
| 5603 | + sc.setAttribute("f-origin", fontArr[i].origin); | |
| 5604 | + sc.setAttribute("rel", "stylesheet"); | |
| 5605 | + sc.setAttribute("href", fontArr[i].fPath); | |
| 5606 | + defs.appendChild(sc); | |
| 5607 | + } | |
| 5608 | + } | |
| 5609 | + fontArr[i].helper = createHelper(fontArr[i], defs); | |
| 5610 | + fontArr[i].cache = {}; | |
| 5611 | + this.fonts.push(fontArr[i]); | |
| 5612 | + } | |
| 5613 | + if (_pendingFonts === 0) this.isLoaded = true; | |
| 5614 | + else setTimeout(this.checkLoadedFonts.bind(this), 100); | |
| 5615 | + } | |
| 5616 | + function addChars(chars) { | |
| 5617 | + if (!chars) return; | |
| 5618 | + if (!this.chars) this.chars = []; | |
| 5619 | + var i; | |
| 5620 | + var len = chars.length; | |
| 5621 | + var j; | |
| 5622 | + var jLen = this.chars.length; | |
| 5623 | + var found; | |
| 5624 | + for (i = 0; i < len; i += 1) { | |
| 5625 | + j = 0; | |
| 5626 | + found = false; | |
| 5627 | + while (j < jLen) { | |
| 5628 | + if (this.chars[j].style === chars[i].style && this.chars[j].fFamily === chars[i].fFamily && this.chars[j].ch === chars[i].ch) found = true; | |
| 5629 | + j += 1; | |
| 5630 | + } | |
| 5631 | + if (!found) { | |
| 5632 | + this.chars.push(chars[i]); | |
| 5633 | + jLen += 1; | |
| 5634 | + } | |
| 5635 | + } | |
| 5636 | + } | |
| 5637 | + function getCharData(_char, style, font) { | |
| 5638 | + var i = 0; | |
| 5639 | + var len = this.chars.length; | |
| 5640 | + while (i < len) { | |
| 5641 | + if (this.chars[i].ch === _char && this.chars[i].style === style && this.chars[i].fFamily === font) return this.chars[i]; | |
| 5642 | + i += 1; | |
| 5643 | + } | |
| 5644 | + if ((typeof _char === "string" && _char.charCodeAt(0) !== 13 || !_char) && console && console.warn && !this._warned) { | |
| 5645 | + this._warned = true; | |
| 5646 | + console.warn("Missing character from exported characters list: ", _char, style, font); | |
| 5647 | + } | |
| 5648 | + return emptyChar; | |
| 5649 | + } | |
| 5650 | + function measureText(_char2, fontName, size) { | |
| 5651 | + var fontData = this.getFontByName(fontName); | |
| 5652 | + var index = _char2; | |
| 5653 | + if (!fontData.cache[index]) { | |
| 5654 | + var tHelper = fontData.helper; | |
| 5655 | + if (_char2 === " ") { | |
| 5656 | + var doubleSize = tHelper.measureText("|" + _char2 + "|"); | |
| 5657 | + var singleSize = tHelper.measureText("||"); | |
| 5658 | + fontData.cache[index] = (doubleSize - singleSize) / 100; | |
| 5659 | + } else fontData.cache[index] = tHelper.measureText(_char2) / 100; | |
| 5660 | + } | |
| 5661 | + return fontData.cache[index] * size; | |
| 5662 | + } | |
| 5663 | + function getFontByName(name) { | |
| 5664 | + var i = 0; | |
| 5665 | + var len = this.fonts.length; | |
| 5666 | + while (i < len) { | |
| 5667 | + if (this.fonts[i].fName === name) return this.fonts[i]; | |
| 5668 | + i += 1; | |
| 5669 | + } | |
| 5670 | + return this.fonts[0]; | |
| 5671 | + } | |
| 5672 | + function getCodePoint(string) { | |
| 5673 | + var codePoint = 0; | |
| 5674 | + var first = string.charCodeAt(0); | |
| 5675 | + if (first >= 55296 && first <= 56319) { | |
| 5676 | + var second = string.charCodeAt(1); | |
| 5677 | + if (second >= 56320 && second <= 57343) codePoint = (first - 55296) * 1024 + second - 56320 + 65536; | |
| 5678 | + } | |
| 5679 | + return codePoint; | |
| 5680 | + } | |
| 5681 | + function isModifier(firstCharCode, secondCharCode) { | |
| 5682 | + var sum = firstCharCode.toString(16) + secondCharCode.toString(16); | |
| 5683 | + return surrogateModifiers.indexOf(sum) !== -1; | |
| 5684 | + } | |
| 5685 | + function isZeroWidthJoiner(charCode) { | |
| 5686 | + return charCode === ZERO_WIDTH_JOINER_CODE_POINT; | |
| 5687 | + } | |
| 5688 | + function isVariationSelector(charCode) { | |
| 5689 | + return charCode === VARIATION_SELECTOR_16_CODE_POINT; | |
| 5690 | + } | |
| 5691 | + function isRegionalCode(string) { | |
| 5692 | + var codePoint = getCodePoint(string); | |
| 5693 | + if (codePoint >= REGIONAL_CHARACTER_A_CODE_POINT && codePoint <= REGIONAL_CHARACTER_Z_CODE_POINT) return true; | |
| 5694 | + return false; | |
| 5695 | + } | |
| 5696 | + function isFlagEmoji(string) { | |
| 5697 | + return isRegionalCode(string.substr(0, 2)) && isRegionalCode(string.substr(2, 2)); | |
| 5698 | + } | |
| 5699 | + function isCombinedCharacter(_char3) { | |
| 5700 | + return combinedCharacters.indexOf(_char3) !== -1; | |
| 5701 | + } | |
| 5702 | + function isRegionalFlag(text, index) { | |
| 5703 | + var codePoint = getCodePoint(text.substr(index, 2)); | |
| 5704 | + if (codePoint !== BLACK_FLAG_CODE_POINT) return false; | |
| 5705 | + var count = 0; | |
| 5706 | + index += 2; | |
| 5707 | + while (count < 5) { | |
| 5708 | + codePoint = getCodePoint(text.substr(index, 2)); | |
| 5709 | + if (codePoint < A_TAG_CODE_POINT || codePoint > Z_TAG_CODE_POINT) return false; | |
| 5710 | + count += 1; | |
| 5711 | + index += 2; | |
| 5712 | + } | |
| 5713 | + return getCodePoint(text.substr(index, 2)) === CANCEL_TAG_CODE_POINT; | |
| 5714 | + } | |
| 5715 | + function setIsLoaded() { | |
| 5716 | + this.isLoaded = true; | |
| 5717 | + } | |
| 5718 | + var Font = function Font() { | |
| 5719 | + this.fonts = []; | |
| 5720 | + this.chars = null; | |
| 5721 | + this.typekitLoaded = 0; | |
| 5722 | + this.isLoaded = false; | |
| 5723 | + this._warned = false; | |
| 5724 | + this.initTime = Date.now(); | |
| 5725 | + this.setIsLoadedBinded = this.setIsLoaded.bind(this); | |
| 5726 | + this.checkLoadedFontsBinded = this.checkLoadedFonts.bind(this); | |
| 5727 | + }; | |
| 5728 | + Font.isModifier = isModifier; | |
| 5729 | + Font.isZeroWidthJoiner = isZeroWidthJoiner; | |
| 5730 | + Font.isFlagEmoji = isFlagEmoji; | |
| 5731 | + Font.isRegionalCode = isRegionalCode; | |
| 5732 | + Font.isCombinedCharacter = isCombinedCharacter; | |
| 5733 | + Font.isRegionalFlag = isRegionalFlag; | |
| 5734 | + Font.isVariationSelector = isVariationSelector; | |
| 5735 | + Font.BLACK_FLAG_CODE_POINT = BLACK_FLAG_CODE_POINT; | |
| 5736 | + Font.prototype = { | |
| 5737 | + addChars, | |
| 5738 | + addFonts, | |
| 5739 | + getCharData, | |
| 5740 | + getFontByName, | |
| 5741 | + measureText, | |
| 5742 | + checkLoadedFonts, | |
| 5743 | + setIsLoaded | |
| 5744 | + }; | |
| 5745 | + return Font; | |
| 5746 | + }(); | |
| 5747 | + function SlotManager(animationData) { | |
| 5748 | + this.animationData = animationData; | |
| 5749 | + } | |
| 5750 | + SlotManager.prototype.getProp = function(data) { | |
| 5751 | + if (this.animationData.slots && this.animationData.slots[data.sid]) return Object.assign(data, this.animationData.slots[data.sid].p); | |
| 5752 | + return data; | |
| 5753 | + }; | |
| 5754 | + function slotFactory(animationData) { | |
| 5755 | + return new SlotManager(animationData); | |
| 5756 | + } | |
| 5757 | + function RenderableElement() {} | |
| 5758 | + RenderableElement.prototype = { | |
| 5759 | + initRenderable: function initRenderable() { | |
| 5760 | + this.isInRange = false; | |
| 5761 | + this.hidden = false; | |
| 5762 | + this.isTransparent = false; | |
| 5763 | + this.renderableComponents = []; | |
| 5764 | + }, | |
| 5765 | + addRenderableComponent: function addRenderableComponent(component) { | |
| 5766 | + if (this.renderableComponents.indexOf(component) === -1) this.renderableComponents.push(component); | |
| 5767 | + }, | |
| 5768 | + removeRenderableComponent: function removeRenderableComponent(component) { | |
| 5769 | + if (this.renderableComponents.indexOf(component) !== -1) this.renderableComponents.splice(this.renderableComponents.indexOf(component), 1); | |
| 5770 | + }, | |
| 5771 | + prepareRenderableFrame: function prepareRenderableFrame(num) { | |
| 5772 | + this.checkLayerLimits(num); | |
| 5773 | + }, | |
| 5774 | + checkTransparency: function checkTransparency() { | |
| 5775 | + if (this.finalTransform.mProp.o.v <= 0) { | |
| 5776 | + if (!this.isTransparent && this.globalData.renderConfig.hideOnTransparent) { | |
| 5777 | + this.isTransparent = true; | |
| 5778 | + this.hide(); | |
| 5779 | + } | |
| 5780 | + } else if (this.isTransparent) { | |
| 5781 | + this.isTransparent = false; | |
| 5782 | + this.show(); | |
| 5783 | + } | |
| 5784 | + }, | |
| 5785 | + /** | |
| 5786 | + * @function | |
| 5787 | + * Initializes frame related properties. | |
| 5788 | + * | |
| 5789 | + * @param {number} num | |
| 5790 | + * current frame number in Layer's time | |
| 5791 | + * | |
| 5792 | + */ | |
| 5793 | + checkLayerLimits: function checkLayerLimits(num) { | |
| 5794 | + if (this.data.ip - this.data.st <= num && this.data.op - this.data.st > num) { | |
| 5795 | + if (this.isInRange !== true) { | |
| 5796 | + this.globalData._mdf = true; | |
| 5797 | + this._mdf = true; | |
| 5798 | + this.isInRange = true; | |
| 5799 | + this.show(); | |
| 5800 | + } | |
| 5801 | + } else if (this.isInRange !== false) { | |
| 5802 | + this.globalData._mdf = true; | |
| 5803 | + this.isInRange = false; | |
| 5804 | + this.hide(); | |
| 5805 | + } | |
| 5806 | + }, | |
| 5807 | + renderRenderable: function renderRenderable() { | |
| 5808 | + var i; | |
| 5809 | + var len = this.renderableComponents.length; | |
| 5810 | + for (i = 0; i < len; i += 1) this.renderableComponents[i].renderFrame(this._isFirstFrame); | |
| 5811 | + }, | |
| 5812 | + sourceRectAtTime: function sourceRectAtTime() { | |
| 5813 | + return { | |
| 5814 | + top: 0, | |
| 5815 | + left: 0, | |
| 5816 | + width: 100, | |
| 5817 | + height: 100 | |
| 5818 | + }; | |
| 5819 | + }, | |
| 5820 | + getLayerSize: function getLayerSize() { | |
| 5821 | + if (this.data.ty === 5) return { | |
| 5822 | + w: this.data.textData.width, | |
| 5823 | + h: this.data.textData.height | |
| 5824 | + }; | |
| 5825 | + return { | |
| 5826 | + w: this.data.width, | |
| 5827 | + h: this.data.height | |
| 5828 | + }; | |
| 5829 | + } | |
| 5830 | + }; | |
| 5831 | + var getBlendMode = function() { | |
| 5832 | + var blendModeEnums = { | |
| 5833 | + 0: "source-over", | |
| 5834 | + 1: "multiply", | |
| 5835 | + 2: "screen", | |
| 5836 | + 3: "overlay", | |
| 5837 | + 4: "darken", | |
| 5838 | + 5: "lighten", | |
| 5839 | + 6: "color-dodge", | |
| 5840 | + 7: "color-burn", | |
| 5841 | + 8: "hard-light", | |
| 5842 | + 9: "soft-light", | |
| 5843 | + 10: "difference", | |
| 5844 | + 11: "exclusion", | |
| 5845 | + 12: "hue", | |
| 5846 | + 13: "saturation", | |
| 5847 | + 14: "color", | |
| 5848 | + 15: "luminosity" | |
| 5849 | + }; | |
| 5850 | + return function(mode) { | |
| 5851 | + return blendModeEnums[mode] || ""; | |
| 5852 | + }; | |
| 5853 | + }(); | |
| 5854 | + function SliderEffect(data, elem, container) { | |
| 5855 | + this.p = PropertyFactory.getProp(elem, data.v, 0, 0, container); | |
| 5856 | + } | |
| 5857 | + function AngleEffect(data, elem, container) { | |
| 5858 | + this.p = PropertyFactory.getProp(elem, data.v, 0, 0, container); | |
| 5859 | + } | |
| 5860 | + function ColorEffect(data, elem, container) { | |
| 5861 | + this.p = PropertyFactory.getProp(elem, data.v, 1, 0, container); | |
| 5862 | + } | |
| 5863 | + function PointEffect(data, elem, container) { | |
| 5864 | + this.p = PropertyFactory.getProp(elem, data.v, 1, 0, container); | |
| 5865 | + } | |
| 5866 | + function LayerIndexEffect(data, elem, container) { | |
| 5867 | + this.p = PropertyFactory.getProp(elem, data.v, 0, 0, container); | |
| 5868 | + } | |
| 5869 | + function MaskIndexEffect(data, elem, container) { | |
| 5870 | + this.p = PropertyFactory.getProp(elem, data.v, 0, 0, container); | |
| 5871 | + } | |
| 5872 | + function CheckboxEffect(data, elem, container) { | |
| 5873 | + this.p = PropertyFactory.getProp(elem, data.v, 0, 0, container); | |
| 5874 | + } | |
| 5875 | + function NoValueEffect() { | |
| 5876 | + this.p = {}; | |
| 5877 | + } | |
| 5878 | + function EffectsManager(data, element) { | |
| 5879 | + var effects = data.ef || []; | |
| 5880 | + this.effectElements = []; | |
| 5881 | + var i; | |
| 5882 | + var len = effects.length; | |
| 5883 | + var effectItem; | |
| 5884 | + for (i = 0; i < len; i += 1) { | |
| 5885 | + effectItem = new GroupEffect(effects[i], element); | |
| 5886 | + this.effectElements.push(effectItem); | |
| 5887 | + } | |
| 5888 | + } | |
| 5889 | + function GroupEffect(data, element) { | |
| 5890 | + this.init(data, element); | |
| 5891 | + } | |
| 5892 | + extendPrototype([DynamicPropertyContainer], GroupEffect); | |
| 5893 | + GroupEffect.prototype.getValue = GroupEffect.prototype.iterateDynamicProperties; | |
| 5894 | + GroupEffect.prototype.init = function(data, element) { | |
| 5895 | + this.data = data; | |
| 5896 | + this.effectElements = []; | |
| 5897 | + this.initDynamicPropertyContainer(element); | |
| 5898 | + var i; | |
| 5899 | + var len = this.data.ef.length; | |
| 5900 | + var eff; | |
| 5901 | + var effects = this.data.ef; | |
| 5902 | + for (i = 0; i < len; i += 1) { | |
| 5903 | + eff = null; | |
| 5904 | + switch (effects[i].ty) { | |
| 5905 | + case 0: | |
| 5906 | + eff = new SliderEffect(effects[i], element, this); | |
| 5907 | + break; | |
| 5908 | + case 1: | |
| 5909 | + eff = new AngleEffect(effects[i], element, this); | |
| 5910 | + break; | |
| 5911 | + case 2: | |
| 5912 | + eff = new ColorEffect(effects[i], element, this); | |
| 5913 | + break; | |
| 5914 | + case 3: | |
| 5915 | + eff = new PointEffect(effects[i], element, this); | |
| 5916 | + break; | |
| 5917 | + case 4: | |
| 5918 | + case 7: | |
| 5919 | + eff = new CheckboxEffect(effects[i], element, this); | |
| 5920 | + break; | |
| 5921 | + case 10: | |
| 5922 | + eff = new LayerIndexEffect(effects[i], element, this); | |
| 5923 | + break; | |
| 5924 | + case 11: | |
| 5925 | + eff = new MaskIndexEffect(effects[i], element, this); | |
| 5926 | + break; | |
| 5927 | + case 5: | |
| 5928 | + eff = new EffectsManager(effects[i], element, this); | |
| 5929 | + break; | |
| 5930 | + default: | |
| 5931 | + eff = new NoValueEffect(effects[i], element, this); | |
| 5932 | + break; | |
| 5933 | + } | |
| 5934 | + if (eff) this.effectElements.push(eff); | |
| 5935 | + } | |
| 5936 | + }; | |
| 5937 | + function BaseElement() {} | |
| 5938 | + BaseElement.prototype = { | |
| 5939 | + checkMasks: function checkMasks() { | |
| 5940 | + if (!this.data.hasMask) return false; | |
| 5941 | + var i = 0; | |
| 5942 | + var len = this.data.masksProperties.length; | |
| 5943 | + while (i < len) { | |
| 5944 | + if (this.data.masksProperties[i].mode !== "n" && this.data.masksProperties[i].cl !== false) return true; | |
| 5945 | + i += 1; | |
| 5946 | + } | |
| 5947 | + return false; | |
| 5948 | + }, | |
| 5949 | + initExpressions: function initExpressions() { | |
| 5950 | + var expressionsInterfaces = getExpressionInterfaces(); | |
| 5951 | + if (!expressionsInterfaces) return; | |
| 5952 | + var LayerExpressionInterface = expressionsInterfaces("layer"); | |
| 5953 | + var EffectsExpressionInterface = expressionsInterfaces("effects"); | |
| 5954 | + var ShapeExpressionInterface = expressionsInterfaces("shape"); | |
| 5955 | + var TextExpressionInterface = expressionsInterfaces("text"); | |
| 5956 | + var CompExpressionInterface = expressionsInterfaces("comp"); | |
| 5957 | + this.layerInterface = LayerExpressionInterface(this); | |
| 5958 | + if (this.data.hasMask && this.maskManager) this.layerInterface.registerMaskInterface(this.maskManager); | |
| 5959 | + var effectsInterface = EffectsExpressionInterface.createEffectsInterface(this, this.layerInterface); | |
| 5960 | + this.layerInterface.registerEffectsInterface(effectsInterface); | |
| 5961 | + if (this.data.ty === 0 || this.data.xt) this.compInterface = CompExpressionInterface(this); | |
| 5962 | + else if (this.data.ty === 4) { | |
| 5963 | + this.layerInterface.shapeInterface = ShapeExpressionInterface(this.shapesData, this.itemsData, this.layerInterface); | |
| 5964 | + this.layerInterface.content = this.layerInterface.shapeInterface; | |
| 5965 | + } else if (this.data.ty === 5) { | |
| 5966 | + this.layerInterface.textInterface = TextExpressionInterface(this); | |
| 5967 | + this.layerInterface.text = this.layerInterface.textInterface; | |
| 5968 | + } | |
| 5969 | + }, | |
| 5970 | + setBlendMode: function setBlendMode() { | |
| 5971 | + var blendModeValue = getBlendMode(this.data.bm); | |
| 5972 | + var elem = this.baseElement || this.layerElement; | |
| 5973 | + elem.style["mix-blend-mode"] = blendModeValue; | |
| 5974 | + }, | |
| 5975 | + initBaseData: function initBaseData(data, globalData, comp) { | |
| 5976 | + this.globalData = globalData; | |
| 5977 | + this.comp = comp; | |
| 5978 | + this.data = data; | |
| 5979 | + this.layerId = createElementID(); | |
| 5980 | + if (!this.data.sr) this.data.sr = 1; | |
| 5981 | + this.effectsManager = new EffectsManager(this.data, this, this.dynamicProperties); | |
| 5982 | + }, | |
| 5983 | + getType: function getType() { | |
| 5984 | + return this.type; | |
| 5985 | + }, | |
| 5986 | + sourceRectAtTime: function sourceRectAtTime() {} | |
| 5987 | + }; | |
| 5988 | + /** | |
| 5989 | + * @file | |
| 5990 | + * Handles element's layer frame update. | |
| 5991 | + * Checks layer in point and out point | |
| 5992 | + * | |
| 5993 | + */ | |
| 5994 | + function FrameElement() {} | |
| 5995 | + FrameElement.prototype = { | |
| 5996 | + /** | |
| 5997 | + * @function | |
| 5998 | + * Initializes frame related properties. | |
| 5999 | + * | |
| 6000 | + */ | |
| 6001 | + initFrame: function initFrame() { | |
| 6002 | + this._isFirstFrame = false; | |
| 6003 | + this.dynamicProperties = []; | |
| 6004 | + this._mdf = false; | |
| 6005 | + }, | |
| 6006 | + /** | |
| 6007 | + * @function | |
| 6008 | + * Calculates all dynamic values | |
| 6009 | + * | |
| 6010 | + * @param {number} num | |
| 6011 | + * current frame number in Layer's time | |
| 6012 | + * @param {boolean} isVisible | |
| 6013 | + * if layers is currently in range | |
| 6014 | + * | |
| 6015 | + */ | |
| 6016 | + prepareProperties: function prepareProperties(num, isVisible) { | |
| 6017 | + var i; | |
| 6018 | + var len = this.dynamicProperties.length; | |
| 6019 | + for (i = 0; i < len; i += 1) if (isVisible || this._isParent && this.dynamicProperties[i].propType === "transform") { | |
| 6020 | + this.dynamicProperties[i].getValue(); | |
| 6021 | + if (this.dynamicProperties[i]._mdf) { | |
| 6022 | + this.globalData._mdf = true; | |
| 6023 | + this._mdf = true; | |
| 6024 | + } | |
| 6025 | + } | |
| 6026 | + }, | |
| 6027 | + addDynamicProperty: function addDynamicProperty(prop) { | |
| 6028 | + if (this.dynamicProperties.indexOf(prop) === -1) this.dynamicProperties.push(prop); | |
| 6029 | + } | |
| 6030 | + }; | |
| 6031 | + function FootageElement(data, globalData, comp) { | |
| 6032 | + this.initFrame(); | |
| 6033 | + this.initRenderable(); | |
| 6034 | + this.assetData = globalData.getAssetData(data.refId); | |
| 6035 | + this.footageData = globalData.imageLoader.getAsset(this.assetData); | |
| 6036 | + this.initBaseData(data, globalData, comp); | |
| 6037 | + } | |
| 6038 | + FootageElement.prototype.prepareFrame = function() {}; | |
| 6039 | + extendPrototype([ | |
| 6040 | + RenderableElement, | |
| 6041 | + BaseElement, | |
| 6042 | + FrameElement | |
| 6043 | + ], FootageElement); | |
| 6044 | + FootageElement.prototype.getBaseElement = function() { | |
| 6045 | + return null; | |
| 6046 | + }; | |
| 6047 | + FootageElement.prototype.renderFrame = function() {}; | |
| 6048 | + FootageElement.prototype.destroy = function() {}; | |
| 6049 | + FootageElement.prototype.initExpressions = function() { | |
| 6050 | + var expressionsInterfaces = getExpressionInterfaces(); | |
| 6051 | + if (!expressionsInterfaces) return; | |
| 6052 | + var FootageInterface = expressionsInterfaces("footage"); | |
| 6053 | + this.layerInterface = FootageInterface(this); | |
| 6054 | + }; | |
| 6055 | + FootageElement.prototype.getFootageData = function() { | |
| 6056 | + return this.footageData; | |
| 6057 | + }; | |
| 6058 | + function AudioElement(data, globalData, comp) { | |
| 6059 | + this.initFrame(); | |
| 6060 | + this.initRenderable(); | |
| 6061 | + this.assetData = globalData.getAssetData(data.refId); | |
| 6062 | + this.initBaseData(data, globalData, comp); | |
| 6063 | + this._isPlaying = false; | |
| 6064 | + this._canPlay = false; | |
| 6065 | + var assetPath = this.globalData.getAssetsPath(this.assetData); | |
| 6066 | + this.audio = this.globalData.audioController.createAudio(assetPath); | |
| 6067 | + this._currentTime = 0; | |
| 6068 | + this.globalData.audioController.addAudio(this); | |
| 6069 | + this._volumeMultiplier = 1; | |
| 6070 | + this._volume = 1; | |
| 6071 | + this._previousVolume = null; | |
| 6072 | + this.tm = data.tm ? PropertyFactory.getProp(this, data.tm, 0, globalData.frameRate, this) : { _placeholder: true }; | |
| 6073 | + this.lv = PropertyFactory.getProp(this, data.au && data.au.lv ? data.au.lv : { k: [100] }, 1, .01, this); | |
| 6074 | + } | |
| 6075 | + AudioElement.prototype.prepareFrame = function(num) { | |
| 6076 | + this.prepareRenderableFrame(num, true); | |
| 6077 | + this.prepareProperties(num, true); | |
| 6078 | + if (!this.tm._placeholder) { | |
| 6079 | + var timeRemapped = this.tm.v; | |
| 6080 | + this._currentTime = timeRemapped; | |
| 6081 | + } else this._currentTime = num / this.data.sr; | |
| 6082 | + this._volume = this.lv.v[0]; | |
| 6083 | + var totalVolume = this._volume * this._volumeMultiplier; | |
| 6084 | + if (this._previousVolume !== totalVolume) { | |
| 6085 | + this._previousVolume = totalVolume; | |
| 6086 | + this.audio.volume(totalVolume); | |
| 6087 | + } | |
| 6088 | + }; | |
| 6089 | + extendPrototype([ | |
| 6090 | + RenderableElement, | |
| 6091 | + BaseElement, | |
| 6092 | + FrameElement | |
| 6093 | + ], AudioElement); | |
| 6094 | + AudioElement.prototype.renderFrame = function() { | |
| 6095 | + if (this.isInRange && this._canPlay) { | |
| 6096 | + if (!this._isPlaying) { | |
| 6097 | + this.audio.play(); | |
| 6098 | + this.audio.seek(this._currentTime / this.globalData.frameRate); | |
| 6099 | + this._isPlaying = true; | |
| 6100 | + } else if (!this.audio.playing() || Math.abs(this._currentTime / this.globalData.frameRate - this.audio.seek()) > .1) this.audio.seek(this._currentTime / this.globalData.frameRate); | |
| 6101 | + } | |
| 6102 | + }; | |
| 6103 | + AudioElement.prototype.show = function() {}; | |
| 6104 | + AudioElement.prototype.hide = function() { | |
| 6105 | + this.audio.pause(); | |
| 6106 | + this._isPlaying = false; | |
| 6107 | + }; | |
| 6108 | + AudioElement.prototype.pause = function() { | |
| 6109 | + this.audio.pause(); | |
| 6110 | + this._isPlaying = false; | |
| 6111 | + this._canPlay = false; | |
| 6112 | + }; | |
| 6113 | + AudioElement.prototype.resume = function() { | |
| 6114 | + this._canPlay = true; | |
| 6115 | + }; | |
| 6116 | + AudioElement.prototype.setRate = function(rateValue) { | |
| 6117 | + this.audio.rate(rateValue); | |
| 6118 | + }; | |
| 6119 | + AudioElement.prototype.volume = function(volumeValue) { | |
| 6120 | + this._volumeMultiplier = volumeValue; | |
| 6121 | + this._previousVolume = volumeValue * this._volume; | |
| 6122 | + this.audio.volume(this._previousVolume); | |
| 6123 | + }; | |
| 6124 | + AudioElement.prototype.getBaseElement = function() { | |
| 6125 | + return null; | |
| 6126 | + }; | |
| 6127 | + AudioElement.prototype.destroy = function() {}; | |
| 6128 | + AudioElement.prototype.sourceRectAtTime = function() {}; | |
| 6129 | + AudioElement.prototype.initExpressions = function() {}; | |
| 6130 | + function BaseRenderer() {} | |
| 6131 | + BaseRenderer.prototype.checkLayers = function(num) { | |
| 6132 | + var i; | |
| 6133 | + var len = this.layers.length; | |
| 6134 | + var data; | |
| 6135 | + this.completeLayers = true; | |
| 6136 | + for (i = len - 1; i >= 0; i -= 1) { | |
| 6137 | + if (!this.elements[i]) { | |
| 6138 | + data = this.layers[i]; | |
| 6139 | + if (data.ip - data.st <= num - this.layers[i].st && data.op - data.st > num - this.layers[i].st) this.buildItem(i); | |
| 6140 | + } | |
| 6141 | + this.completeLayers = this.elements[i] ? this.completeLayers : false; | |
| 6142 | + } | |
| 6143 | + this.checkPendingElements(); | |
| 6144 | + }; | |
| 6145 | + BaseRenderer.prototype.createItem = function(layer) { | |
| 6146 | + switch (layer.ty) { | |
| 6147 | + case 2: return this.createImage(layer); | |
| 6148 | + case 0: return this.createComp(layer); | |
| 6149 | + case 1: return this.createSolid(layer); | |
| 6150 | + case 3: return this.createNull(layer); | |
| 6151 | + case 4: return this.createShape(layer); | |
| 6152 | + case 5: return this.createText(layer); | |
| 6153 | + case 6: return this.createAudio(layer); | |
| 6154 | + case 13: return this.createCamera(layer); | |
| 6155 | + case 15: return this.createFootage(layer); | |
| 6156 | + default: return this.createNull(layer); | |
| 6157 | + } | |
| 6158 | + }; | |
| 6159 | + BaseRenderer.prototype.createCamera = function() { | |
| 6160 | + throw new Error("You're using a 3d camera. Try the html renderer."); | |
| 6161 | + }; | |
| 6162 | + BaseRenderer.prototype.createAudio = function(data) { | |
| 6163 | + return new AudioElement(data, this.globalData, this); | |
| 6164 | + }; | |
| 6165 | + BaseRenderer.prototype.createFootage = function(data) { | |
| 6166 | + return new FootageElement(data, this.globalData, this); | |
| 6167 | + }; | |
| 6168 | + BaseRenderer.prototype.buildAllItems = function() { | |
| 6169 | + var i; | |
| 6170 | + var len = this.layers.length; | |
| 6171 | + for (i = 0; i < len; i += 1) this.buildItem(i); | |
| 6172 | + this.checkPendingElements(); | |
| 6173 | + }; | |
| 6174 | + BaseRenderer.prototype.includeLayers = function(newLayers) { | |
| 6175 | + this.completeLayers = false; | |
| 6176 | + var i; | |
| 6177 | + var len = newLayers.length; | |
| 6178 | + var j; | |
| 6179 | + var jLen = this.layers.length; | |
| 6180 | + for (i = 0; i < len; i += 1) { | |
| 6181 | + j = 0; | |
| 6182 | + while (j < jLen) { | |
| 6183 | + if (this.layers[j].id === newLayers[i].id) { | |
| 6184 | + this.layers[j] = newLayers[i]; | |
| 6185 | + break; | |
| 6186 | + } | |
| 6187 | + j += 1; | |
| 6188 | + } | |
| 6189 | + } | |
| 6190 | + }; | |
| 6191 | + BaseRenderer.prototype.setProjectInterface = function(pInterface) { | |
| 6192 | + this.globalData.projectInterface = pInterface; | |
| 6193 | + }; | |
| 6194 | + BaseRenderer.prototype.initItems = function() { | |
| 6195 | + if (!this.globalData.progressiveLoad) this.buildAllItems(); | |
| 6196 | + }; | |
| 6197 | + BaseRenderer.prototype.buildElementParenting = function(element, parentName, hierarchy) { | |
| 6198 | + var elements = this.elements; | |
| 6199 | + var layers = this.layers; | |
| 6200 | + var i = 0; | |
| 6201 | + var len = layers.length; | |
| 6202 | + while (i < len) { | |
| 6203 | + if (layers[i].ind == parentName) if (!elements[i] || elements[i] === true) { | |
| 6204 | + this.buildItem(i); | |
| 6205 | + this.addPendingElement(element); | |
| 6206 | + } else { | |
| 6207 | + hierarchy.push(elements[i]); | |
| 6208 | + elements[i].setAsParent(); | |
| 6209 | + if (layers[i].parent !== void 0) this.buildElementParenting(element, layers[i].parent, hierarchy); | |
| 6210 | + else element.setHierarchy(hierarchy); | |
| 6211 | + } | |
| 6212 | + i += 1; | |
| 6213 | + } | |
| 6214 | + }; | |
| 6215 | + BaseRenderer.prototype.addPendingElement = function(element) { | |
| 6216 | + this.pendingElements.push(element); | |
| 6217 | + }; | |
| 6218 | + BaseRenderer.prototype.searchExtraCompositions = function(assets) { | |
| 6219 | + var i; | |
| 6220 | + var len = assets.length; | |
| 6221 | + for (i = 0; i < len; i += 1) if (assets[i].xt) { | |
| 6222 | + var comp = this.createComp(assets[i]); | |
| 6223 | + comp.initExpressions(); | |
| 6224 | + this.globalData.projectInterface.registerComposition(comp); | |
| 6225 | + } | |
| 6226 | + }; | |
| 6227 | + BaseRenderer.prototype.getElementById = function(ind) { | |
| 6228 | + var i; | |
| 6229 | + var len = this.elements.length; | |
| 6230 | + for (i = 0; i < len; i += 1) if (this.elements[i].data.ind === ind) return this.elements[i]; | |
| 6231 | + return null; | |
| 6232 | + }; | |
| 6233 | + BaseRenderer.prototype.getElementByPath = function(path) { | |
| 6234 | + var pathValue = path.shift(); | |
| 6235 | + var element; | |
| 6236 | + if (typeof pathValue === "number") element = this.elements[pathValue]; | |
| 6237 | + else { | |
| 6238 | + var i; | |
| 6239 | + var len = this.elements.length; | |
| 6240 | + for (i = 0; i < len; i += 1) if (this.elements[i].data.nm === pathValue) { | |
| 6241 | + element = this.elements[i]; | |
| 6242 | + break; | |
| 6243 | + } | |
| 6244 | + } | |
| 6245 | + if (path.length === 0) return element; | |
| 6246 | + return element.getElementByPath(path); | |
| 6247 | + }; | |
| 6248 | + BaseRenderer.prototype.setupGlobalData = function(animData, fontsContainer) { | |
| 6249 | + this.globalData.fontManager = new FontManager(); | |
| 6250 | + this.globalData.slotManager = slotFactory(animData); | |
| 6251 | + this.globalData.fontManager.addChars(animData.chars); | |
| 6252 | + this.globalData.fontManager.addFonts(animData.fonts, fontsContainer); | |
| 6253 | + this.globalData.getAssetData = this.animationItem.getAssetData.bind(this.animationItem); | |
| 6254 | + this.globalData.getAssetsPath = this.animationItem.getAssetsPath.bind(this.animationItem); | |
| 6255 | + this.globalData.imageLoader = this.animationItem.imagePreloader; | |
| 6256 | + this.globalData.audioController = this.animationItem.audioController; | |
| 6257 | + this.globalData.frameId = 0; | |
| 6258 | + this.globalData.frameRate = animData.fr; | |
| 6259 | + this.globalData.nm = animData.nm; | |
| 6260 | + this.globalData.compSize = { | |
| 6261 | + w: animData.w, | |
| 6262 | + h: animData.h | |
| 6263 | + }; | |
| 6264 | + }; | |
| 6265 | + var effectTypes = { TRANSFORM_EFFECT: "transformEFfect" }; | |
| 6266 | + function TransformElement() {} | |
| 6267 | + TransformElement.prototype = { | |
| 6268 | + initTransform: function initTransform() { | |
| 6269 | + var mat = new Matrix(); | |
| 6270 | + this.finalTransform = { | |
| 6271 | + mProp: this.data.ks ? TransformPropertyFactory.getTransformProperty(this, this.data.ks, this) : { o: 0 }, | |
| 6272 | + _matMdf: false, | |
| 6273 | + _localMatMdf: false, | |
| 6274 | + _opMdf: false, | |
| 6275 | + mat, | |
| 6276 | + localMat: mat, | |
| 6277 | + localOpacity: 1 | |
| 6278 | + }; | |
| 6279 | + if (this.data.ao) this.finalTransform.mProp.autoOriented = true; | |
| 6280 | + if (this.data.ty !== 11) {} | |
| 6281 | + }, | |
| 6282 | + renderTransform: function renderTransform() { | |
| 6283 | + this.finalTransform._opMdf = this.finalTransform.mProp.o._mdf || this._isFirstFrame; | |
| 6284 | + this.finalTransform._matMdf = this.finalTransform.mProp._mdf || this._isFirstFrame; | |
| 6285 | + if (this.hierarchy) { | |
| 6286 | + var mat; | |
| 6287 | + var finalMat = this.finalTransform.mat; | |
| 6288 | + var i = 0; | |
| 6289 | + var len = this.hierarchy.length; | |
| 6290 | + if (!this.finalTransform._matMdf) while (i < len) { | |
| 6291 | + if (this.hierarchy[i].finalTransform.mProp._mdf) { | |
| 6292 | + this.finalTransform._matMdf = true; | |
| 6293 | + break; | |
| 6294 | + } | |
| 6295 | + i += 1; | |
| 6296 | + } | |
| 6297 | + if (this.finalTransform._matMdf) { | |
| 6298 | + mat = this.finalTransform.mProp.v.props; | |
| 6299 | + finalMat.cloneFromProps(mat); | |
| 6300 | + for (i = 0; i < len; i += 1) finalMat.multiply(this.hierarchy[i].finalTransform.mProp.v); | |
| 6301 | + } | |
| 6302 | + } | |
| 6303 | + if (!this.localTransforms || this.finalTransform._matMdf) this.finalTransform._localMatMdf = this.finalTransform._matMdf; | |
| 6304 | + if (this.finalTransform._opMdf) this.finalTransform.localOpacity = this.finalTransform.mProp.o.v; | |
| 6305 | + }, | |
| 6306 | + renderLocalTransform: function renderLocalTransform() { | |
| 6307 | + if (this.localTransforms) { | |
| 6308 | + var i = 0; | |
| 6309 | + var len = this.localTransforms.length; | |
| 6310 | + this.finalTransform._localMatMdf = this.finalTransform._matMdf; | |
| 6311 | + if (!this.finalTransform._localMatMdf || !this.finalTransform._opMdf) while (i < len) { | |
| 6312 | + if (this.localTransforms[i]._mdf) this.finalTransform._localMatMdf = true; | |
| 6313 | + if (this.localTransforms[i]._opMdf && !this.finalTransform._opMdf) { | |
| 6314 | + this.finalTransform.localOpacity = this.finalTransform.mProp.o.v; | |
| 6315 | + this.finalTransform._opMdf = true; | |
| 6316 | + } | |
| 6317 | + i += 1; | |
| 6318 | + } | |
| 6319 | + if (this.finalTransform._localMatMdf) { | |
| 6320 | + var localMat = this.finalTransform.localMat; | |
| 6321 | + this.localTransforms[0].matrix.clone(localMat); | |
| 6322 | + for (i = 1; i < len; i += 1) { | |
| 6323 | + var lmat = this.localTransforms[i].matrix; | |
| 6324 | + localMat.multiply(lmat); | |
| 6325 | + } | |
| 6326 | + localMat.multiply(this.finalTransform.mat); | |
| 6327 | + } | |
| 6328 | + if (this.finalTransform._opMdf) { | |
| 6329 | + var localOp = this.finalTransform.localOpacity; | |
| 6330 | + for (i = 0; i < len; i += 1) localOp *= this.localTransforms[i].opacity * .01; | |
| 6331 | + this.finalTransform.localOpacity = localOp; | |
| 6332 | + } | |
| 6333 | + } | |
| 6334 | + }, | |
| 6335 | + searchEffectTransforms: function searchEffectTransforms() { | |
| 6336 | + if (this.renderableEffectsManager) { | |
| 6337 | + var transformEffects = this.renderableEffectsManager.getEffects(effectTypes.TRANSFORM_EFFECT); | |
| 6338 | + if (transformEffects.length) { | |
| 6339 | + this.localTransforms = []; | |
| 6340 | + this.finalTransform.localMat = new Matrix(); | |
| 6341 | + var i = 0; | |
| 6342 | + var len = transformEffects.length; | |
| 6343 | + for (i = 0; i < len; i += 1) this.localTransforms.push(transformEffects[i]); | |
| 6344 | + } | |
| 6345 | + } | |
| 6346 | + }, | |
| 6347 | + globalToLocal: function globalToLocal(pt) { | |
| 6348 | + var transforms = []; | |
| 6349 | + transforms.push(this.finalTransform); | |
| 6350 | + var flag = true; | |
| 6351 | + var comp = this.comp; | |
| 6352 | + while (flag) if (comp.finalTransform) { | |
| 6353 | + if (comp.data.hasMask) transforms.splice(0, 0, comp.finalTransform); | |
| 6354 | + comp = comp.comp; | |
| 6355 | + } else flag = false; | |
| 6356 | + var i; | |
| 6357 | + var len = transforms.length; | |
| 6358 | + var ptNew; | |
| 6359 | + for (i = 0; i < len; i += 1) { | |
| 6360 | + ptNew = transforms[i].mat.applyToPointArray(0, 0, 0); | |
| 6361 | + pt = [ | |
| 6362 | + pt[0] - ptNew[0], | |
| 6363 | + pt[1] - ptNew[1], | |
| 6364 | + 0 | |
| 6365 | + ]; | |
| 6366 | + } | |
| 6367 | + return pt; | |
| 6368 | + }, | |
| 6369 | + mHelper: new Matrix() | |
| 6370 | + }; | |
| 6371 | + function MaskElement(data, element, globalData) { | |
| 6372 | + this.data = data; | |
| 6373 | + this.element = element; | |
| 6374 | + this.globalData = globalData; | |
| 6375 | + this.storedData = []; | |
| 6376 | + this.masksProperties = this.data.masksProperties || []; | |
| 6377 | + this.maskElement = null; | |
| 6378 | + var defs = this.globalData.defs; | |
| 6379 | + var i; | |
| 6380 | + var len = this.masksProperties ? this.masksProperties.length : 0; | |
| 6381 | + this.viewData = createSizedArray(len); | |
| 6382 | + this.solidPath = ""; | |
| 6383 | + var path; | |
| 6384 | + var properties = this.masksProperties; | |
| 6385 | + var count = 0; | |
| 6386 | + var currentMasks = []; | |
| 6387 | + var j; | |
| 6388 | + var jLen; | |
| 6389 | + var layerId = createElementID(); | |
| 6390 | + var rect; | |
| 6391 | + var expansor; | |
| 6392 | + var feMorph; | |
| 6393 | + var x; | |
| 6394 | + var maskType = "clipPath"; | |
| 6395 | + var maskRef = "clip-path"; | |
| 6396 | + for (i = 0; i < len; i += 1) { | |
| 6397 | + if (properties[i].mode !== "a" && properties[i].mode !== "n" || properties[i].inv || properties[i].o.k !== 100 || properties[i].o.x) { | |
| 6398 | + maskType = "mask"; | |
| 6399 | + maskRef = "mask"; | |
| 6400 | + } | |
| 6401 | + if ((properties[i].mode === "s" || properties[i].mode === "i") && count === 0) { | |
| 6402 | + rect = createNS("rect"); | |
| 6403 | + rect.setAttribute("fill", "#ffffff"); | |
| 6404 | + rect.setAttribute("width", this.element.comp.data.w || 0); | |
| 6405 | + rect.setAttribute("height", this.element.comp.data.h || 0); | |
| 6406 | + currentMasks.push(rect); | |
| 6407 | + } else rect = null; | |
| 6408 | + path = createNS("path"); | |
| 6409 | + if (properties[i].mode === "n") { | |
| 6410 | + this.viewData[i] = { | |
| 6411 | + op: PropertyFactory.getProp(this.element, properties[i].o, 0, .01, this.element), | |
| 6412 | + prop: ShapePropertyFactory.getShapeProp(this.element, properties[i], 3), | |
| 6413 | + elem: path, | |
| 6414 | + lastPath: "" | |
| 6415 | + }; | |
| 6416 | + defs.appendChild(path); | |
| 6417 | + } else { | |
| 6418 | + count += 1; | |
| 6419 | + path.setAttribute("fill", properties[i].mode === "s" ? "#000000" : "#ffffff"); | |
| 6420 | + path.setAttribute("clip-rule", "nonzero"); | |
| 6421 | + var filterID; | |
| 6422 | + if (properties[i].x.k !== 0) { | |
| 6423 | + maskType = "mask"; | |
| 6424 | + maskRef = "mask"; | |
| 6425 | + x = PropertyFactory.getProp(this.element, properties[i].x, 0, null, this.element); | |
| 6426 | + filterID = createElementID(); | |
| 6427 | + expansor = createNS("filter"); | |
| 6428 | + expansor.setAttribute("id", filterID); | |
| 6429 | + feMorph = createNS("feMorphology"); | |
| 6430 | + feMorph.setAttribute("operator", "erode"); | |
| 6431 | + feMorph.setAttribute("in", "SourceGraphic"); | |
| 6432 | + feMorph.setAttribute("radius", "0"); | |
| 6433 | + expansor.appendChild(feMorph); | |
| 6434 | + defs.appendChild(expansor); | |
| 6435 | + path.setAttribute("stroke", properties[i].mode === "s" ? "#000000" : "#ffffff"); | |
| 6436 | + } else { | |
| 6437 | + feMorph = null; | |
| 6438 | + x = null; | |
| 6439 | + } | |
| 6440 | + this.storedData[i] = { | |
| 6441 | + elem: path, | |
| 6442 | + x, | |
| 6443 | + expan: feMorph, | |
| 6444 | + lastPath: "", | |
| 6445 | + lastOperator: "", | |
| 6446 | + filterId: filterID, | |
| 6447 | + lastRadius: 0 | |
| 6448 | + }; | |
| 6449 | + if (properties[i].mode === "i") { | |
| 6450 | + jLen = currentMasks.length; | |
| 6451 | + var g = createNS("g"); | |
| 6452 | + for (j = 0; j < jLen; j += 1) g.appendChild(currentMasks[j]); | |
| 6453 | + var mask = createNS("mask"); | |
| 6454 | + mask.setAttribute("mask-type", "alpha"); | |
| 6455 | + mask.setAttribute("id", layerId + "_" + count); | |
| 6456 | + mask.appendChild(path); | |
| 6457 | + defs.appendChild(mask); | |
| 6458 | + g.setAttribute("mask", "url(" + getLocationHref() + "#" + layerId + "_" + count + ")"); | |
| 6459 | + currentMasks.length = 0; | |
| 6460 | + currentMasks.push(g); | |
| 6461 | + } else currentMasks.push(path); | |
| 6462 | + if (properties[i].inv && !this.solidPath) this.solidPath = this.createLayerSolidPath(); | |
| 6463 | + this.viewData[i] = { | |
| 6464 | + elem: path, | |
| 6465 | + lastPath: "", | |
| 6466 | + op: PropertyFactory.getProp(this.element, properties[i].o, 0, .01, this.element), | |
| 6467 | + prop: ShapePropertyFactory.getShapeProp(this.element, properties[i], 3), | |
| 6468 | + invRect: rect | |
| 6469 | + }; | |
| 6470 | + if (!this.viewData[i].prop.k) this.drawPath(properties[i], this.viewData[i].prop.v, this.viewData[i]); | |
| 6471 | + } | |
| 6472 | + } | |
| 6473 | + this.maskElement = createNS(maskType); | |
| 6474 | + len = currentMasks.length; | |
| 6475 | + for (i = 0; i < len; i += 1) this.maskElement.appendChild(currentMasks[i]); | |
| 6476 | + if (count > 0) { | |
| 6477 | + this.maskElement.setAttribute("id", layerId); | |
| 6478 | + this.element.maskedElement.setAttribute(maskRef, "url(" + getLocationHref() + "#" + layerId + ")"); | |
| 6479 | + defs.appendChild(this.maskElement); | |
| 6480 | + } | |
| 6481 | + if (this.viewData.length) this.element.addRenderableComponent(this); | |
| 6482 | + } | |
| 6483 | + MaskElement.prototype.getMaskProperty = function(pos) { | |
| 6484 | + return this.viewData[pos].prop; | |
| 6485 | + }; | |
| 6486 | + MaskElement.prototype.renderFrame = function(isFirstFrame) { | |
| 6487 | + var finalMat = this.element.finalTransform.mat; | |
| 6488 | + var i; | |
| 6489 | + var len = this.masksProperties.length; | |
| 6490 | + for (i = 0; i < len; i += 1) { | |
| 6491 | + if (this.viewData[i].prop._mdf || isFirstFrame) this.drawPath(this.masksProperties[i], this.viewData[i].prop.v, this.viewData[i]); | |
| 6492 | + if (this.viewData[i].op._mdf || isFirstFrame) this.viewData[i].elem.setAttribute("fill-opacity", this.viewData[i].op.v); | |
| 6493 | + if (this.masksProperties[i].mode !== "n") { | |
| 6494 | + if (this.viewData[i].invRect && (this.element.finalTransform.mProp._mdf || isFirstFrame)) this.viewData[i].invRect.setAttribute("transform", finalMat.getInverseMatrix().to2dCSS()); | |
| 6495 | + if (this.storedData[i].x && (this.storedData[i].x._mdf || isFirstFrame)) { | |
| 6496 | + var feMorph = this.storedData[i].expan; | |
| 6497 | + if (this.storedData[i].x.v < 0) { | |
| 6498 | + if (this.storedData[i].lastOperator !== "erode") { | |
| 6499 | + this.storedData[i].lastOperator = "erode"; | |
| 6500 | + this.storedData[i].elem.setAttribute("filter", "url(" + getLocationHref() + "#" + this.storedData[i].filterId + ")"); | |
| 6501 | + } | |
| 6502 | + feMorph.setAttribute("radius", -this.storedData[i].x.v); | |
| 6503 | + } else { | |
| 6504 | + if (this.storedData[i].lastOperator !== "dilate") { | |
| 6505 | + this.storedData[i].lastOperator = "dilate"; | |
| 6506 | + this.storedData[i].elem.setAttribute("filter", null); | |
| 6507 | + } | |
| 6508 | + this.storedData[i].elem.setAttribute("stroke-width", this.storedData[i].x.v * 2); | |
| 6509 | + } | |
| 6510 | + } | |
| 6511 | + } | |
| 6512 | + } | |
| 6513 | + }; | |
| 6514 | + MaskElement.prototype.getMaskelement = function() { | |
| 6515 | + return this.maskElement; | |
| 6516 | + }; | |
| 6517 | + MaskElement.prototype.createLayerSolidPath = function() { | |
| 6518 | + var path = "M0,0 "; | |
| 6519 | + path += " h" + this.globalData.compSize.w; | |
| 6520 | + path += " v" + this.globalData.compSize.h; | |
| 6521 | + path += " h-" + this.globalData.compSize.w; | |
| 6522 | + path += " v-" + this.globalData.compSize.h + " "; | |
| 6523 | + return path; | |
| 6524 | + }; | |
| 6525 | + MaskElement.prototype.drawPath = function(pathData, pathNodes, viewData) { | |
| 6526 | + var pathString = " M" + pathNodes.v[0][0] + "," + pathNodes.v[0][1]; | |
| 6527 | + var i; | |
| 6528 | + var len = pathNodes._length; | |
| 6529 | + for (i = 1; i < len; i += 1) pathString += " C" + pathNodes.o[i - 1][0] + "," + pathNodes.o[i - 1][1] + " " + pathNodes.i[i][0] + "," + pathNodes.i[i][1] + " " + pathNodes.v[i][0] + "," + pathNodes.v[i][1]; | |
| 6530 | + if (pathNodes.c && len > 1) pathString += " C" + pathNodes.o[i - 1][0] + "," + pathNodes.o[i - 1][1] + " " + pathNodes.i[0][0] + "," + pathNodes.i[0][1] + " " + pathNodes.v[0][0] + "," + pathNodes.v[0][1]; | |
| 6531 | + if (viewData.lastPath !== pathString) { | |
| 6532 | + var pathShapeValue = ""; | |
| 6533 | + if (viewData.elem) { | |
| 6534 | + if (pathNodes.c) pathShapeValue = pathData.inv ? this.solidPath + pathString : pathString; | |
| 6535 | + viewData.elem.setAttribute("d", pathShapeValue); | |
| 6536 | + } | |
| 6537 | + viewData.lastPath = pathString; | |
| 6538 | + } | |
| 6539 | + }; | |
| 6540 | + MaskElement.prototype.destroy = function() { | |
| 6541 | + this.element = null; | |
| 6542 | + this.globalData = null; | |
| 6543 | + this.maskElement = null; | |
| 6544 | + this.data = null; | |
| 6545 | + this.masksProperties = null; | |
| 6546 | + }; | |
| 6547 | + var filtersFactory = function() { | |
| 6548 | + var ob = {}; | |
| 6549 | + ob.createFilter = createFilter; | |
| 6550 | + ob.createAlphaToLuminanceFilter = createAlphaToLuminanceFilter; | |
| 6551 | + function createFilter(filId, skipCoordinates) { | |
| 6552 | + var fil = createNS("filter"); | |
| 6553 | + fil.setAttribute("id", filId); | |
| 6554 | + if (skipCoordinates !== true) { | |
| 6555 | + fil.setAttribute("filterUnits", "objectBoundingBox"); | |
| 6556 | + fil.setAttribute("x", "0%"); | |
| 6557 | + fil.setAttribute("y", "0%"); | |
| 6558 | + fil.setAttribute("width", "100%"); | |
| 6559 | + fil.setAttribute("height", "100%"); | |
| 6560 | + } | |
| 6561 | + return fil; | |
| 6562 | + } | |
| 6563 | + function createAlphaToLuminanceFilter() { | |
| 6564 | + var feColorMatrix = createNS("feColorMatrix"); | |
| 6565 | + feColorMatrix.setAttribute("type", "matrix"); | |
| 6566 | + feColorMatrix.setAttribute("color-interpolation-filters", "sRGB"); | |
| 6567 | + feColorMatrix.setAttribute("values", "0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 1"); | |
| 6568 | + return feColorMatrix; | |
| 6569 | + } | |
| 6570 | + return ob; | |
| 6571 | + }(); | |
| 6572 | + var featureSupport = function() { | |
| 6573 | + var ob = { | |
| 6574 | + maskType: true, | |
| 6575 | + svgLumaHidden: true, | |
| 6576 | + offscreenCanvas: typeof OffscreenCanvas !== "undefined" | |
| 6577 | + }; | |
| 6578 | + if (/MSIE 10/i.test(navigator.userAgent) || /MSIE 9/i.test(navigator.userAgent) || /rv:11.0/i.test(navigator.userAgent) || /Edge\/\d./i.test(navigator.userAgent)) ob.maskType = false; | |
| 6579 | + if (/firefox/i.test(navigator.userAgent)) ob.svgLumaHidden = false; | |
| 6580 | + return ob; | |
| 6581 | + }(); | |
| 6582 | + var registeredEffects$1 = {}; | |
| 6583 | + var idPrefix = "filter_result_"; | |
| 6584 | + function SVGEffects(elem) { | |
| 6585 | + var i; | |
| 6586 | + var source = "SourceGraphic"; | |
| 6587 | + var len = elem.data.ef ? elem.data.ef.length : 0; | |
| 6588 | + var filId = createElementID(); | |
| 6589 | + var fil = filtersFactory.createFilter(filId, true); | |
| 6590 | + var count = 0; | |
| 6591 | + this.filters = []; | |
| 6592 | + var filterManager; | |
| 6593 | + for (i = 0; i < len; i += 1) { | |
| 6594 | + filterManager = null; | |
| 6595 | + var type = elem.data.ef[i].ty; | |
| 6596 | + if (registeredEffects$1[type]) { | |
| 6597 | + var Effect = registeredEffects$1[type].effect; | |
| 6598 | + filterManager = new Effect(fil, elem.effectsManager.effectElements[i], elem, idPrefix + count, source); | |
| 6599 | + source = idPrefix + count; | |
| 6600 | + if (registeredEffects$1[type].countsAsEffect) count += 1; | |
| 6601 | + } | |
| 6602 | + if (filterManager) this.filters.push(filterManager); | |
| 6603 | + } | |
| 6604 | + if (count) { | |
| 6605 | + elem.globalData.defs.appendChild(fil); | |
| 6606 | + elem.layerElement.setAttribute("filter", "url(" + getLocationHref() + "#" + filId + ")"); | |
| 6607 | + } | |
| 6608 | + if (this.filters.length) elem.addRenderableComponent(this); | |
| 6609 | + } | |
| 6610 | + SVGEffects.prototype.renderFrame = function(_isFirstFrame) { | |
| 6611 | + var i; | |
| 6612 | + var len = this.filters.length; | |
| 6613 | + for (i = 0; i < len; i += 1) this.filters[i].renderFrame(_isFirstFrame); | |
| 6614 | + }; | |
| 6615 | + SVGEffects.prototype.getEffects = function(type) { | |
| 6616 | + var i; | |
| 6617 | + var len = this.filters.length; | |
| 6618 | + var effects = []; | |
| 6619 | + for (i = 0; i < len; i += 1) if (this.filters[i].type === type) effects.push(this.filters[i]); | |
| 6620 | + return effects; | |
| 6621 | + }; | |
| 6622 | + function registerEffect$1(id, effect, countsAsEffect) { | |
| 6623 | + registeredEffects$1[id] = { | |
| 6624 | + effect, | |
| 6625 | + countsAsEffect | |
| 6626 | + }; | |
| 6627 | + } | |
| 6628 | + function SVGBaseElement() {} | |
| 6629 | + SVGBaseElement.prototype = { | |
| 6630 | + initRendererElement: function initRendererElement() { | |
| 6631 | + this.layerElement = createNS("g"); | |
| 6632 | + }, | |
| 6633 | + createContainerElements: function createContainerElements() { | |
| 6634 | + this.matteElement = createNS("g"); | |
| 6635 | + this.transformedElement = this.layerElement; | |
| 6636 | + this.maskedElement = this.layerElement; | |
| 6637 | + this._sizeChanged = false; | |
| 6638 | + var layerElementParent = null; | |
| 6639 | + if (this.data.td) { | |
| 6640 | + this.matteMasks = {}; | |
| 6641 | + var gg = createNS("g"); | |
| 6642 | + gg.setAttribute("id", this.layerId); | |
| 6643 | + gg.appendChild(this.layerElement); | |
| 6644 | + layerElementParent = gg; | |
| 6645 | + this.globalData.defs.appendChild(gg); | |
| 6646 | + } else if (this.data.tt) { | |
| 6647 | + this.matteElement.appendChild(this.layerElement); | |
| 6648 | + layerElementParent = this.matteElement; | |
| 6649 | + this.baseElement = this.matteElement; | |
| 6650 | + } else this.baseElement = this.layerElement; | |
| 6651 | + if (this.data.ln) this.layerElement.setAttribute("id", this.data.ln); | |
| 6652 | + if (this.data.cl) this.layerElement.setAttribute("class", this.data.cl); | |
| 6653 | + if (this.data.ty === 0 && !this.data.hd) { | |
| 6654 | + var cp = createNS("clipPath"); | |
| 6655 | + var pt = createNS("path"); | |
| 6656 | + pt.setAttribute("d", "M0,0 L" + this.data.w + ",0 L" + this.data.w + "," + this.data.h + " L0," + this.data.h + "z"); | |
| 6657 | + var clipId = createElementID(); | |
| 6658 | + cp.setAttribute("id", clipId); | |
| 6659 | + cp.appendChild(pt); | |
| 6660 | + this.globalData.defs.appendChild(cp); | |
| 6661 | + if (this.checkMasks()) { | |
| 6662 | + var cpGroup = createNS("g"); | |
| 6663 | + cpGroup.setAttribute("clip-path", "url(" + getLocationHref() + "#" + clipId + ")"); | |
| 6664 | + cpGroup.appendChild(this.layerElement); | |
| 6665 | + this.transformedElement = cpGroup; | |
| 6666 | + if (layerElementParent) layerElementParent.appendChild(this.transformedElement); | |
| 6667 | + else this.baseElement = this.transformedElement; | |
| 6668 | + } else this.layerElement.setAttribute("clip-path", "url(" + getLocationHref() + "#" + clipId + ")"); | |
| 6669 | + } | |
| 6670 | + if (this.data.bm !== 0) this.setBlendMode(); | |
| 6671 | + }, | |
| 6672 | + renderElement: function renderElement() { | |
| 6673 | + if (this.finalTransform._localMatMdf) this.transformedElement.setAttribute("transform", this.finalTransform.localMat.to2dCSS()); | |
| 6674 | + if (this.finalTransform._opMdf) this.transformedElement.setAttribute("opacity", this.finalTransform.localOpacity); | |
| 6675 | + }, | |
| 6676 | + destroyBaseElement: function destroyBaseElement() { | |
| 6677 | + this.layerElement = null; | |
| 6678 | + this.matteElement = null; | |
| 6679 | + this.maskManager.destroy(); | |
| 6680 | + }, | |
| 6681 | + getBaseElement: function getBaseElement() { | |
| 6682 | + if (this.data.hd) return null; | |
| 6683 | + return this.baseElement; | |
| 6684 | + }, | |
| 6685 | + createRenderableComponents: function createRenderableComponents() { | |
| 6686 | + this.maskManager = new MaskElement(this.data, this, this.globalData); | |
| 6687 | + this.renderableEffectsManager = new SVGEffects(this); | |
| 6688 | + this.searchEffectTransforms(); | |
| 6689 | + }, | |
| 6690 | + getMatte: function getMatte(matteType) { | |
| 6691 | + if (!this.matteMasks) this.matteMasks = {}; | |
| 6692 | + if (!this.matteMasks[matteType]) { | |
| 6693 | + var id = this.layerId + "_" + matteType; | |
| 6694 | + var filId; | |
| 6695 | + var fil; | |
| 6696 | + var useElement; | |
| 6697 | + var gg; | |
| 6698 | + if (matteType === 1 || matteType === 3) { | |
| 6699 | + var masker = createNS("mask"); | |
| 6700 | + masker.setAttribute("id", id); | |
| 6701 | + masker.setAttribute("mask-type", matteType === 3 ? "luminance" : "alpha"); | |
| 6702 | + useElement = createNS("use"); | |
| 6703 | + useElement.setAttributeNS("http://www.w3.org/1999/xlink", "href", "#" + this.layerId); | |
| 6704 | + masker.appendChild(useElement); | |
| 6705 | + this.globalData.defs.appendChild(masker); | |
| 6706 | + if (!featureSupport.maskType && matteType === 1) { | |
| 6707 | + masker.setAttribute("mask-type", "luminance"); | |
| 6708 | + filId = createElementID(); | |
| 6709 | + fil = filtersFactory.createFilter(filId); | |
| 6710 | + this.globalData.defs.appendChild(fil); | |
| 6711 | + fil.appendChild(filtersFactory.createAlphaToLuminanceFilter()); | |
| 6712 | + gg = createNS("g"); | |
| 6713 | + gg.appendChild(useElement); | |
| 6714 | + masker.appendChild(gg); | |
| 6715 | + gg.setAttribute("filter", "url(" + getLocationHref() + "#" + filId + ")"); | |
| 6716 | + } | |
| 6717 | + } else if (matteType === 2) { | |
| 6718 | + var maskGroup = createNS("mask"); | |
| 6719 | + maskGroup.setAttribute("id", id); | |
| 6720 | + maskGroup.setAttribute("mask-type", "alpha"); | |
| 6721 | + var maskGrouper = createNS("g"); | |
| 6722 | + maskGroup.appendChild(maskGrouper); | |
| 6723 | + filId = createElementID(); | |
| 6724 | + fil = filtersFactory.createFilter(filId); | |
| 6725 | + var feCTr = createNS("feComponentTransfer"); | |
| 6726 | + feCTr.setAttribute("in", "SourceGraphic"); | |
| 6727 | + fil.appendChild(feCTr); | |
| 6728 | + var feFunc = createNS("feFuncA"); | |
| 6729 | + feFunc.setAttribute("type", "table"); | |
| 6730 | + feFunc.setAttribute("tableValues", "1.0 0.0"); | |
| 6731 | + feCTr.appendChild(feFunc); | |
| 6732 | + this.globalData.defs.appendChild(fil); | |
| 6733 | + var alphaRect = createNS("rect"); | |
| 6734 | + alphaRect.setAttribute("width", this.comp.data.w); | |
| 6735 | + alphaRect.setAttribute("height", this.comp.data.h); | |
| 6736 | + alphaRect.setAttribute("x", "0"); | |
| 6737 | + alphaRect.setAttribute("y", "0"); | |
| 6738 | + alphaRect.setAttribute("fill", "#ffffff"); | |
| 6739 | + alphaRect.setAttribute("opacity", "0"); | |
| 6740 | + maskGrouper.setAttribute("filter", "url(" + getLocationHref() + "#" + filId + ")"); | |
| 6741 | + maskGrouper.appendChild(alphaRect); | |
| 6742 | + useElement = createNS("use"); | |
| 6743 | + useElement.setAttributeNS("http://www.w3.org/1999/xlink", "href", "#" + this.layerId); | |
| 6744 | + maskGrouper.appendChild(useElement); | |
| 6745 | + if (!featureSupport.maskType) { | |
| 6746 | + maskGroup.setAttribute("mask-type", "luminance"); | |
| 6747 | + fil.appendChild(filtersFactory.createAlphaToLuminanceFilter()); | |
| 6748 | + gg = createNS("g"); | |
| 6749 | + maskGrouper.appendChild(alphaRect); | |
| 6750 | + gg.appendChild(this.layerElement); | |
| 6751 | + maskGrouper.appendChild(gg); | |
| 6752 | + } | |
| 6753 | + this.globalData.defs.appendChild(maskGroup); | |
| 6754 | + } | |
| 6755 | + this.matteMasks[matteType] = id; | |
| 6756 | + } | |
| 6757 | + return this.matteMasks[matteType]; | |
| 6758 | + }, | |
| 6759 | + setMatte: function setMatte(id) { | |
| 6760 | + if (!this.matteElement) return; | |
| 6761 | + this.matteElement.setAttribute("mask", "url(" + getLocationHref() + "#" + id + ")"); | |
| 6762 | + } | |
| 6763 | + }; | |
| 6764 | + /** | |
| 6765 | + * @file | |
| 6766 | + * Handles AE's layer parenting property. | |
| 6767 | + * | |
| 6768 | + */ | |
| 6769 | + function HierarchyElement() {} | |
| 6770 | + HierarchyElement.prototype = { | |
| 6771 | + /** | |
| 6772 | + * @function | |
| 6773 | + * Initializes hierarchy properties | |
| 6774 | + * | |
| 6775 | + */ | |
| 6776 | + initHierarchy: function initHierarchy() { | |
| 6777 | + this.hierarchy = []; | |
| 6778 | + this._isParent = false; | |
| 6779 | + this.checkParenting(); | |
| 6780 | + }, | |
| 6781 | + /** | |
| 6782 | + * @function | |
| 6783 | + * Sets layer's hierarchy. | |
| 6784 | + * @param {array} hierarch | |
| 6785 | + * layer's parent list | |
| 6786 | + * | |
| 6787 | + */ | |
| 6788 | + setHierarchy: function setHierarchy(hierarchy) { | |
| 6789 | + this.hierarchy = hierarchy; | |
| 6790 | + }, | |
| 6791 | + /** | |
| 6792 | + * @function | |
| 6793 | + * Sets layer as parent. | |
| 6794 | + * | |
| 6795 | + */ | |
| 6796 | + setAsParent: function setAsParent() { | |
| 6797 | + this._isParent = true; | |
| 6798 | + }, | |
| 6799 | + /** | |
| 6800 | + * @function | |
| 6801 | + * Searches layer's parenting chain | |
| 6802 | + * | |
| 6803 | + */ | |
| 6804 | + checkParenting: function checkParenting() { | |
| 6805 | + if (this.data.parent !== void 0) this.comp.buildElementParenting(this, this.data.parent, []); | |
| 6806 | + } | |
| 6807 | + }; | |
| 6808 | + function RenderableDOMElement() {} | |
| 6809 | + (function() { | |
| 6810 | + extendPrototype([RenderableElement, createProxyFunction({ | |
| 6811 | + initElement: function initElement(data, globalData, comp) { | |
| 6812 | + this.initFrame(); | |
| 6813 | + this.initBaseData(data, globalData, comp); | |
| 6814 | + this.initTransform(data, globalData, comp); | |
| 6815 | + this.initHierarchy(); | |
| 6816 | + this.initRenderable(); | |
| 6817 | + this.initRendererElement(); | |
| 6818 | + this.createContainerElements(); | |
| 6819 | + this.createRenderableComponents(); | |
| 6820 | + this.createContent(); | |
| 6821 | + this.hide(); | |
| 6822 | + }, | |
| 6823 | + hide: function hide() { | |
| 6824 | + if (!this.hidden && (!this.isInRange || this.isTransparent)) { | |
| 6825 | + var elem = this.baseElement || this.layerElement; | |
| 6826 | + elem.style.display = "none"; | |
| 6827 | + this.hidden = true; | |
| 6828 | + } | |
| 6829 | + }, | |
| 6830 | + show: function show() { | |
| 6831 | + if (this.isInRange && !this.isTransparent) { | |
| 6832 | + if (!this.data.hd) { | |
| 6833 | + var elem = this.baseElement || this.layerElement; | |
| 6834 | + elem.style.display = "block"; | |
| 6835 | + } | |
| 6836 | + this.hidden = false; | |
| 6837 | + this._isFirstFrame = true; | |
| 6838 | + } | |
| 6839 | + }, | |
| 6840 | + renderFrame: function renderFrame() { | |
| 6841 | + if (this.data.hd || this.hidden) return; | |
| 6842 | + this.renderTransform(); | |
| 6843 | + this.renderRenderable(); | |
| 6844 | + this.renderLocalTransform(); | |
| 6845 | + this.renderElement(); | |
| 6846 | + this.renderInnerContent(); | |
| 6847 | + if (this._isFirstFrame) this._isFirstFrame = false; | |
| 6848 | + }, | |
| 6849 | + renderInnerContent: function renderInnerContent() {}, | |
| 6850 | + prepareFrame: function prepareFrame(num) { | |
| 6851 | + this._mdf = false; | |
| 6852 | + this.prepareRenderableFrame(num); | |
| 6853 | + this.prepareProperties(num, this.isInRange); | |
| 6854 | + this.checkTransparency(); | |
| 6855 | + }, | |
| 6856 | + destroy: function destroy() { | |
| 6857 | + this.innerElem = null; | |
| 6858 | + this.destroyBaseElement(); | |
| 6859 | + } | |
| 6860 | + })], RenderableDOMElement); | |
| 6861 | + })(); | |
| 6862 | + function IImageElement(data, globalData, comp) { | |
| 6863 | + this.assetData = globalData.getAssetData(data.refId); | |
| 6864 | + if (this.assetData && this.assetData.sid) this.assetData = globalData.slotManager.getProp(this.assetData); | |
| 6865 | + this.initElement(data, globalData, comp); | |
| 6866 | + this.sourceRect = { | |
| 6867 | + top: 0, | |
| 6868 | + left: 0, | |
| 6869 | + width: this.assetData.w, | |
| 6870 | + height: this.assetData.h | |
| 6871 | + }; | |
| 6872 | + } | |
| 6873 | + extendPrototype([ | |
| 6874 | + BaseElement, | |
| 6875 | + TransformElement, | |
| 6876 | + SVGBaseElement, | |
| 6877 | + HierarchyElement, | |
| 6878 | + FrameElement, | |
| 6879 | + RenderableDOMElement | |
| 6880 | + ], IImageElement); | |
| 6881 | + IImageElement.prototype.createContent = function() { | |
| 6882 | + var assetPath = this.globalData.getAssetsPath(this.assetData); | |
| 6883 | + this.innerElem = createNS("image"); | |
| 6884 | + this.innerElem.setAttribute("width", this.assetData.w + "px"); | |
| 6885 | + this.innerElem.setAttribute("height", this.assetData.h + "px"); | |
| 6886 | + this.innerElem.setAttribute("preserveAspectRatio", this.assetData.pr || this.globalData.renderConfig.imagePreserveAspectRatio); | |
| 6887 | + this.innerElem.setAttributeNS("http://www.w3.org/1999/xlink", "href", assetPath); | |
| 6888 | + this.layerElement.appendChild(this.innerElem); | |
| 6889 | + }; | |
| 6890 | + IImageElement.prototype.sourceRectAtTime = function() { | |
| 6891 | + return this.sourceRect; | |
| 6892 | + }; | |
| 6893 | + function ProcessedElement(element, position) { | |
| 6894 | + this.elem = element; | |
| 6895 | + this.pos = position; | |
| 6896 | + } | |
| 6897 | + function IShapeElement() {} | |
| 6898 | + IShapeElement.prototype = { | |
| 6899 | + addShapeToModifiers: function addShapeToModifiers(data) { | |
| 6900 | + var i; | |
| 6901 | + var len = this.shapeModifiers.length; | |
| 6902 | + for (i = 0; i < len; i += 1) this.shapeModifiers[i].addShape(data); | |
| 6903 | + }, | |
| 6904 | + isShapeInAnimatedModifiers: function isShapeInAnimatedModifiers(data) { | |
| 6905 | + var i = 0; | |
| 6906 | + var len = this.shapeModifiers.length; | |
| 6907 | + while (i < len) if (this.shapeModifiers[i].isAnimatedWithShape(data)) return true; | |
| 6908 | + return false; | |
| 6909 | + }, | |
| 6910 | + renderModifiers: function renderModifiers() { | |
| 6911 | + if (!this.shapeModifiers.length) return; | |
| 6912 | + var i; | |
| 6913 | + var len = this.shapes.length; | |
| 6914 | + for (i = 0; i < len; i += 1) this.shapes[i].sh.reset(); | |
| 6915 | + len = this.shapeModifiers.length; | |
| 6916 | + var shouldBreakProcess; | |
| 6917 | + for (i = len - 1; i >= 0; i -= 1) { | |
| 6918 | + shouldBreakProcess = this.shapeModifiers[i].processShapes(this._isFirstFrame); | |
| 6919 | + if (shouldBreakProcess) break; | |
| 6920 | + } | |
| 6921 | + }, | |
| 6922 | + searchProcessedElement: function searchProcessedElement(elem) { | |
| 6923 | + var elements = this.processedElements; | |
| 6924 | + var i = 0; | |
| 6925 | + var len = elements.length; | |
| 6926 | + while (i < len) { | |
| 6927 | + if (elements[i].elem === elem) return elements[i].pos; | |
| 6928 | + i += 1; | |
| 6929 | + } | |
| 6930 | + return 0; | |
| 6931 | + }, | |
| 6932 | + addProcessedElement: function addProcessedElement(elem, pos) { | |
| 6933 | + var elements = this.processedElements; | |
| 6934 | + var i = elements.length; | |
| 6935 | + while (i) { | |
| 6936 | + i -= 1; | |
| 6937 | + if (elements[i].elem === elem) { | |
| 6938 | + elements[i].pos = pos; | |
| 6939 | + return; | |
| 6940 | + } | |
| 6941 | + } | |
| 6942 | + elements.push(new ProcessedElement(elem, pos)); | |
| 6943 | + }, | |
| 6944 | + prepareFrame: function prepareFrame(num) { | |
| 6945 | + this.prepareRenderableFrame(num); | |
| 6946 | + this.prepareProperties(num, this.isInRange); | |
| 6947 | + } | |
| 6948 | + }; | |
| 6949 | + var lineCapEnum = { | |
| 6950 | + 1: "butt", | |
| 6951 | + 2: "round", | |
| 6952 | + 3: "square" | |
| 6953 | + }; | |
| 6954 | + var lineJoinEnum = { | |
| 6955 | + 1: "miter", | |
| 6956 | + 2: "round", | |
| 6957 | + 3: "bevel" | |
| 6958 | + }; | |
| 6959 | + function SVGShapeData(transformers, level, shape) { | |
| 6960 | + this.caches = []; | |
| 6961 | + this.styles = []; | |
| 6962 | + this.transformers = transformers; | |
| 6963 | + this.lStr = ""; | |
| 6964 | + this.sh = shape; | |
| 6965 | + this.lvl = level; | |
| 6966 | + this._isAnimated = !!shape.k; | |
| 6967 | + var i = 0; | |
| 6968 | + var len = transformers.length; | |
| 6969 | + while (i < len) { | |
| 6970 | + if (transformers[i].mProps.dynamicProperties.length) { | |
| 6971 | + this._isAnimated = true; | |
| 6972 | + break; | |
| 6973 | + } | |
| 6974 | + i += 1; | |
| 6975 | + } | |
| 6976 | + } | |
| 6977 | + SVGShapeData.prototype.setAsAnimated = function() { | |
| 6978 | + this._isAnimated = true; | |
| 6979 | + }; | |
| 6980 | + function SVGStyleData(data, level) { | |
| 6981 | + this.data = data; | |
| 6982 | + this.type = data.ty; | |
| 6983 | + this.d = ""; | |
| 6984 | + this.lvl = level; | |
| 6985 | + this._mdf = false; | |
| 6986 | + this.closed = data.hd === true; | |
| 6987 | + this.pElem = createNS("path"); | |
| 6988 | + this.msElem = null; | |
| 6989 | + } | |
| 6990 | + SVGStyleData.prototype.reset = function() { | |
| 6991 | + this.d = ""; | |
| 6992 | + this._mdf = false; | |
| 6993 | + }; | |
| 6994 | + function DashProperty(elem, data, renderer, container) { | |
| 6995 | + this.elem = elem; | |
| 6996 | + this.frameId = -1; | |
| 6997 | + this.dataProps = createSizedArray(data.length); | |
| 6998 | + this.renderer = renderer; | |
| 6999 | + this.k = false; | |
| 7000 | + this.dashStr = ""; | |
| 7001 | + this.dashArray = createTypedArray("float32", data.length ? data.length - 1 : 0); | |
| 7002 | + this.dashoffset = createTypedArray("float32", 1); | |
| 7003 | + this.initDynamicPropertyContainer(container); | |
| 7004 | + var i; | |
| 7005 | + var len = data.length || 0; | |
| 7006 | + var prop; | |
| 7007 | + for (i = 0; i < len; i += 1) { | |
| 7008 | + prop = PropertyFactory.getProp(elem, data[i].v, 0, 0, this); | |
| 7009 | + this.k = prop.k || this.k; | |
| 7010 | + this.dataProps[i] = { | |
| 7011 | + n: data[i].n, | |
| 7012 | + p: prop | |
| 7013 | + }; | |
| 7014 | + } | |
| 7015 | + if (!this.k) this.getValue(true); | |
| 7016 | + this._isAnimated = this.k; | |
| 7017 | + } | |
| 7018 | + DashProperty.prototype.getValue = function(forceRender) { | |
| 7019 | + if (this.elem.globalData.frameId === this.frameId && !forceRender) return; | |
| 7020 | + this.frameId = this.elem.globalData.frameId; | |
| 7021 | + this.iterateDynamicProperties(); | |
| 7022 | + this._mdf = this._mdf || forceRender; | |
| 7023 | + if (this._mdf) { | |
| 7024 | + var i = 0; | |
| 7025 | + var len = this.dataProps.length; | |
| 7026 | + if (this.renderer === "svg") this.dashStr = ""; | |
| 7027 | + for (i = 0; i < len; i += 1) if (this.dataProps[i].n !== "o") if (this.renderer === "svg") this.dashStr += " " + this.dataProps[i].p.v; | |
| 7028 | + else this.dashArray[i] = this.dataProps[i].p.v; | |
| 7029 | + else this.dashoffset[0] = this.dataProps[i].p.v; | |
| 7030 | + } | |
| 7031 | + }; | |
| 7032 | + extendPrototype([DynamicPropertyContainer], DashProperty); | |
| 7033 | + function SVGStrokeStyleData(elem, data, styleOb) { | |
| 7034 | + this.initDynamicPropertyContainer(elem); | |
| 7035 | + this.getValue = this.iterateDynamicProperties; | |
| 7036 | + this.o = PropertyFactory.getProp(elem, data.o, 0, .01, this); | |
| 7037 | + this.w = PropertyFactory.getProp(elem, data.w, 0, null, this); | |
| 7038 | + this.d = new DashProperty(elem, data.d || {}, "svg", this); | |
| 7039 | + this.c = PropertyFactory.getProp(elem, data.c, 1, 255, this); | |
| 7040 | + this.style = styleOb; | |
| 7041 | + this._isAnimated = !!this._isAnimated; | |
| 7042 | + } | |
| 7043 | + extendPrototype([DynamicPropertyContainer], SVGStrokeStyleData); | |
| 7044 | + function SVGFillStyleData(elem, data, styleOb) { | |
| 7045 | + this.initDynamicPropertyContainer(elem); | |
| 7046 | + this.getValue = this.iterateDynamicProperties; | |
| 7047 | + this.o = PropertyFactory.getProp(elem, data.o, 0, .01, this); | |
| 7048 | + this.c = PropertyFactory.getProp(elem, data.c, 1, 255, this); | |
| 7049 | + this.style = styleOb; | |
| 7050 | + } | |
| 7051 | + extendPrototype([DynamicPropertyContainer], SVGFillStyleData); | |
| 7052 | + function SVGNoStyleData(elem, data, styleOb) { | |
| 7053 | + this.initDynamicPropertyContainer(elem); | |
| 7054 | + this.getValue = this.iterateDynamicProperties; | |
| 7055 | + this.style = styleOb; | |
| 7056 | + } | |
| 7057 | + extendPrototype([DynamicPropertyContainer], SVGNoStyleData); | |
| 7058 | + function GradientProperty(elem, data, container) { | |
| 7059 | + this.data = data; | |
| 7060 | + this.c = createTypedArray("uint8c", data.p * 4); | |
| 7061 | + var cLength = data.k.k[0].s ? data.k.k[0].s.length - data.p * 4 : data.k.k.length - data.p * 4; | |
| 7062 | + this.o = createTypedArray("float32", cLength); | |
| 7063 | + this._cmdf = false; | |
| 7064 | + this._omdf = false; | |
| 7065 | + this._collapsable = this.checkCollapsable(); | |
| 7066 | + this._hasOpacity = cLength; | |
| 7067 | + this.initDynamicPropertyContainer(container); | |
| 7068 | + this.prop = PropertyFactory.getProp(elem, data.k, 1, null, this); | |
| 7069 | + this.k = this.prop.k; | |
| 7070 | + this.getValue(true); | |