\s*$/g;
function Le(e, t) {
return N(e, "table") && N(11 !== t.nodeType ? t : t.firstChild, "tr") ? w(e).children("tbody")[0] || e : e
}
function He(e) {
return e.type = (null !== e.getAttribute("type")) + "/" + e.type, e
}
function Oe(e) {
return "true/" === (e.type || "").slice(0, 5) ? e.type = e.type.slice(5) : e.removeAttribute("type"), e
}
function Pe(e, t) {
var n, r, i, o, a, s, u, l;
if (1 === t.nodeType) {
if (J.hasData(e) && (o = J.access(e), a = J.set(t, o), l = o.events)) {
delete a.handle, a.events = {};
for (i in l)
for (n = 0, r = l[i].length; n < r; n++) w.event.add(t, i, l[i][n]) } K.hasData(e) && (s = K.access(e), u = w.extend({}, s), K.set(t, u)) } } function Me(e, t) { var n = t.nodeName.toLowerCase(); "input" === n && pe.test(e.type) ? t.checked = e.checked : "input" !== n && "textarea" !== n || (t.defaultValue = e.defaultValue) } function Re(e, t, n, r) { t = a.apply([], t); var i, o, s, u, l, c, f = 0, p = e.length, d = p - 1, y = t[0], v = g(y); if (v || p> 1 && "string" == typeof y && !h.checkClone && je.test(y)) return e.each(function (i) {
var o = e.eq(i);
v && (t[0] = y.call(this, i, o.html())), Re(o, t, n, r)
});
if (p && (i = xe(t, e[0].ownerDocument, !1, e, r), o = i.firstChild, 1 === i.childNodes.length && (i = o), o || r)) {
for (u = (s = w.map(ye(i, "script"), He)).length; f < p; f++) l = i, f !== d && (l = w.clone(l, !0, !0), u && w.merge(s, ye(l, "script"))), n.call(e[f], l, f); if (u) for (c = s[s.length - 1].ownerDocument, w.map(s, Oe), f = 0; f < u; f++) l = s[f], he.test(l.type || "") && !J.access(l, "globalEval") && w.contains(c, l) && (l.src && "module" !== (l.type || "").toLowerCase() ? w._evalUrl && w._evalUrl(l.src) : m(l.textContent.replace(qe, ""), c, l)) } return e } function Ie(e, t, n) { for (var r, i = t ? w.filter(t, e) : e, o = 0; null != (r = i[o]); o++) n || 1 !== r.nodeType || w.cleanData(ye(r)), r.parentNode && (n && w.contains(r.ownerDocument, r) && ve(ye(r, "script")), r.parentNode.removeChild(r)); return e } w.extend({ htmlPrefilter: function (e) { return e.replace(Ne, "<1ドル>")
},
clone: function (e, t, n) {
var r, i, o, a, s = e.cloneNode(!0),
u = w.contains(e.ownerDocument, e);
if (!(h.noCloneChecked || 1 !== e.nodeType && 11 !== e.nodeType || w.isXMLDoc(e)))
for (a = ye(s), r = 0, i = (o = ye(e)).length; r < i; r++) Me(o[r], a[r]); if (t) if (n) for (o = o || ye(e), a = a || ye(s), r = 0, i = o.length; r < i; r++) Pe(o[r], a[r]); else Pe(e, s); return (a = ye(s, "script")).length> 0 && ve(a, !u && ye(e, "script")), s
},
cleanData: function (e) {
for (var t, n, r, i = w.event.special, o = 0; void 0 !== (n = e[o]); o++)
if (Y(n)) {
if (t = n[J.expando]) {
if (t.events)
for (r in t.events) i[r] ? w.event.remove(n, r) : w.removeEvent(n, r, t.handle);
n[J.expando] = void 0
}
n[K.expando] && (n[K.expando] = void 0)
}
}
}), w.fn.extend({
detach: function (e) {
return Ie(this, e, !0)
},
remove: function (e) {
return Ie(this, e)
},
text: function (e) {
return z(this, function (e) {
return void 0 === e ? w.text(this) : this.empty().each(function () {
1 !== this.nodeType && 11 !== this.nodeType && 9 !== this.nodeType || (this.textContent = e)
})
}, null, e, arguments.length)
},
append: function () {
return Re(this, arguments, function (e) {
1 !== this.nodeType && 11 !== this.nodeType && 9 !== this.nodeType || Le(this, e).appendChild(e)
})
},
prepend: function () {
return Re(this, arguments, function (e) {
if (1 === this.nodeType || 11 === this.nodeType || 9 === this.nodeType) {
var t = Le(this, e);
t.insertBefore(e, t.firstChild)
}
})
},
before: function () {
return Re(this, arguments, function (e) {
this.parentNode && this.parentNode.insertBefore(e, this)
})
},
after: function () {
return Re(this, arguments, function (e) {
this.parentNode && this.parentNode.insertBefore(e, this.nextSibling)
})
},
empty: function () {
for (var e, t = 0; null != (e = this[t]); t++) 1 === e.nodeType && (w.cleanData(ye(e, !1)), e.textContent = "");
return this
},
clone: function (e, t) {
return e = null != e && e, t = null == t ? e : t, this.map(function () {
return w.clone(this, e, t)
})
},
html: function (e) {
return z(this, function (e) {
var t = this[0] || {},
n = 0,
r = this.length;
if (void 0 === e && 1 === t.nodeType) return t.innerHTML;
if ("string" == typeof e && !Ae.test(e) && !ge[(de.exec(e) || ["", ""])[1].toLowerCase()]) {
e = w.htmlPrefilter(e);
try {
for (; n < r; n++) 1 === (t = this[n] || {}).nodeType && (w.cleanData(ye(t, !1)), t.innerHTML = e); t = 0 } catch (e) {} } t && this.empty().append(e) }, null, e, arguments.length) }, replaceWith: function () { var e = []; return Re(this, arguments, function (t) { var n = this.parentNode; w.inArray(this, e) < 0 && (w.cleanData(ye(this)), n && n.replaceChild(t, this)) }, e) } }), w.each({ appendTo: "append", prependTo: "prepend", insertBefore: "before", insertAfter: "after", replaceAll: "replaceWith" }, function (e, t) { w.fn[e] = function (e) { for (var n, r = [], i = w(e), o = i.length - 1, a = 0; a <= o; a++) n = a === o ? this : this.clone(!0), w(i[a])[t](n), s.apply(r, n.get()); return this.pushStack(r) } }); var We = new RegExp("^(" + re + ")(?!px)[a-z%]+$", "i"), $e = function (t) { var n = t.ownerDocument.defaultView; return n && n.opener || (n = e), n.getComputedStyle(t) }, Be = new RegExp(oe.join("|"), "i"); ! function () { function t() { if (c) { l.style.cssText = "position:absolute;left:-11111px;width:60px;margin-top:1px;padding:0;border:0", c.style.cssText = "position:relative;display:block;box-sizing:border-box;overflow:scroll;margin:auto;border:1px;padding:1px;width:60%;top:1%", be.appendChild(l).appendChild(c); var t = e.getComputedStyle(c); i = "1%" !== t.top, u = 12 === n(t.marginLeft), c.style.right = "60%", s = 36 === n(t.right), o = 36 === n(t.width), c.style.position = "absolute", a = 36 === c.offsetWidth || "absolute", be.removeChild(l), c = null } } function n(e) { return Math.round(parseFloat(e)) } var i, o, a, s, u, l = r.createElement("div"), c = r.createElement("div"); c.style && (c.style.backgroundClip = "content-box", c.cloneNode(!0).style.backgroundClip = "", h.clearCloneStyle = "content-box" === c.style.backgroundClip, w.extend(h, { boxSizingReliable: function () { return t(), o }, pixelBoxStyles: function () { return t(), s }, pixelPosition: function () { return t(), i }, reliableMarginLeft: function () { return t(), u }, scrollboxSize: function () { return t(), a } })) }(); function Fe(e, t, n) { var r, i, o, a, s = e.style; return (n = n || $e(e)) && ("" !== (a = n.getPropertyValue(t) || n[t]) || w.contains(e.ownerDocument, e) || (a = w.style(e, t)), !h.pixelBoxStyles() && We.test(a) && Be.test(t) && (r = s.width, i = s.minWidth, o = s.maxWidth, s.minWidth = s.maxWidth = s.width = a, a = n.width, s.width = r, s.minWidth = i, s.maxWidth = o)), void 0 !== a ? a + "" : a } function _e(e, t) { return { get: function () { if (!e()) return (this.get = t).apply(this, arguments); delete this.get } } } var ze = /^(none|table(?!-c[ea]).+)/, Xe = /^--/, Ue = { position: "absolute", visibility: "hidden", display: "block" }, Ve = { letterSpacing: "0", fontWeight: "400" }, Ge = ["Webkit", "Moz", "ms"], Ye = r.createElement("div").style; function Qe(e) { if (e in Ye) return e; var t = e[0].toUpperCase() + e.slice(1), n = Ge.length; while (n--) if ((e = Ge[n] + t) in Ye) return e } function Je(e) { var t = w.cssProps[e]; return t || (t = w.cssProps[e] = Qe(e) || e), t } function Ke(e, t, n) { var r = ie.exec(t); return r ? Math.max(0, r[2] - (n || 0)) + (r[3] || "px") : t } function Ze(e, t, n, r, i, o) { var a = "border" : "content")) return 0; for (; a < 4; a += 2) "margin" === n && (u += w.css(e, n + oe[a], !0, i)), r ? ("content" === n && (u -= w.css(e, "padding" + oe[a], !0, i)), "margin" !== n && (u -= w.css(e, "border" + oe[a] + "padding" + oe[a], !0, i), "padding" !== n ? u += w.css(e, "border" + oe[a] + "Width", !0, i) : s += w.css(e, "border" + oe[a] + "Width", !0, i)); return !r && o>= 0 && (u += Math.max(0, Math.ceil(e["offset" + t[0].toUpperCase() + t.slice(1)] - o - u - s - .5))), u
}
function et(e, t, n) {
var r = $e(e),
i = Fe(e, t, r),
o = "border-box" === w.css(e, "boxSizing", !1, r),
a = o;
if (We.test(i)) {
if (!n) return i;
i = "auto"
}
return a = a && (h.boxSizingReliable() || i === e.style[t]), ("auto" === i || !parseFloat(i) && "inline" === w.css(e, "display", !1, r)) && (i = e["offset" + t[0].toUpperCase() + t.slice(1)], a = !0), (i = parseFloat(i) || 0) + Ze(e, t, n || (o ? "border" : "content"), a, r, i) + "px"
}
w.extend({
cssHooks: {
opacity: {
get: function (e, t) {
if (t) {
var n = Fe(e, "opacity");
return "" === n ? "1" : n
}
}
}
},
cssNumber: {
animationIterationCount: !0,
columnCount: !0,
fillOpacity: !0,
flexGrow: !0,
flexShrink: !0,
fontWeight: !0,
lineHeight: !0,
opacity: !0,
order: !0,
orphans: !0,
widows: !0,
zIndex: !0,
zoom: !0
},
cssProps: {},
style: function (e, t, n, r) {
if (e && 3 !== e.nodeType && 8 !== e.nodeType && e.style) {
var i, o, a, s = G(t),
u = Xe.test(t),
l = e.style;
if (u || (t = Je(s)), a = w.cssHooks[t] || w.cssHooks[s], void 0 === n) return a && "get" in a && void 0 !== (i = a.get(e, !1, r)) ? i : l[t];
"string" == (o = typeof n) && (i = ie.exec(n)) && i[1] && (n = ue(e, t, i), o = "number"), null != n && n === n && ("number" === o && (n += i && i[3] || (w.cssNumber[s] ? "" : "px")), h.clearCloneStyle || "" !== n || 0 !== t.indexOf("background") || (l[t] = "inherit"), a && "set" in a && void 0 === (n = a.set(e, n, r)) || (u ? l.setProperty(t, n) : l[t] = n))
}
},
css: function (e, t, n, r) {
var i, o, a, s = G(t);
return Xe.test(t) || (t = Je(s)), (a = w.cssHooks[t] || w.cssHooks[s]) && "get" in a && (i = a.get(e, !0, n)), void 0 === i && (i = Fe(e, t, r)), "normal" === i && t in Ve && (i = Ve[t]), "" === n || n ? (o = parseFloat(i), !0 === n || isFinite(o) ? o || 0 : i) : i
}
}), w.each(["height", "width"], function (e, t) {
w.cssHooks[t] = {
get: function (e, n, r) {
if (n) return !ze.test(w.css(e, "display")) || e.getClientRects().length && e.getBoundingClientRect().width ? et(e, t, r) : se(e, Ue, function () {
return et(e, t, r)
})
},
set: function (e, n, r) {
var i, o = $e(e),
a = "border-box" === w.css(e, "boxSizing", !1, o),
s = r && Ze(e, t, r, a, o);
return a && h.scrollboxSize() === o.position && (s -= Math.ceil(e["offset" + t[0].toUpperCase() + t.slice(1)] - parseFloat(o[t]) - Ze(e, t, "border", !1, o) - .5)), s && (i = ie.exec(n)) && "px" !== (i[3] || "px") && (e.style[t] = n, n = w.css(e, t)), Ke(e, n, s)
}
}
}), w.cssHooks.marginLeft = _e(h.reliableMarginLeft, function (e, t) {
if (t) return (parseFloat(Fe(e, "marginLeft")) || e.getBoundingClientRect().left - se(e, {
marginLeft: 0
}, function () {
return e.getBoundingClientRect().left
})) + "px"
}), w.each({
margin: "",
padding: "",
border: "Width"
}, function (e, t) {
w.cssHooks[e + t] = {
expand: function (n) {
for (var r = 0, i = {}, o = "string" == typeof n ? n.split(" ") : [n]; r < 4; r++) i[e + oe[r] + t] = o[r] || o[r - 2] || o[0]; return i } }, "margin" !== e && (w.cssHooks[e + t].set = Ke) }), w.fn.extend({ css: function (e, t) { return z(this, function (e, t, n) { var r, i, o = {}, a = 0; if (Array.isArray(t)) { for (r = $e(e), i = t.length; a < i; a++) o[t[a]] = w.css(e, t[a], !1, r); return o } return void 0 !== n ? w.style(e, t, n) : w.css(e, t) }, e, t, arguments.length> 1)
}
});
function tt(e, t, n, r, i) {
return new tt.prototype.init(e, t, n, r, i)
}
w.Tween = tt, tt.prototype = {
constructor: tt,
init: function (e, t, n, r, i, o) {
this.elem = e, this.prop = n, this.easing = i || w.easing._default, this.options = t, this.start = this.now = this.cur(), this.end = r, this.unit = o || (w.cssNumber[n] ? "" : "px")
},
cur: function () {
var e = tt.propHooks[this.prop];
return e && e.get ? e.get(this) : tt.propHooks._default.get(this)
},
run: function (e) {
var t, n = tt.propHooks[this.prop];
return this.options.duration ? this.pos = t = w.easing[this.easing](e, this.options.duration * e, 0, 1, this.options.duration) : this.pos = t = e, this.now = (this.end - this.start) * t + this.start, this.options.step && this.options.step.call(this.elem, this.now, this), n && n.set ? n.set(this) : tt.propHooks._default.set(this), this
}
}, tt.prototype.init.prototype = tt.prototype, tt.propHooks = {
_default: {
get: function (e) {
var t;
return 1 !== e.elem.nodeType || null != e.elem[e.prop] && null == e.elem.style[e.prop] ? e.elem[e.prop] : (t = w.css(e.elem, e.prop, "")) && "auto" !== t ? t : 0
},
set: function (e) {
w.fx.step[e.prop] ? w.fx.step[e.prop](e) : 1 !== e.elem.nodeType || null == e.elem.style[w.cssProps[e.prop]] && !w.cssHooks[e.prop] ? e.elem[e.prop] = e.now : w.style(e.elem, e.prop, e.now + e.unit)
}
}
}, tt.propHooks.scrollTop = tt.propHooks.scrollLeft = {
set: function (e) {
e.elem.nodeType && e.elem.parentNode && (e.elem[e.prop] = e.now)
}
}, w.easing = {
linear: function (e) {
return e
},
swing: function (e) {
return .5 - Math.cos(e * Math.PI) / 2
},
_default: "swing"
}, w.fx = tt.prototype.init, w.fx.step = {};
var nt, rt, it = /^(?:toggle|show|hide)$/,
ot = /queueHooks$/;
function at() {
rt && (!1 === r.hidden && e.requestAnimationFrame ? e.requestAnimationFrame(at) : e.setTimeout(at, w.fx.interval), w.fx.tick())
}
function st() {
return e.setTimeout(function () {
nt = void 0
}), nt = Date.now()
}
function ut(e, t) {
var n, r = 0,
i = {
height: e
};
for (t = t ? 1 : 0; r < 4; r += 2 - t) i["margin" + (n = oe[r])] = i["padding" + n] = e; return t && (i.opacity = i.width = e), i } function lt(e, t, n) { for (var r, i = (pt.tweeners[t] || []).concat(pt.tweeners["*"]), o = 0, a = i.length; o < a; o++) if (r = i[o].call(n, t, e)) return r } function ct(e, t, n) { var r, i, o, a, s, u, l, c, f = "height" in t, p = this, d = {}, h = e.style, g = e.nodeType && ae(e), y = J.get(e, "fxshow"); n.queue || (null == (a = w._queueHooks(e, "fx")).unqueued && (a.unqueued = 0, s = a.empty.fire, a.empty.fire = function () { a.unqueued || s() }), a.unqueued++, p.always(function () { p.always(function () { a.unqueued--, w.queue(e, "fx").length || a.empty.fire() }) })); for (r in t) if (i = t[r], it.test(i)) { if (delete t[r], o = o || "toggle" === i, i === (g ? "hide" : "show")) { if ("show" !== i || !y || void 0 === y[r]) continue; g = !0 } d[r] = y && y[r] || w.style(e, r) } if ((u = !w.isEmptyObject(t)) || !w.isEmptyObject(d)) { f && 1 === e.nodeType && (n.overflow = [h.overflow, h.overflowX, h.overflowY], null == (l = y && y.display) && (l = J.get(e, "display")), "none" === (c = w.css(e, "display")) && (l ? c = l : (fe([e], !0), l = e.style.display || l, c = w.css(e, "display"), fe([e]))), ("inline" === c || "inline-block" === c && null != l) && "none" === w.css(e, "float") && (u || (p.done(function () { h.display = l }), null == l && (c = h.display, l = "none" === c ? "" : c)), h.display = "inline-block")), n.overflow && (h.overflow = "hidden", p.always(function () { h.overflow = n.overflow[0], h.overflowX = n.overflow[1], h.overflowY = n.overflow[2] })), u = !1; for (r in d) u || (y ? "hidden" in y && (g = y.hidden) : y = J.access(e, "fxshow", { display: l }), o && (y.hidden = !g), g && fe([e], !0), p.done(function () { g || fe([e]), J.remove(e, "fxshow"); for (r in d) w.style(e, r, d[r]) })), u = lt(g ? y[r] : 0, r, p), r in y || (y[r] = u.start, g && (u.end = u.start, u.start = 0)) } } function ft(e, t) { var n, r, i, o, a; for (n in e) if (r = G(n), i = t[r], o = e[n], Array.isArray(o) && (i = o[1], o = e[n] = o[0]), n !== r && (e[r] = o, delete e[n]), (a = w.cssHooks[r]) && "expand" in a) { o = a.expand(o), delete e[r]; for (n in o) n in e || (e[n] = o[n], t[n] = i) } else t[r] = i } function pt(e, t, n) { var r, i, o = 0, a = pt.prefilters.length, s = w.Deferred().always(function () { delete u.elem }), u = function () { if (i) return !1; for (var t = nt || st(), n = Math.max(0, l.startTime + l.duration - t), r = 1 - (n / l.duration || 0), o = 0, a = l.tweens.length; o < a; o++) l.tweens[o].run(r); return s.notifyWith(e, [l, r, n]), r < 1 && a ? n : (a || s.notifyWith(e, [l, 1, 0]), s.resolveWith(e, [l]), !1) }, l = s.promise({ elem: e, props: w.extend({}, t), opts: w.extend(!0, { specialEasing: {}, easing: w.easing._default }, n), originalProperties: t, originalOptions: n, startTime: nt || st(), duration: n.duration, tweens: [], createTween: function (t, n) { var r = w.Tween(e, l.opts, t, n, l.opts.specialEasing[t] || l.opts.easing); return l.tweens.push(r), r }, stop: function (t) { var n = 0, r = t ? l.tweens.length : 0; if (i) return this; for (i = !0; n < r; n++) l.tweens[n].run(1); return t ? (s.notifyWith(e, [l, 1, 0]), s.resolveWith(e, [l, t])) : s.rejectWith(e, [l, t]), this } }), c = l.props; for (ft(c, l.opts.specialEasing); o < a; o++) if (r = pt.prefilters[o].call(l, e, c, l.opts)) return g(r.stop) && (w._queueHooks(l.elem, l.opts.queue).stop = r.stop.bind(r)), r; return w.map(c, lt, l), g(l.opts.start) && l.opts.start.call(e, l), l.progress(l.opts.progress).done(l.opts.done, l.opts.complete).fail(l.opts.fail).always(l.opts.always), w.fx.timer(w.extend(u, { elem: e, anim: l, queue: l.opts.queue })), l } w.Animation = w.extend(pt, { tweeners: { "*": [function (e, t) { var n = this.createTween(e, t); return ue(n.elem, e, ie.exec(t), n), n }] }, tweener: function (e, t) { g(e) ? (t = e, e = ["*"]) : e = e.match(M); for (var n, r = 0, i = e.length; r < i; r++) n = e[r], pt.tweeners[n] = pt.tweeners[n] || [], pt.tweeners[n].unshift(t) }, prefilters: [ct], prefilter: function (e, t) { t ? pt.prefilters.unshift(e) : pt.prefilters.push(e) } }), w.speed = function (e, t, n) { var r = e && "object" == typeof e ? w.extend({}, e) : { complete: n || !n && t || g(e) && e, duration: e, easing: n && t || t && !g(t) && t }; return w.fx.off ? r.duration = 0 : "number" != typeof r.duration && (r.duration in w.fx.speeds ? r.duration = w.fx.speeds[r.duration] : r.duration = w.fx.speeds._default), null != r.queue && !0 !== r.queue || (r.queue = "fx"), r.old = r.complete, r.complete = function () { g(r.old) && r.old.call(this), r.queue && w.dequeue(this, r.queue) }, r }, w.fn.extend({ fadeTo: function (e, t, n, r) { return this.filter(ae).css("opacity", 0).show().end().animate({ opacity: t }, e, n, r) }, animate: function (e, t, n, r) { var i = w.isEmptyObject(e), o = w.speed(t, n, r), a = function () { var t = pt(this, w.extend({}, e), o); (i || J.get(this, "finish")) && t.stop(!0) }; return a.finish = a, i || !1 === o.queue ? this.each(a) : this.queue(o.queue, a) }, stop: function (e, t, n) { var r = function (e) { var t = e.stop; delete e.stop, t(n) }; return "string" != typeof e && (n = t, t = e, e = void 0), t && !1 !== e && this.queue(e || "fx", []), this.each(function () { var t = !0, i = null != e && e + "queueHooks", o = w.timers, a = J.get(this); if (i) a[i] && a[i].stop && r(a[i]); else for (i in a) a[i] && a[i].stop && ot.test(i) && r(a[i]); for (i = o.length; i--;) o[i].elem !== this || null != e && o[i].queue !== e || (o[i].anim.stop(n), t = !1, o.splice(i, 1)); !t && n || w.dequeue(this, e) }) }, finish: function (e) { return !1 !== e && (e = e || "fx"), this.each(function () { var t, n = J.get(this), r = n[e + "queue"], i = n[e + "queueHooks"], o = w.timers, a = r ? r.length : 0; for (n.finish = !0, w.queue(this, e, []), i && i.stop && i.stop.call(this, !0), t = o.length; t--;) o[t].elem === this && o[t].queue === e && (o[t].anim.stop(!0), o.splice(t, 1)); for (t = 0; t < a; t++) r[t] && r[t].finish && r[t].finish.call(this); delete n.finish }) } }), w.each(["toggle", "show", "hide"], function (e, t) { var n = w.fn[t]; w.fn[t] = function (e, r, i) { return null == e || "boolean" == typeof e ? n.apply(this, arguments) : this.animate(ut(t, !0), e, r, i) } }), w.each({ slideDown: ut("show"), slideUp: ut("hide"), slideToggle: ut("toggle"), fadeIn: { opacity: "show" }, fadeOut: { opacity: "hide" }, fadeToggle: { opacity: "toggle" } }, function (e, t) { w.fn[e] = function (e, n, r) { return this.animate(t, e, n, r) } }), w.timers = [], w.fx.tick = function () { var e, t = 0, n = w.timers; for (nt = Date.now(); t < n.length; t++)(e = n[t])() || n[t] !== e || n.splice(t--, 1); n.length || w.fx.stop(), nt = void 0 }, w.fx.timer = function (e) { w.timers.push(e), w.fx.start() }, w.fx.interval = 13, w.fx.start = function () { rt || (rt = !0, at()) }, w.fx.stop = function () { rt = null }, w.fx.speeds = { slow: 600, fast: 200, _default: 400 }, w.fn.delay = function (t, n) { return t = w.fx ? w.fx.speeds[t] || t : t, n = n || "fx", this.queue(n, function (n, r) { var i = e.setTimeout(n, t); r.stop = function () { e.clearTimeout(i) } }) }, function () { var e = r.createElement("input"), t = r.createElement("select").appendChild(r.createElement("option")); e.type = "checkbox", h.checkOn = "" !== e.value, h.optSelected = t.selected, (e = r.createElement("input")).value = "t", e.type = "radio", h.radioValue = "t" === e.value }(); var dt, ht = w.expr.attrHandle; w.fn.extend({ attr: function (e, t) { return z(this, w.attr, e, t, arguments.length> 1)
},
removeAttr: function (e) {
return this.each(function () {
w.removeAttr(this, e)
})
}
}), w.extend({
attr: function (e, t, n) {
var r, i, o = e.nodeType;
if (3 !== o && 8 !== o && 2 !== o) return "undefined" == typeof e.getAttribute ? w.prop(e, t, n) : (1 === o && w.isXMLDoc(e) || (i = w.attrHooks[t.toLowerCase()] || (w.expr.match.bool.test(t) ? dt : void 0)), void 0 !== n ? null === n ? void w.removeAttr(e, t) : i && "set" in i && void 0 !== (r = i.set(e, n, t)) ? r : (e.setAttribute(t, n + ""), n) : i && "get" in i && null !== (r = i.get(e, t)) ? r : null == (r = w.find.attr(e, t)) ? void 0 : r)
},
attrHooks: {
type: {
set: function (e, t) {
if (!h.radioValue && "radio" === t && N(e, "input")) {
var n = e.value;
return e.setAttribute("type", t), n && (e.value = n), t
}
}
}
},
removeAttr: function (e, t) {
var n, r = 0,
i = t && t.match(M);
if (i && 1 === e.nodeType)
while (n = i[r++]) e.removeAttribute(n)
}
}), dt = {
set: function (e, t, n) {
return !1 === t ? w.removeAttr(e, n) : e.setAttribute(n, n), n
}
}, w.each(w.expr.match.bool.source.match(/\w+/g), function (e, t) {
var n = ht[t] || w.find.attr;
ht[t] = function (e, t, r) {
var i, o, a = t.toLowerCase();
return r || (o = ht[a], ht[a] = i, i = null != n(e, t, r) ? a : null, ht[a] = o), i
}
});
var gt = /^(?:input|select|textarea|button)$/i,
yt = /^(?:a|area)$/i;
w.fn.extend({
prop: function (e, t) {
return z(this, w.prop, e, t, arguments.length> 1)
},
removeProp: function (e) {
return this.each(function () {
delete this[w.propFix[e] || e]
})
}
}), w.extend({
prop: function (e, t, n) {
var r, i, o = e.nodeType;
if (3 !== o && 8 !== o && 2 !== o) return 1 === o && w.isXMLDoc(e) || (t = w.propFix[t] || t, i = w.propHooks[t]), void 0 !== n ? i && "set" in i && void 0 !== (r = i.set(e, n, t)) ? r : e[t] = n : i && "get" in i && null !== (r = i.get(e, t)) ? r : e[t]
},
propHooks: {
tabIndex: {
get: function (e) {
var t = w.find.attr(e, "tabindex");
return t ? parseInt(t, 10) : gt.test(e.nodeName) || yt.test(e.nodeName) && e.href ? 0 : -1
}
}
},
propFix: {
"for": "htmlFor",
"class": "className"
}
}), h.optSelected || (w.propHooks.selected = {
get: function (e) {
var t = e.parentNode;
return t && t.parentNode && t.parentNode.selectedIndex, null
},
set: function (e) {
var t = e.parentNode;
t && (t.selectedIndex, t.parentNode && t.parentNode.selectedIndex)
}
}), w.each(["tabIndex", "readOnly", "maxLength", "cellSpacing", "cellPadding", "rowSpan", "colSpan", "useMap", "frameBorder", "contentEditable"], function () {
w.propFix[this.toLowerCase()] = this
});
function vt(e) {
return (e.match(M) || []).join(" ")
}
function mt(e) {
return e.getAttribute && e.getAttribute("class") || ""
}
function xt(e) {
return Array.isArray(e) ? e : "string" == typeof e ? e.match(M) || [] : []
}
w.fn.extend({
addClass: function (e) {
var t, n, r, i, o, a, s, u = 0;
if (g(e)) return this.each(function (t) {
w(this).addClass(e.call(this, t, mt(this)))
});
if ((t = xt(e)).length)
while (n = this[u++])
if (i = mt(n), r = 1 === n.nodeType && " " + vt(i) + " ") {
a = 0;
while (o = t[a++]) r.indexOf(" " + o + " ") < 0 && (r += o + " "); i !== (s = vt(r)) && n.setAttribute("class", s) } return this }, removeClass: function (e) { var t, n, r, i, o, a, s, u = 0; if (g(e)) return this.each(function (t) { w(this).removeClass(e.call(this, t, mt(this))) }); if (!arguments.length) return this.attr("class", ""); if ((t = xt(e)).length) while (n = this[u++]) if (i = mt(n), r = 1 === n.nodeType && " " + vt(i) + " ") { a = 0; while (o = t[a++]) while (r.indexOf(" " + o + " ")> -1) r = r.replace(" " + o + " ", " ");
i !== (s = vt(r)) && n.setAttribute("class", s)
} return this
},
toggleClass: function (e, t) {
var n = typeof e,
r = "string" === n || Array.isArray(e);
return "boolean" == typeof t && r ? t ? this.addClass(e) : this.removeClass(e) : g(e) ? this.each(function (n) {
w(this).toggleClass(e.call(this, n, mt(this), t), t)
}) : this.each(function () {
var t, i, o, a;
if (r) {
i = 0, o = w(this), a = xt(e);
while (t = a[i++]) o.hasClass(t) ? o.removeClass(t) : o.addClass(t)
} else void 0 !== e && "boolean" !== n || ((t = mt(this)) && J.set(this, "__className__", t), this.setAttribute && this.setAttribute("class", t || !1 === e ? "" : J.get(this, "__className__") || ""))
})
},
hasClass: function (e) {
var t, n, r = 0;
t = " " + e + " ";
while (n = this[r++])
if (1 === n.nodeType && (" " + vt(mt(n)) + " ").indexOf(t)> -1) return !0;
return !1
}
});
var bt = /\r/g;
w.fn.extend({
val: function (e) {
var t, n, r, i = this[0]; {
if (arguments.length) return r = g(e), this.each(function (n) {
var i;
1 === this.nodeType && (null == (i = r ? e.call(this, n, w(this).val()) : e) ? i = "" : "number" == typeof i ? i += "" : Array.isArray(i) && (i = w.map(i, function (e) {
return null == e ? "" : e + ""
})), (t = w.valHooks[this.type] || w.valHooks[this.nodeName.toLowerCase()]) && "set" in t && void 0 !== t.set(this, i, "value") || (this.value = i))
});
if (i) return (t = w.valHooks[i.type] || w.valHooks[i.nodeName.toLowerCase()]) && "get" in t && void 0 !== (n = t.get(i, "value")) ? n : "string" == typeof (n = i.value) ? n.replace(bt, "") : null == n ? "" : n
}
}
}), w.extend({
valHooks: {
option: {
get: function (e) {
var t = w.find.attr(e, "value");
return null != t ? t : vt(w.text(e))
}
},
select: {
get: function (e) {
var t, n, r, i = e.options,
o = e.selectedIndex,
a = "select-one" === e.type,
s = a ? null : [],
u = a ? o + 1 : i.length;
for (r = o < 0 ? u : a ? o : 0; r < u; r++) if (((n = i[r]).selected || r === o) && !n.disabled && (!n.parentNode.disabled || !N(n.parentNode, "optgroup"))) { if (t = w(n).val(), a) return t; s.push(t) } return s }, set: function (e, t) { var n, r, i = e.options, o = w.makeArray(t), a = i.length; while (a--)((r = i[a]).selected = w.inArray(w.valHooks.option.get(r), o)> -1) && (n = !0);
return n || (e.selectedIndex = -1), o
}
}
}
}), w.each(["radio", "checkbox"], function () {
w.valHooks[this] = {
set: function (e, t) {
if (Array.isArray(t)) return e.checked = w.inArray(w(e).val(), t)> -1
}
}, h.checkOn || (w.valHooks[this].get = function (e) {
return null === e.getAttribute("value") ? "on" : e.value
})
}), h.focusin = "onfocusin" in e;
var wt = /^(?:focusinfocus|focusoutblur)$/,
Tt = function (e) {
e.stopPropagation()
};
w.extend(w.event, {
trigger: function (t, n, i, o) {
var a, s, u, l, c, p, d, h, v = [i || r],
m = f.call(t, "type") ? t.type : t,
x = f.call(t, "namespace") ? t.namespace.split(".") : [];
if (s = h = u = i = i || r, 3 !== i.nodeType && 8 !== i.nodeType && !wt.test(m + w.event.triggered) && (m.indexOf(".")> -1 && (m = (x = m.split(".")).shift(), x.sort()), c = m.indexOf(":") < 0 && "on" + m, t = t[w.expando] ? t : new w.Event(m, "object" == typeof t && t), t.isTrigger = o ? 2 : 3, t.namespace = x.join("."), t.rnamespace = t.namespace ? new RegExp("(^|\\.)" + x.join("\\.(?:.*\\.|)") + "(\\.|$)") : null, t.result = void 0, t.target || (t.target = i), n = null == n ? [t] : w.makeArray(n, [t]), d = w.event.special[m] || {}, o || !d.trigger || !1 !== d.trigger.apply(i, n))) { if (!o && !d.noBubble && !y(i)) { for (l = d.delegateType || m, wt.test(l + m) || (s = s.parentNode); s; s = s.parentNode) v.push(s), u = s; u === (i.ownerDocument || r) && v.push(u.defaultView || u.parentWindow || e) } a = 0; while ((s = v[a++]) && !t.isPropagationStopped()) h = s, t.type = a> 1 ? l : d.bindType || m, (p = (J.get(s, "events") || {})[t.type] && J.get(s, "handle")) && p.apply(s, n), (p = c && s[c]) && p.apply && Y(s) && (t.result = p.apply(s, n), !1 === t.result && t.preventDefault());
return t.type = m, o || t.isDefaultPrevented() || d._default && !1 !== d._default.apply(v.pop(), n) || !Y(i) || c && g(i[m]) && !y(i) && ((u = i[c]) && (i[c] = null), w.event.triggered = m, t.isPropagationStopped() && h.addEventListener(m, Tt), i[m](), t.isPropagationStopped() && h.removeEventListener(m, Tt), w.event.triggered = void 0, u && (i[c] = u)), t.result
}
},
simulate: function (e, t, n) {
var r = w.extend(new w.Event, n, {
type: e,
isSimulated: !0
});
w.event.trigger(r, null, t)
}
}), w.fn.extend({
trigger: function (e, t) {
return this.each(function () {
w.event.trigger(e, t, this)
})
},
triggerHandler: function (e, t) {
var n = this[0];
if (n) return w.event.trigger(e, t, n, !0)
}
}), h.focusin || w.each({
focus: "focusin",
blur: "focusout"
}, function (e, t) {
var n = function (e) {
w.event.simulate(t, e.target, w.event.fix(e))
};
w.event.special[t] = {
setup: function () {
var r = this.ownerDocument || this,
i = J.access(r, t);
i || r.addEventListener(e, n, !0), J.access(r, t, (i || 0) + 1)
},
teardown: function () {
var r = this.ownerDocument || this,
i = J.access(r, t) - 1;
i ? J.access(r, t, i) : (r.removeEventListener(e, n, !0), J.remove(r, t))
}
}
});
var Ct = e.location,
Et = Date.now(),
kt = /\?/;
w.parseXML = function (t) {
var n;
if (!t || "string" != typeof t) return null;
try {
n = (new e.DOMParser).parseFromString(t, "text/xml")
} catch (e) {
n = void 0
}
return n && !n.getElementsByTagName("parsererror").length || w.error("Invalid XML: " + t), n
};
var St = /\[\]$/,
Dt = /\r?\n/g,
Nt = /^(?:submit|button|image|reset|file)$/i,
At = /^(?:input|select|textarea|keygen)/i;
function jt(e, t, n, r) {
var i;
if (Array.isArray(t)) w.each(t, function (t, i) {
n || St.test(e) ? r(e, i) : jt(e + "[" + ("object" == typeof i && null != i ? t : "") + "]", i, n, r)
});
else if (n || "object" !== x(t)) r(e, t);
else
for (i in t) jt(e + "[" + i + "]", t[i], n, r)
}
w.param = function (e, t) {
var n, r = [],
i = function (e, t) {
var n = g(t) ? t() : t;
r[r.length] = encodeURIComponent(e) + "=" + encodeURIComponent(null == n ? "" : n)
};
if (Array.isArray(e) || e.jquery && !w.isPlainObject(e)) w.each(e, function () {
i(this.name, this.value)
});
else
for (n in e) jt(n, e[n], t, i);
return r.join("&")
}, w.fn.extend({
serialize: function () {
return w.param(this.serializeArray())
},
serializeArray: function () {
return this.map(function () {
var e = w.prop(this, "elements");
return e ? w.makeArray(e) : this
}).filter(function () {
var e = this.type;
return this.name && !w(this).is(":disabled") && At.test(this.nodeName) && !Nt.test(e) && (this.checked || !pe.test(e))
}).map(function (e, t) {
var n = w(this).val();
return null == n ? null : Array.isArray(n) ? w.map(n, function (e) {
return {
name: t.name,
value: e.replace(Dt, "\r\n")
}
}) : {
name: t.name,
value: n.replace(Dt, "\r\n")
}
}).get()
}
});
var qt = /%20/g,
Lt = /#.*$/,
Ht = /([?&])_=[^&]*/,
Ot = /^(.*?):[ \t]*([^\r\n]*)$/gm,
Pt = /^(?:about|app|app-storage|.+-extension|file|res|widget):$/,
Mt = /^(?:GET|HEAD)$/,
Rt = /^\/\//,
It = {},
Wt = {},
$t = "*/".concat("*"),
Bt = r.createElement("a");
Bt.href = Ct.href;
function Ft(e) {
return function (t, n) {
"string" != typeof t && (n = t, t = "*");
var r, i = 0,
o = t.toLowerCase().match(M) || [];
if (g(n))
while (r = o[i++]) "+" === r[0] ? (r = r.slice(1) || "*", (e[r] = e[r] || []).unshift(n)) : (e[r] = e[r] || []).push(n)
}
}
function _t(e, t, n, r) {
var i = {},
o = e === Wt;
function a(s) {
var u;
return i[s] = !0, w.each(e[s] || [], function (e, s) {
var l = s(t, n, r);
return "string" != typeof l || o || i[l] ? o ? !(u = l) : void 0 : (t.dataTypes.unshift(l), a(l), !1)
}), u
}
return a(t.dataTypes[0]) || !i["*"] && a("*")
}
function zt(e, t) {
var n, r, i = w.ajaxSettings.flatOptions || {};
for (n in t) void 0 !== t[n] && ((i[n] ? e : r || (r = {}))[n] = t[n]);
return r && w.extend(!0, e, r), e
}
function Xt(e, t, n) {
var r, i, o, a, s = e.contents,
u = e.dataTypes;
while ("*" === u[0]) u.shift(), void 0 === r && (r = e.mimeType || t.getResponseHeader("Content-Type"));
if (r)
for (i in s)
if (s[i] && s[i].test(r)) {
u.unshift(i);
break
} if (u[0] in n) o = u[0];
else {
for (i in n) {
if (!u[0] || e.converters[i + " " + u[0]]) {
o = i;
break
}
a || (a = i)
}
o = o || a
}
if (o) return o !== u[0] && u.unshift(o), n[o]
}
function Ut(e, t, n, r) {
var i, o, a, s, u, l = {},
c = e.dataTypes.slice();
if (c[1])
for (a in e.converters) l[a.toLowerCase()] = e.converters[a];
o = c.shift();
while (o)
if (e.responseFields[o] && (n[e.responseFields[o]] = t), !u && r && e.dataFilter && (t = e.dataFilter(t, e.dataType)), u = o, o = c.shift())
if ("*" === o) o = u;
else if ("*" !== u && u !== o) {
if (!(a = l[u + " " + o] || l["* " + o]))
for (i in l)
if ((s = i.split(" "))[1] === o && (a = l[u + " " + s[0]] || l["* " + s[0]])) {
!0 === a ? a = l[i] : !0 !== l[i] && (o = s[0], c.unshift(s[1]));
break
} if (!0 !== a)
if (a && e["throws"]) t = a(t);
else try {
t = a(t)
} catch (e) {
return {
state: "parsererror",
error: a ? e : "No conversion from " + u + " to " + o
}
}
}
return {
state: "success",
data: t
}
}
w.extend({
active: 0,
lastModified: {},
etag: {},
ajaxSettings: {
url: Ct.href,
type: "GET",
isLocal: Pt.test(Ct.protocol),
global: !0,
processData: !0,
async: !0,
contentType: "application/x-www-form-urlencoded; charset=UTF-8",
accepts: {
"*": $t,
text: "text/plain",
html: "text/html",
xml: "application/xml, text/xml",
json: "application/json, text/javascript"
},
contents: {
xml: /\bxml\b/,
html: /\bhtml/,
json: /\bjson\b/
},
responseFields: {
xml: "responseXML",
text: "responseText",
json: "responseJSON"
},
converters: {
"* text": String,
"text html": !0,
"text json": JSON.parse,
"text xml": w.parseXML
},
flatOptions: {
url: !0,
context: !0
}
},
ajaxSetup: function (e, t) {
return t ? zt(zt(e, w.ajaxSettings), t) : zt(w.ajaxSettings, e)
},
ajaxPrefilter: Ft(It),
ajaxTransport: Ft(Wt),
ajax: function (t, n) {
"object" == typeof t && (n = t, t = void 0), n = n || {};
var i, o, a, s, u, l, c, f, p, d, h = w.ajaxSetup({}, n),
g = h.context || h,
y = h.context && (g.nodeType || g.jquery) ? w(g) : w.event,
v = w.Deferred(),
m = w.Callbacks("once memory"),
x = h.statusCode || {},
b = {},
T = {},
C = "canceled",
E = {
readyState: 0,
getResponseHeader: function (e) {
var t;
if (c) {
if (!s) {
s = {};
while (t = Ot.exec(a)) s[t[1].toLowerCase()] = t[2]
}
t = s[e.toLowerCase()]
}
return null == t ? null : t
},
getAllResponseHeaders: function () {
return c ? a : null
},
setRequestHeader: function (e, t) {
return null == c && (e = T[e.toLowerCase()] = T[e.toLowerCase()] || e, b[e] = t), this
},
overrideMimeType: function (e) {
return null == c && (h.mimeType = e), this
},
statusCode: function (e) {
var t;
if (e)
if (c) E.always(e[E.status]);
else
for (t in e) x[t] = [x[t], e[t]];
return this
},
abort: function (e) {
var t = e || C;
return i && i.abort(t), k(0, t), this
}
};
if (v.promise(E), h.url = ((t || h.url || Ct.href) + "").replace(Rt, Ct.protocol + "//"), h.type = n.method || n.type || h.method || h.type, h.dataTypes = (h.dataType || "*").toLowerCase().match(M) || [""], null == h.crossDomain) {
l = r.createElement("a");
try {
l.href = h.url, l.href = l.href, h.crossDomain = Bt.protocol + "//" + Bt.host != l.protocol + "//" + l.host
} catch (e) {
h.crossDomain = !0
}
}
if (h.data && h.processData && "string" != typeof h.data && (h.data = w.param(h.data, h.traditional)), _t(It, h, n, E), c) return E;
(f = w.event && h.global) && 0 == w.active++ && w.event.trigger("ajaxStart"), h.type = h.type.toUpperCase(), h.hasContent = !Mt.test(h.type), o = h.url.replace(Lt, ""), h.hasContent ? h.data && h.processData && 0 === (h.contentType || "").indexOf("application/x-www-form-urlencoded") && (h.data = h.data.replace(qt, "+")) : (d = h.url.slice(o.length), h.data && (h.processData || "string" == typeof h.data) && (o += (kt.test(o) ? "&" : "?") + h.data, delete h.data), !1 === h.cache && (o = o.replace(Ht, "1ドル"), d = (kt.test(o) ? "&" : "?") + "_=" + Et++ + d), h.url = o + d), h.ifModified && (w.lastModified[o] && E.setRequestHeader("If-Modified-Since", w.lastModified[o]), w.etag[o] && E.setRequestHeader("If-None-Match", w.etag[o])), (h.data && h.hasContent && !1 !== h.contentType || n.contentType) && E.setRequestHeader("Content-Type", h.contentType), E.setRequestHeader("Accept", h.dataTypes[0] && h.accepts[h.dataTypes[0]] ? h.accepts[h.dataTypes[0]] + ("*" !== h.dataTypes[0] ? ", " + $t + "; q=0.01" : "") : h.accepts["*"]);
for (p in h.headers) E.setRequestHeader(p, h.headers[p]);
if (h.beforeSend && (!1 === h.beforeSend.call(g, E, h) || c)) return E.abort();
if (C = "abort", m.add(h.complete), E.done(h.success), E.fail(h.error), i = _t(Wt, h, n, E)) {
if (E.readyState = 1, f && y.trigger("ajaxSend", [E, h]), c) return E;
h.async && h.timeout> 0 && (u = e.setTimeout(function () {
E.abort("timeout")
}, h.timeout));
try {
c = !1, i.send(b, k)
} catch (e) {
if (c) throw e;
k(-1, e)
}
} else k(-1, "No Transport");
function k(t, n, r, s) {
var l, p, d, b, T, C = n;
c || (c = !0, u && e.clearTimeout(u), i = void 0, a = s || "", E.readyState = t> 0 ? 4 : 0, l = t>= 200 && t < 300 || 304 === t, r && (b = Xt(h, E, r)), b = Ut(h, b, E, l), l ? (h.ifModified && ((T = E.getResponseHeader("Last-Modified")) && (w.lastModified[o] = T), (T = E.getResponseHeader("etag")) && (w.etag[o] = T)), 204 === t || "HEAD" === h.type ? C = "nocontent" : 304 === t ? C = "notmodified" : (C = b.state, p = b.data, l = !(d = b.error))) : (d = C, !t && C || (C = "error", t < 0 && (t = 0))), E.status = t, E.statusText = (n || C) + "", l ? v.resolveWith(g, [p, C, E]) : v.rejectWith(g, [E, C, d]), E.statusCode(x), x = void 0, f && y.trigger(l ? "ajaxSuccess" : "ajaxError", [E, h, l ? p : d]), m.fireWith(g, [E, C]), f && (y.trigger("ajaxComplete", [E, h]), --w.active || w.event.trigger("ajaxStop"))) } return E }, getJSON: function (e, t, n) { return w.get(e, t, n, "json") }, getScript: function (e, t) { return w.get(e, void 0, t, "script") } }), w.each(["get", "post"], function (e, t) { w[t] = function (e, n, r, i) { return g(n) && (i = i || r, r = n, n = void 0), w.ajax(w.extend({ url: e, type: t, dataType: i, data: n, success: r }, w.isPlainObject(e) && e)) } }), w._evalUrl = function (e) { return w.ajax({ url: e, type: "GET", dataType: "script", cache: !0, async: !1, global: !1, "throws": !0 }) }, w.fn.extend({ wrapAll: function (e) { var t; return this[0] && (g(e) && (e = e.call(this[0])), t = w(e, this[0].ownerDocument).eq(0).clone(!0), this[0].parentNode && t.insertBefore(this[0]), t.map(function () { var e = this; while (e.firstElementChild) e = e.firstElementChild; return e }).append(this)), this }, wrapInner: function (e) { return g(e) ? this.each(function (t) { w(this).wrapInner(e.call(this, t)) }) : this.each(function () { var t = w(this), n = t.contents(); n.length ? n.wrapAll(e) : t.append(e) }) }, wrap: function (e) { var t = g(e); return this.each(function (n) { w(this).wrapAll(t ? e.call(this, n) : e) }) }, unwrap: function (e) { return this.parent(e).not("body").each(function () { w(this).replaceWith(this.childNodes) }), this } }), w.expr.pseudos.hidden = function (e) { return !w.expr.pseudos.visible(e) }, w.expr.pseudos.visible = function (e) { return !!(e.offsetWidth || e.offsetHeight || e.getClientRects().length) }, w.ajaxSettings.xhr = function () { try { return new e.XMLHttpRequest } catch (e) {} }; var Vt = { 0: 200, 1223: 204 }, Gt = w.ajaxSettings.xhr(); h.cors = !!Gt && "withCredentials" in Gt, h.ajax = Gt = !!Gt, w.ajaxTransport(function (t) { var n, r; if (h.cors || Gt && !t.crossDomain) return { send: function (i, o) { var a, s = t.xhr(); if (s.open(t.type, t.url, t.async, t.username, t.password), t.xhrFields) for (a in t.xhrFields) s[a] = t.xhrFields[a]; t.mimeType && s.overrideMimeType && s.overrideMimeType(t.mimeType), t.crossDomain || i["X-Requested-With"] || (i["X-Requested-With"] = "XMLHttpRequest"); for (a in i) s.setRequestHeader(a, i[a]); n = function (e) { return function () { n && (n = r = s.onload = s.onerror = s.onabort = s.ontimeout = s.onreadystatechange = null, "abort" === e ? s.abort() : "error" === e ? "number" != typeof s.status ? o(0, "error") : o(s.status, s.statusText) : o(Vt[s.status] || s.status, s.statusText, "text" !== (s.responseType || "text") || "string" != typeof s.responseText ? { binary: s.response } : { text: s.responseText }, s.getAllResponseHeaders())) } }, s.onload = n(), r = s.onerror = s.ontimeout = n("error"), void 0 !== s.onabort ? s.onabort = r : s.onreadystatechange = function () { 4 === s.readyState && e.setTimeout(function () { n && r() }) }, n = n("abort"); try { s.send(t.hasContent && t.data || null) } catch (e) { if (n) throw e } }, abort: function () { n && n() } } }), w.ajaxPrefilter(function (e) { e.crossDomain && (e.contents.script = !1) }), w.ajaxSetup({ accepts: { script: "text/javascript, application/javascript, application/ecmascript, application/x-ecmascript" }, contents: { script: /\b(?:java|ecma)script\b/ }, converters: { "text script": function (e) { return w.globalEval(e), e } } }), w.ajaxPrefilter("script", function (e) { void 0 === e.cache && (e.cache = !1), e.crossDomain && (e.type = "GET") }), w.ajaxTransport("script", function (e) { if (e.crossDomain) { var t, n; return { send: function (i, o) { t = w(">").prop({
charset: e.scriptCharset,
src: e.url
}).on("load error", n = function (e) {
t.remove(), n = null, e && o("error" === e.type ? 404 : 200, e.type)
}), r.head.appendChild(t[0])
},
abort: function () {
n && n()
}
}
}
});
var Yt = [],
Qt = /(=)\?(?=&|$)|\?\?/;
w.ajaxSetup({
jsonp: "callback",
jsonpCallback: function () {
var e = Yt.pop() || w.expando + "_" + Et++;
return this[e] = !0, e
}
}), w.ajaxPrefilter("json jsonp", function (t, n, r) {
var i, o, a, s = !1 !== t.jsonp && (Qt.test(t.url) ? "url" : "string" == typeof t.data && 0 === (t.contentType || "").indexOf("application/x-www-form-urlencoded") && Qt.test(t.data) && "data");
if (s || "jsonp" === t.dataTypes[0]) return i = t.jsonpCallback = g(t.jsonpCallback) ? t.jsonpCallback() : t.jsonpCallback, s ? t[s] = t[s].replace(Qt, "1ドル" + i) : !1 !== t.jsonp && (t.url += (kt.test(t.url) ? "&" : "?") + t.jsonp + "=" + i), t.converters["script json"] = function () {
return a || w.error(i + " was not called"), a[0]
}, t.dataTypes[0] = "json", o = e[i], e[i] = function () {
a = arguments
}, r.always(function () {
void 0 === o ? w(e).removeProp(i) : e[i] = o, t[i] && (t.jsonpCallback = n.jsonpCallback, Yt.push(i)), a && g(o) && o(a[0]), a = o = void 0
}), "script"
}), h.createHTMLDocument = function () {
var e = r.implementation.createHTMLDocument("").body;
return e.innerHTML = "", 2 === e.childNodes.length
}(), w.parseHTML = function (e, t, n) {
if ("string" != typeof e) return [];
"boolean" == typeof t && (n = t, t = !1);
var i, o, a;
return t || (h.createHTMLDocument ? ((i = (t = r.implementation.createHTMLDocument("")).createElement("base")).href = r.location.href, t.head.appendChild(i)) : t = r), o = A.exec(e), a = !n && [], o ? [t.createElement(o[1])] : (o = xe([e], t, a), a && a.length && w(a).remove(), w.merge([], o.childNodes))
}, w.fn.load = function (e, t, n) {
var r, i, o, a = this,
s = e.indexOf(" ");
return s> -1 && (r = vt(e.slice(s)), e = e.slice(0, s)), g(t) ? (n = t, t = void 0) : t && "object" == typeof t && (i = "POST"), a.length> 0 && w.ajax({
url: e,
type: i || "GET",
dataType: "html",
data: t
}).done(function (e) {
o = arguments, a.html(r ? w("").append(w.parseHTML(e)).find(r) : e)
}).always(n && function (e, t) {
a.each(function () {
n.apply(this, o || [e.responseText, t, e])
})
}), this
}, w.each(["ajaxStart", "ajaxStop", "ajaxComplete", "ajaxError", "ajaxSuccess", "ajaxSend"], function (e, t) {
w.fn[t] = function (e) {
return this.on(t, e)
}
}), w.expr.pseudos.animated = function (e) {
return w.grep(w.timers, function (t) {
return e === t.elem
}).length
}, w.offset = {
setOffset: function (e, t, n) {
var r, i, o, a, s, u, l, c = w.css(e, "position"),
f = w(e),
p = {};
"static" === c && (e.style.position = "relative"), s = f.offset(), o = w.css(e, "top"), u = w.css(e, "left"), (l = ("absolute" === c || "fixed" === c) && (o + u).indexOf("auto")> -1) ? (a = (r = f.position()).top, i = r.left) : (a = parseFloat(o) || 0, i = parseFloat(u) || 0), g(t) && (t = t.call(e, n, w.extend({}, s))), null != t.top && (p.top = t.top - s.top + a), null != t.left && (p.left = t.left - s.left + i), "using" in t ? t.using.call(e, p) : f.css(p)
}
}, w.fn.extend({
offset: function (e) {
if (arguments.length) return void 0 === e ? this : this.each(function (t) {
w.offset.setOffset(this, e, t)
});
var t, n, r = this[0];
if (r) return r.getClientRects().length ? (t = r.getBoundingClientRect(), n = r.ownerDocument.defaultView, {
top: t.top + n.pageYOffset,
left: t.left + n.pageXOffset
}) : {
top: 0,
left: 0
}
},
position: function () {
if (this[0]) {
var e, t, n, r = this[0],
i = {
top: 0,
left: 0
};
if ("fixed" === w.css(r, "position")) t = r.getBoundingClientRect();
else {
t = this.offset(), n = r.ownerDocument, e = r.offsetParent || n.documentElement;
while (e && (e === n.body || e === n.documentElement) && "static" === w.css(e, "position")) e = e.parentNode;
e && e !== r && 1 === e.nodeType && ((i = w(e).offset()).top += w.css(e, "borderTopWidth", !0), i.left += w.css(e, "borderLeftWidth", !0))
}
return {
top: t.top - i.top - w.css(r, "marginTop", !0),
left: t.left - i.left - w.css(r, "marginLeft", !0)
}
}
},
offsetParent: function () {
return this.map(function () {
var e = this.offsetParent;
while (e && "static" === w.css(e, "position")) e = e.offsetParent;
return e || be
})
}
}), w.each({
scrollLeft: "pageXOffset",
scrollTop: "pageYOffset"
}, function (e, t) {
var n = "pageYOffset" === t;
w.fn[e] = function (r) {
return z(this, function (e, r, i) {
var o;
if (y(e) ? o = e : 9 === e.nodeType && (o = e.defaultView), void 0 === i) return o ? o[t] : e[r];
o ? o.scrollTo(n ? o.pageXOffset : i, n ? i : o.pageYOffset) : e[r] = i
}, e, r, arguments.length)
}
}), w.each(["top", "left"], function (e, t) {
w.cssHooks[t] = _e(h.pixelPosition, function (e, n) {
if (n) return n = Fe(e, t), We.test(n) ? w(e).position()[t] + "px" : n
})
}), w.each({
Height: "height",
Width: "width"
}, function (e, t) {
w.each({
padding: "inner" + e,
content: t,
"": "outer" + e
}, function (n, r) {
w.fn[r] = function (i, o) {
var a = arguments.length && (n || "boolean" != typeof i),
s = n || (!0 === i || !0 === o ? "margin" : "border");
return z(this, function (t, n, i) {
var o;
return y(t) ? 0 === r.indexOf("outer") ? t["inner" + e] : t.document.documentElement["client" + e] : 9 === t.nodeType ? (o = t.documentElement, Math.max(t.body["scroll" + e], o["scroll" + e], t.body["offset" + e], o["offset" + e], o["client" + e])) : void 0 === i ? w.css(t, n, s) : w.style(t, n, i, s)
}, t, a ? i : void 0, a)
}
})
}), w.each("blur focus focusin focusout resize scroll click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup contextmenu".split(" "), function (e, t) {
w.fn[t] = function (e, n) {
return arguments.length> 0 ? this.on(t, null, e, n) : this.trigger(t)
}
}), w.fn.extend({
hover: function (e, t) {
return this.mouseenter(e).mouseleave(t || e)
}
}), w.fn.extend({
bind: function (e, t, n) {
return this.on(e, null, t, n)
},
unbind: function (e, t) {
return this.off(e, null, t)
},
delegate: function (e, t, n, r) {
return this.on(t, e, n, r)
},
undelegate: function (e, t, n) {
return 1 === arguments.length ? this.off(e, "**") : this.off(t, e || "**", n)
}
}), w.proxy = function (e, t) {
var n, r, i;
if ("string" == typeof t && (n = e[t], t = e, e = n), g(e)) return r = o.call(arguments, 2), i = function () {
return e.apply(t || this, r.concat(o.call(arguments)))
}, i.guid = e.guid = e.guid || w.guid++, i
}, w.holdReady = function (e) {
e ? w.readyWait++ : w.ready(!0)
}, w.isArray = Array.isArray, w.parseJSON = JSON.parse, w.nodeName = N, w.isFunction = g, w.isWindow = y, w.camelCase = G, w.type = x, w.now = Date.now, w.isNumeric = function (e) {
var t = w.type(e);
return ("number" === t || "string" === t) && !isNaN(e - parseFloat(e))
}, "function" == typeof define && define.amd && define("jquery", [], function () {
return w
});
var Jt = e.jQuery,
Kt = e.$;
return w.noConflict = function (t) {
return e.$ === w && (e.$ = Kt), t && e.jQuery === w && (e.jQuery = Jt), w
}, t || (e.jQuery = e.$ = w), w
});
(function () {
var remSwitch = true;
var oW = null;
var timer = null;
reset();
window.addEventListener("orientationchange", function () {
reset();
});
window.addEventListener("resize", function () {
let timerID = 0;
let count = 0;
function getSearch() {
count++;
if (timerID) {
clearTimeout(timerID)
}
timerID = setTimeout(() => {
reset();
}, 1200)
}
getSearch();
});
function reset() {
if (remSwitch) {
remSwitch = false;
oW = document.documentElement.clientWidth;
if (oW> 1920) {
oW = document.documentElement.clientWidth;
}
if (1500> oW && oW>= 1366) {
oW = document.documentElement.clientWidth * 1.1;
// oW = document.documentElement.clientWidth;
}
if (1366> oW && oW>= 1200) {
oW = document.documentElement.clientWidth * 1.2;
}
if (1200> oW && oW>= 991) {
oW = document.documentElement.clientWidth * 1.3;
}
if (991>= oW && oW>= 700) {
oW = document.documentElement.clientWidth * 2.2;
}
if (700>= oW) {
// oW = 1300;
oW = 1500;
}
document.querySelector("html").style.fontSize = oW / 19.2 + "px";
timer = setTimeout(function () {
remSwitch = true;
clearTimeout(timer);
}, 200);
}
}
})();
/*
* anime.js v3.0.1
* (c) 2019 Julian Garnier
* Released under the MIT license
* animejs.com
*/
! function (n, e) {
"object" == typeof exports && "undefined" != typeof module ? module.exports = e() : "function" == typeof define && define.amd ? define(e) : n.anime = e()
}(this, function () {
"use strict";
var n = {
update: null,
begin: null,
loopBegin: null,
changeBegin: null,
change: null,
changeComplete: null,
loopComplete: null,
complete: null,
loop: 1,
direction: "normal",
autoplay: !0,
timelineOffset: 0
},
e = {
duration: 1e3,
delay: 0,
endDelay: 0,
easing: "easeOutElastic(1, .5)",
round: 0
},
r = ["translateX", "translateY", "translateZ", "rotate", "rotateX", "rotateY", "rotateZ", "scale", "scaleX", "scaleY", "scaleZ", "skew", "skewX", "skewY", "perspective"],
t = {
CSS: {},
springs: {}
};
function a(n, e, r) {
return Math.min(Math.max(n, e), r)
}
function o(n, e) {
return n.indexOf(e)> -1
}
function i(n, e) {
return n.apply(null, e)
}
var u = {
arr: function (n) {
return Array.isArray(n)
},
obj: function (n) {
return o(Object.prototype.toString.call(n), "Object")
},
pth: function (n) {
return u.obj(n) && n.hasOwnProperty("totalLength")
},
svg: function (n) {
return n instanceof SVGElement
},
inp: function (n) {
return n instanceof HTMLInputElement
},
dom: function (n) {
return n.nodeType || u.svg(n)
},
str: function (n) {
return "string" == typeof n
},
fnc: function (n) {
return "function" == typeof n
},
und: function (n) {
return void 0 === n
},
hex: function (n) {
return /(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test(n)
},
rgb: function (n) {
return /^rgb/.test(n)
},
hsl: function (n) {
return /^hsl/.test(n)
},
col: function (n) {
return u.hex(n) || u.rgb(n) || u.hsl(n)
},
key: function (r) {
return !n.hasOwnProperty(r) && !e.hasOwnProperty(r) && "targets" !== r && "keyframes" !== r
}
};
function s(n) {
var e = /\(([^)]+)\)/.exec(n);
return e ? e[1].split(",").map(function (n) {
return parseFloat(n)
}) : []
}
function c(n, e) {
var r = s(n),
o = a(u.und(r[0]) ? 1 : r[0], .1, 100),
i = a(u.und(r[1]) ? 100 : r[1], .1, 100),
c = a(u.und(r[2]) ? 10 : r[2], .1, 100),
f = a(u.und(r[3]) ? 0 : r[3], .1, 100),
l = Math.sqrt(i / o),
d = c / (2 * Math.sqrt(i * o)),
p = d < 1 ? l * Math.sqrt(1 - d * d) : 0, v = 1, h = d < 1 ? (d * l - f) / p : -f + l; function g(n) { var r = e ? e * n / 1e3 : n; return r = d < 1 ? Math.exp(-r * d * l) * (v * Math.cos(p * r) + h * Math.sin(p * r)) : (v + h * r) * Math.exp(-r * l), 0 === n || 1 === n ? n : 1 - r } return e ? g : function () { var e = t.springs[n]; if (e) return e; for (var r = 0, a = 0;;) if (1 === g(r += 1 / 6)) { if (++a>= 16) break
} else a = 0;
var o = r * (1 / 6) * 1e3;
return t.springs[n] = o, o
}
}
function f(n, e) {
void 0 === n && (n = 1), void 0 === e && (e = .5);
var r = a(n, 1, 10),
t = a(e, .1, 2);
return function (n) {
return 0 === n || 1 === n ? n : -r * Math.pow(2, 10 * (n - 1)) * Math.sin((n - 1 - t / (2 * Math.PI) * Math.asin(1 / r)) * (2 * Math.PI) / t)
}
}
function l(n) {
return void 0 === n && (n = 10),
function (e) {
return Math.round(e * n) * (1 / n)
}
}
var d = function () {
var n = 11,
e = 1 / (n - 1);
function r(n, e) {
return 1 - 3 * e + 3 * n
}
function t(n, e) {
return 3 * e - 6 * n
}
function a(n) {
return 3 * n
}
function o(n, e, o) {
return ((r(e, o) * n + t(e, o)) * n + a(e)) * n
}
function i(n, e, o) {
return 3 * r(e, o) * n * n + 2 * t(e, o) * n + a(e)
}
return function (r, t, a, u) {
if (0 <= r && r <= 1 && 0 <= a && a <= 1) { var s = new Float32Array(n); if (r !== t || a !== u) for (var c = 0; c < n; ++c) s[c] = o(c * e, r, a); return function (n) { return r === t && a === u ? n : 0 === n || 1 === n ? n : o(f(n), t, u) } } function f(t) { for (var u = 0, c = 1, f = n - 1; c !== f && s[c] <= t; ++c) u += e; var l = u + (t - s[--c]) / (s[c + 1] - s[c]) * e, d = i(l, r, a); return d>= .001 ? function (n, e, r, t) {
for (var a = 0; a < 4; ++a) { var u = i(e, r, t); if (0 === u) return e; e -= (o(e, r, t) - n) / u } return e }(t, l, r, a) : 0 === d ? l : function (n, e, r, t, a) { for (var i, u, s = 0; (i = o(u = e + (r - e) / 2, t, a) - n)> 0 ? r = u : e = u, Math.abs(i)> 1e-7 && ++s < 10;); return u }(t, u, u + e, r, a) } } }(), p = function () { var n = ["Quad", "Cubic", "Quart", "Quint", "Sine", "Expo", "Circ", "Back", "Elastic"], e = { In: [ [.55, .085, .68, .53], [.55, .055, .675, .19], [.895, .03, .685, .22], [.755, .05, .855, .06], [.47, 0, .745, .715], [.95, .05, .795, .035], [.6, .04, .98, .335], [.6, -.28, .735, .045], f ], Out: [ [.25, .46, .45, .94], [.215, .61, .355, 1], [.165, .84, .44, 1], [.23, 1, .32, 1], [.39, .575, .565, 1], [.19, 1, .22, 1], [.075, .82, .165, 1], [.175, .885, .32, 1.275], function (n, e) { return function (r) { return 1 - f(n, e)(1 - r) } } ], InOut: [ [.455, .03, .515, .955], [.645, .045, .355, 1], [.77, 0, .175, 1], [.86, 0, .07, 1], [.445, .05, .55, .95], [1, 0, 0, 1], [.785, .135, .15, .86], [.68, -.55, .265, 1.55], function (n, e) { return function (r) { return r < .5 ? f(n, e)(2 * r) / 2 : 1 - f(n, e)(-2 * r + 2) / 2 } } ] }, r = { linear: [.25, .25, .75, .75] }, t = function (t) { e[t].forEach(function (e, a) { r["ease" + t + n[a]] = e }) }; for (var a in e) t(a); return r }(); function v(n, e) { if (u.fnc(n)) return n; var r = n.split("(")[0], t = p[r], a = s(n); switch (r) { case "spring": return c(n, e); case "cubicBezier": return i(d, a); case "steps": return i(l, a); default: return u.fnc(t) ? i(t, a) : i(d, t) } } function h(n) { try { return document.querySelectorAll(n) } catch (n) { return } } function g(n, e) { for (var r = n.length, t = arguments.length>= 2 ? arguments[1] : void 0, a = [], o = 0; o < r; o++) if (o in n) { var i = n[o]; e.call(t, i, o, n) && a.push(i) } return a } function m(n) { return n.reduce(function (n, e) { return n.concat(u.arr(e) ? m(e) : e) }, []) } function y(n) { return u.arr(n) ? n : (u.str(n) && (n = h(n) || n), n instanceof NodeList || n instanceof HTMLCollection ? [].slice.call(n) : [n]) } function b(n, e) { return n.some(function (n) { return n === e }) } function x(n) { var e = {}; for (var r in n) e[r] = n[r]; return e } function M(n, e) { var r = x(n); for (var t in n) r[t] = e.hasOwnProperty(t) ? e[t] : n[t]; return r } function w(n, e) { var r = x(n); for (var t in e) r[t] = u.und(n[t]) ? e[t] : n[t]; return r } function k(n) { return u.rgb(n) ? (r = /rgb\((\d+,\s*[\d]+,\s*[\d]+)\)/g.exec(e = n)) ? "rgba(" + r[1] + ",1)" : e : u.hex(n) ? (t = n.replace(/^#?([a-f\d])([a-f\d])([a-f\d])$/i, function (n, e, r, t) { return e + e + r + r + t + t }), a = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(t), "rgba(" + parseInt(a[1], 16) + "," + parseInt(a[2], 16) + "," + parseInt(a[3], 16) + ",1)") : u.hsl(n) ? function (n) { var e, r, t, a = /hsl\((\d+),\s*([\d.]+)%,\s*([\d.]+)%\)/g.exec(n) || /hsla\((\d+),\s*([\d.]+)%,\s*([\d.]+)%,\s*([\d.]+)\)/g.exec(n), o = parseInt(a[1], 10) / 360, i = parseInt(a[2], 10) / 100, u = parseInt(a[3], 10) / 100, s = a[4] || 1; function c(n, e, r) { return r < 0 && (r += 1), r> 1 && (r -= 1), r < 1 / 6 ? n + 6 * (e - n) * r : r < .5 ? e : r < 2 / 3 ? n + (e - n) * (2 / 3 - r) * 6 : n } if (0 == i) e = r = t = u; else { var f = u < .5 ? u * (1 + i) : u + i - u * i, l = 2 * u - f; e = c(l, f, o + 1 / 3), r = c(l, f, o), t = c(l, f, o - 1 / 3) } return "rgba(" + 255 * e + "," + 255 * r + "," + 255 * t + "," + s + ")" }(n) : void 0; var e, r, t, a } function C(n) { var e = /([\+\-]?[0-9#\.]+)(%|px|pt|em|rem|in|cm|mm|ex|ch|pc|vw|vh|vmin|vmax|deg|rad|turn)?$/.exec(n); if (e) return e[2] } function O(n, e) { return u.fnc(n) ? n(e.target, e.id, e.total) : n } function P(n, e) { return n.getAttribute(e) } function I(n, e, r) { if (b([r, "deg", "rad", "turn"], C(e))) return e; var a = t.CSS[e + r]; if (!u.und(a)) return a; var o = document.createElement(n.tagName), i = n.parentNode && n.parentNode !== document ? n.parentNode : document.body; i.appendChild(o), o.style.position = "absolute", o.style.width = 100 + r; var s = 100 / o.offsetWidth; i.removeChild(o); var c = s * parseFloat(e); return t.CSS[e + r] = c, c } function B(n, e, r) { if (e in n.style) { var t = e.replace(/([a-z])([A-Z])/g, "1ドル-2ドル").toLowerCase(), a = n.style[e] || getComputedStyle(n).getPropertyValue(t) || "0"; return r ? I(n, a, r) : a } } function D(n, e) { return u.dom(n) && !u.inp(n) && (P(n, e) || u.svg(n) && n[e]) ? "attribute" : u.dom(n) && b(r, e) ? "transform" : u.dom(n) && "transform" !== e && B(n, e) ? "css" : null != n[e] ? "object" : void 0 } function T(n) { if (u.dom(n)) { for (var e, r = n.style.transform || "", t = /(\w+)\(([^)]*)\)/g, a = new Map; e = t.exec(r);) a.set(e[1], e[2]); return a } } function F(n, e, r, t) { var a, i = o(e, "scale") ? 1 : 0 + (o(a = e, "translate") || "perspective" === a ? "px" : o(a, "rotate") || o(a, "skew") ? "deg" : void 0), u = T(n).get(e) || i; return r && (r.transforms.list.set(e, u), r.transforms.last = e), t ? I(n, u, t) : u } function N(n, e, r, t) { switch (D(n, e)) { case "transform": return F(n, e, t, r); case "css": return B(n, e, r); case "attribute": return P(n, e); default: return n[e] || 0 } } function A(n, e) { var r = /^(\*=|\+=|-=)/.exec(n); if (!r) return n; var t = C(n) || 0, a = parseFloat(e), o = parseFloat(n.replace(r[0], "")); switch (r[0][0]) { case "+": return a + o + t; case "-": return a - o + t; case "*": return a * o + t } } function E(n, e) { if (u.col(n)) return k(n); var r = C(n), t = r ? n.substr(0, n.length - r.length) : n; return e && !/\s/g.test(n) ? t + e : t } function L(n, e) { return Math.sqrt(Math.pow(e.x - n.x, 2) + Math.pow(e.y - n.y, 2)) } function S(n) { for (var e, r = n.points, t = 0, a = 0; a < r.numberOfItems; a++) { var o = r.getItem(a); a> 0 && (t += L(e, o)), e = o
}
return t
}
function j(n) {
if (n.getTotalLength) return n.getTotalLength();
switch (n.tagName.toLowerCase()) {
case "circle":
return o = n, 2 * Math.PI * P(o, "r");
case "rect":
return 2 * P(a = n, "width") + 2 * P(a, "height");
case "line":
return L({
x: P(t = n, "x1"),
y: P(t, "y1")
}, {
x: P(t, "x2"),
y: P(t, "y2")
});
case "polyline":
return S(n);
case "polygon":
return r = (e = n).points, S(e) + L(r.getItem(r.numberOfItems - 1), r.getItem(0))
}
var e, r, t, a, o
}
function q(n, e) {
var r = e || {},
t = r.el || function (n) {
for (var e = n.parentNode; u.svg(e) && (e = e.parentNode, u.svg(e.parentNode)););
return e
}(n),
a = t.getBoundingClientRect(),
o = P(t, "viewBox"),
i = a.width,
s = a.height,
c = r.viewBox || (o ? o.split(" ") : [0, 0, i, s]);
return {
el: t,
viewBox: c,
x: c[0] / 1,
y: c[1] / 1,
w: i / c[2],
h: s / c[3]
}
}
function $(n, e) {
function r(r) {
void 0 === r && (r = 0);
var t = e + r>= 1 ? e + r : 0;
return n.el.getPointAtLength(t)
}
var t = q(n.el, n.svg),
a = r(),
o = r(-1),
i = r(1);
switch (n.property) {
case "x":
return (a.x - t.x) * t.w;
case "y":
return (a.y - t.y) * t.h;
case "angle":
return 180 * Math.atan2(i.y - o.y, i.x - o.x) / Math.PI
}
}
function X(n, e) {
var r = /-?\d*\.?\d+/g,
t = E(u.pth(n) ? n.totalLength : n, e) + "";
return {
original: t,
numbers: t.match(r) ? t.match(r).map(Number) : [0],
strings: u.str(n) || e ? t.split(r) : []
}
}
function Y(n) {
return g(n ? m(u.arr(n) ? n.map(y) : y(n)) : [], function (n, e, r) {
return r.indexOf(n) === e
})
}
function Z(n) {
var e = Y(n);
return e.map(function (n, r) {
return {
target: n,
id: r,
total: e.length,
transforms: {
list: T(n)
}
}
})
}
function Q(n, e) {
var r = x(e);
if (/^spring/.test(r.easing) && (r.duration = c(r.easing)), u.arr(n)) {
var t = n.length;
2 === t && !u.obj(n[0]) ? n = {
value: n
} : u.fnc(e.duration) || (r.duration = e.duration / t)
}
var a = u.arr(n) ? n : [n];
return a.map(function (n, r) {
var t = u.obj(n) && !u.pth(n) ? n : {
value: n
};
return u.und(t.delay) && (t.delay = r ? 0 : e.delay), u.und(t.endDelay) && (t.endDelay = r === a.length - 1 ? e.endDelay : 0), t
}).map(function (n) {
return w(n, r)
})
}
function V(n, e) {
var r = [],
t = e.keyframes;
for (var a in t && (e = w(function (n) {
for (var e = g(m(n.map(function (n) {
return Object.keys(n)
})), function (n) {
return u.key(n)
}).reduce(function (n, e) {
return n.indexOf(e) < 0 && n.push(e), n }, []), r = {}, t = function (t) { var a = e[t]; r[a] = n.map(function (n) { var e = {}; for (var r in n) u.key(r) ? r == a && (e.value = n[r]) : e[r] = n[r]; return e }) }, a = 0; a < e.length; a++) t(a); return r }(t), e)), e) u.key(a) && r.push({ name: a, tweens: Q(e[a], n) }); return r } function z(n, e) { var r; return n.tweens.map(function (t) { var a = function (n, e) { var r = {}; for (var t in n) { var a = O(n[t], e); u.arr(a) && 1 === (a = a.map(function (n) { return O(n, e) })).length && (a = a[0]), r[t] = a } return r.duration = parseFloat(r.duration), r.delay = parseFloat(r.delay), r }(t, e), o = a.value, i = u.arr(o) ? o[1] : o, s = C(i), c = N(e.target, n.name, s, e), f = r ? r.to.original : c, l = u.arr(o) ? o[0] : f, d = C(l) || C(c), p = s || d; return u.und(i) && (i = f), a.from = X(l, p), a.to = X(A(i, l), p), a.start = r ? r.end : 0, a.end = a.start + a.delay + a.duration + a.endDelay, a.easing = v(a.easing, a.duration), a.isPath = u.pth(o), a.isColor = u.col(a.from.original), a.isColor && (a.round = 1), r = a, a }) } var H = { css: function (n, e, r) { return n.style[e] = r }, attribute: function (n, e, r) { return n.setAttribute(e, r) }, object: function (n, e, r) { return n[e] = r }, transform: function (n, e, r, t, a) { if (t.list.set(e, r), e === t.last || a) { var o = ""; t.list.forEach(function (n, e) { o += e + "(" + n + ") " }), n.style.transform = o } } }; function G(n, e) { Z(n).forEach(function (n) { for (var r in e) { var t = O(e[r], n), a = n.target, o = C(t), i = N(a, r, o, n), u = A(E(t, o || C(i)), i), s = D(a, r); H[s](a, r, u, n.transforms, !0) } }) } function R(n, e) { return g(m(n.map(function (n) { return e.map(function (e) { return function (n, e) { var r = D(n.target, e.name); if (r) { var t = z(e, n), a = t[t.length - 1]; return { type: r, property: e.name, animatable: n, tweens: t, duration: a.end, delay: t[0].delay, endDelay: a.endDelay } } }(n, e) }) })), function (n) { return !u.und(n) }) } function W(n, e) { var r = n.length, t = function (n) { return n.timelineOffset ? n.timelineOffset : 0 }, a = {}; return a.duration = r ? Math.max.apply(Math, n.map(function (n) { return t(n) + n.duration })) : e.duration, a.delay = r ? Math.min.apply(Math, n.map(function (n) { return t(n) + n.delay })) : e.delay, a.endDelay = r ? a.duration - Math.max.apply(Math, n.map(function (n) { return t(n) + n.duration - n.endDelay })) : e.endDelay, a } var J = 0; var K, U = [], _ = [], nn = function () { function n() { K = requestAnimationFrame(e) } function e(e) { var r = U.length; if (r) { for (var t = 0; t < r;) { var a = U[t]; if (a.paused) { var o = U.indexOf(a); o> -1 && (U.splice(o, 1), r = U.length)
} else a.tick(e);
t++
}
n()
} else K = cancelAnimationFrame(K)
}
return n
}();
function en(r) {
void 0 === r && (r = {});
var t, o = 0,
i = 0,
u = 0,
s = 0,
c = null;
function f(n) {
var e = window.Promise && new Promise(function (n) {
return c = n
});
return n.finished = e, e
}
var l, d, p, v, h, m, y, b, x = (d = M(n, l = r), p = M(e, l), v = V(p, l), h = Z(l.targets), m = R(h, v), y = W(m, p), b = J, J++, w(d, {
id: b,
children: [],
animatables: h,
animations: m,
duration: y.duration,
delay: y.delay,
endDelay: y.endDelay
}));
f(x);
function k() {
var n = x.direction;
"alternate" !== n && (x.direction = "normal" !== n ? "normal" : "reverse"), x.reversed = !x.reversed, t.forEach(function (n) {
return n.reversed = x.reversed
})
}
function C(n) {
return x.reversed ? x.duration - n : n
}
function O() {
o = 0, i = C(x.currentTime) * (1 / en.speed)
}
function P(n, e) {
e && e.seek(n - e.timelineOffset)
}
function I(n) {
for (var e = 0, r = x.animations, t = r.length; e < t;) { var o = r[e], i = o.animatable, u = o.tweens, s = u.length - 1, c = u[s]; s && (c = g(u, function (e) { return n < e.end })[0] || c); for (var f = a(n - c.start - c.delay, 0, c.duration) / c.duration, l = isNaN(f) ? 1 : c.easing(f), d = c.to.strings, p = c.round, v = [], h = c.to.numbers.length, m = void 0, y = 0; y < h; y++) { var b = void 0, M = c.to.numbers[y], w = c.from.numbers[y] || 0; b = c.isPath ? $(c.value, l * M) : w + l * (M - w), p && (c.isColor && y> 2 || (b = Math.round(b * p) / p)), v.push(b)
}
var k = d.length;
if (k) {
m = d[0];
for (var C = 0; C < k; C++) { d[C]; var O = d[C + 1], P = v[C]; isNaN(P) || (m += O ? P + O : P + " ") } } else m = v[0]; H[o.type](i.target, o.property, m, i.transforms), o.currentValue = m, e++ } } function B(n) { x[n] && !x.passThrough && x[n](x) } function D(n) { var e = x.duration, r = x.delay, l = e - x.endDelay, d = C(n); x.progress = a(d / e * 100, 0, 100), x.reversePlayback = d < x.currentTime, t && function (n) { if (x.reversePlayback) for (var e = s; e--;) P(n, t[e]); else for (var r = 0; r < s; r++) P(n, t[r]) }(d), !x.began && x.currentTime> 0 && (x.began = !0, B("begin"), B("loopBegin")), d <= r && 0 !== x.currentTime && I(0), (d>= l && x.currentTime !== e || !e) && I(e), d> r && d < l ? (x.changeBegan || (x.changeBegan = !0, x.changeCompleted = !1, B("changeBegin")), B("change"), I(d)) : x.changeBegan && (x.changeCompleted = !0, x.changeBegan = !1, B("changeComplete")), x.currentTime = a(d, 0, e), x.began && B("update"), n>= e && (i = 0, x.remaining && !0 !== x.remaining && x.remaining--, x.remaining ? (o = u, B("loopComplete"), B("loopBegin"), "alternate" === x.direction && k()) : (x.paused = !0, x.completed || (x.completed = !0, B("loopComplete"), B("complete"), !x.passThrough && "Promise" in window && (c(), f(x)))))
}
return x.reset = function () {
var n = x.direction;
x.passThrough = !1, x.currentTime = 0, x.progress = 0, x.paused = !0, x.began = !1, x.changeBegan = !1, x.completed = !1, x.changeCompleted = !1, x.reversePlayback = !1, x.reversed = "reverse" === n, x.remaining = x.loop, t = x.children;
for (var e = s = t.length; e--;) x.children[e].reset();
(x.reversed && !0 !== x.loop || "alternate" === n && 1 === x.loop) && x.remaining++, I(0)
}, x.set = function (n, e) {
return G(n, e), x
}, x.tick = function (n) {
u = n, o || (o = u), D((u + (i - o)) * en.speed)
}, x.seek = function (n) {
D(C(n))
}, x.pause = function () {
x.paused = !0, O()
}, x.play = function () {
x.paused && (x.completed && x.reset(), x.paused = !1, U.push(x), O(), K || nn())
}, x.reverse = function () {
k(), O()
}, x.restart = function () {
x.reset(), x.play()
}, x.reset(), x.autoplay && x.play(), x
}
function rn(n, e) {
for (var r = e.length; r--;) b(n, e[r].animatable.target) && e.splice(r, 1)
}
return "undefined" != typeof document && document.addEventListener("visibilitychange", function () {
document.hidden ? (U.forEach(function (n) {
return n.pause()
}), _ = U.slice(0), U = []) : _.forEach(function (n) {
return n.play()
})
}), en.version = "3.0.1", en.speed = 1, en.running = U, en.remove = function (n) {
for (var e = Y(n), r = U.length; r--;) {
var t = U[r],
a = t.animations,
o = t.children;
rn(e, a);
for (var i = o.length; i--;) {
var u = o[i],
s = u.animations;
rn(e, s), s.length || u.children.length || o.splice(i, 1)
}
a.length || o.length || t.pause()
}
}, en.get = N, en.set = G, en.convertPx = I, en.path = function (n, e) {
var r = u.str(n) ? h(n)[0] : n,
t = e || 100;
return function (n) {
return {
property: n,
el: r,
svg: q(r),
totalLength: j(r) * (t / 100)
}
}
}, en.setDashoffset = function (n) {
var e = j(n);
return n.setAttribute("stroke-dasharray", e), e
}, en.stagger = function (n, e) {
void 0 === e && (e = {});
var r = e.direction || "normal",
t = e.easing ? v(e.easing) : null,
a = e.grid,
o = e.axis,
i = e.from || 0,
s = "first" === i,
c = "center" === i,
f = "last" === i,
l = u.arr(n),
d = l ? parseFloat(n[0]) : parseFloat(n),
p = l ? parseFloat(n[1]) : 0,
h = C(l ? n[1] : n) || 0,
g = e.start || 0 + (l ? d : 0),
m = [],
y = 0;
return function (n, e, u) {
if (s && (i = 0), c && (i = (u - 1) / 2), f && (i = u - 1), !m.length) {
for (var v = 0; v < u; v++) { if (a) { var b = c ? (a[0] - 1) / 2 : i % a[0], x = c ? (a[1] - 1) / 2 : Math.floor(i / a[0]), M = b - v % a[0], w = x - Math.floor(v / a[0]), k = Math.sqrt(M * M + w * w); "x" === o && (k = -M), "y" === o && (k = -w), m.push(k) } else m.push(Math.abs(i - v)); y = Math.max.apply(Math, m) } t && (m = m.map(function (n) { return t(n / y) * y })), "reverse" === r && (m = m.map(function (n) { return o ? n < 0 ? -1 * n : -n : Math.abs(y - n) })) } return g + (l ? (p - d) / y : d) * (Math.round(100 * m[e]) / 100) + h } }, en.timeline = function (n) { void 0 === n && (n = {}); var r = en(n); return r.duration = 0, r.add = function (t, a) { var o = U.indexOf(r), i = r.children; function s(n) { n.passThrough = !0 } o> -1 && U.splice(o, 1);
for (var c = 0; c < i.length; c++) s(i[c]); var f = w(t, M(e, n)); f.targets = f.targets || n.targets; var l = r.duration; f.autoplay = !1, f.direction = r.direction, f.timelineOffset = u.und(a) ? l : A(a, l), s(r), r.seek(f.timelineOffset); var d = en(f); s(d), i.push(d); var p = W(i, n); return r.delay = p.delay, r.endDelay = p.endDelay, r.duration = p.duration, r.seek(0), r.reset(), r.autoplay && r.play(), r }, r }, en.easing = v, en.penner = p, en.random = function (n, e) { return Math.floor(Math.random() * (e - n + 1)) + n }, en }); ! function (t) { "use strict"; t.fn.countUp = function (e) { var a = t.extend({ time: 2e3, delay: 100 }, e); return this.each(function () { var e = t(this), n = a, u = function () { e.data("counterupTo") || e.data("counterupTo", e.text()); var t = parseInt(e.data("counter-time"))> 0 ? parseInt(e.data("counter-time")) : n
.time,
a = parseInt(e.data("counter-delay"))> 0 ? parseInt(e.data("counter-delay")) : n
.delay,
u = t / a,
r = e.data("counterupTo"),
o = [r],
c = /[0-9]+,[0-9]+/.test(r);
r = r.replace(/,/g, "");
for (var d = (/^[0-9]+$/.test(r), /^[0-9]+\.[0-9]+$/.test(r)), s = d ? (r.split(".")[
1] || []).length : 0, i = u; i>= 1; i--) {
var p = parseInt(Math.round(r / u * i));
if (d && (p = parseFloat(r / u * i).toFixed(s)), c)
for (;
/(\d+)(\d{3})/.test(p.toString());) p = p.toString().replace(/(\d+)(\d{3})/,
"1,ドル2ドル");
o.unshift(p)
}
e.data("counterup-nums", o), e.text("0");
var f = function () {
e.text(e.data("counterup-nums").shift()), e.data("counterup-nums").length ?
setTimeout(e.data("counterup-func"), a) : (delete e.data("counterup-nums"),
e.data("counterup-nums", null), e.data("counterup-func", null))
};
e.data("counterup-func", f), setTimeout(e.data("counterup-func"), a)
};
e.waypoint(u, {
offset: "100%",
triggerOnce: !0
})
})
}
}(jQuery);
/*!
Waypoints - 4.0.0
Copyright 2011-2015 Caleb Troughton
Licensed under the MIT license.
https://github.com/imakewebthings/waypoints/blob/master/licenses.txt
*/
! function () {
"use strict";
function t(o) {
if (!o) throw new Error("No options passed to Waypoint constructor");
if (!o.element) throw new Error("No element option passed to Waypoint constructor");
if (!o.handler) throw new Error("No handler option passed to Waypoint constructor");
this.key = "waypoint-" + e, this.options = t.Adapter.extend({}, t.defaults, o), this.element = this.options.element, this.adapter = new t.Adapter(this.element), this.callback = o.handler, this.axis = this.options.horizontal ? "horizontal" : "vertical", this.enabled = this.options.enabled, this.triggerPoint = null, this.group = t.Group.findOrCreate({
name: this.options.group,
axis: this.axis
}), this.context = t.Context.findOrCreateByElement(this.options.context), t.offsetAliases[this.options.offset] && (this.options.offset = t.offsetAliases[this.options.offset]), this.group.add(this), this.context.add(this), i[this.key] = this, e += 1
}
var e = 0,
i = {};
t.prototype.queueTrigger = function (t) {
this.group.queueTrigger(this, t)
}, t.prototype.trigger = function (t) {
this.enabled && this.callback && this.callback.apply(this, t)
}, t.prototype.destroy = function () {
this.context.remove(this), this.group.remove(this), delete i[this.key]
}, t.prototype.disable = function () {
return this.enabled = !1, this
}, t.prototype.enable = function () {
return this.context.refresh(), this.enabled = !0, this
}, t.prototype.next = function () {
return this.group.next(this)
}, t.prototype.previous = function () {
return this.group.previous(this)
}, t.invokeAll = function (t) {
var e = [];
for (var o in i) e.push(i[o]);
for (var n = 0, r = e.length; r> n; n++) e[n][t]()
}, t.destroyAll = function () {
t.invokeAll("destroy")
}, t.disableAll = function () {
t.invokeAll("disable")
}, t.enableAll = function () {
t.invokeAll("enable")
}, t.refreshAll = function () {
t.Context.refreshAll()
}, t.viewportHeight = function () {
return window.innerHeight || document.documentElement.clientHeight
}, t.viewportWidth = function () {
return document.documentElement.clientWidth
}, t.adapters = [], t.defaults = {
context: window,
continuous: !0,
enabled: !0,
group: "default",
horizontal: !1,
offset: 0
}, t.offsetAliases = {
"bottom-in-view": function () {
return this.context.innerHeight() - this.adapter.outerHeight()
},
"right-in-view": function () {
return this.context.innerWidth() - this.adapter.outerWidth()
}
}, window.Waypoint = t
}(),
function () {
"use strict";
function t(t) {
window.setTimeout(t, 1e3 / 60)
}
function e(t) {
this.element = t, this.Adapter = n.Adapter, this.adapter = new this.Adapter(t), this.key = "waypoint-context-" + i, this.didScroll = !1, this.didResize = !1, this.oldScroll = {
x: this.adapter.scrollLeft(),
y: this.adapter.scrollTop()
}, this.waypoints = {
vertical: {},
horizontal: {}
}, t.waypointContextKey = this.key, o[t.waypointContextKey] = this, i += 1, this.createThrottledScrollHandler(), this.createThrottledResizeHandler()
}
var i = 0,
o = {},
n = window.Waypoint,
r = window.onload;
e.prototype.add = function (t) {
var e = t.options.horizontal ? "horizontal" : "vertical";
this.waypoints[e][t.key] = t, this.refresh()
}, e.prototype.checkEmpty = function () {
var t = this.Adapter.isEmptyObject(this.waypoints.horizontal),
e = this.Adapter.isEmptyObject(this.waypoints.vertical);
t && e && (this.adapter.off(".waypoints"), delete o[this.key])
}, e.prototype.createThrottledResizeHandler = function () {
function t() {
e.handleResize(), e.didResize = !1
}
var e = this;
this.adapter.on("resize.waypoints", function () {
e.didResize || (e.didResize = !0, n.requestAnimationFrame(t))
})
}, e.prototype.createThrottledScrollHandler = function () {
function t() {
e.handleScroll(), e.didScroll = !1
}
var e = this;
this.adapter.on("scroll.waypoints", function () {
(!e.didScroll || n.isTouch) && (e.didScroll = !0, n.requestAnimationFrame(t))
})
}, e.prototype.handleResize = function () {
n.Context.refreshAll()
}, e.prototype.handleScroll = function () {
var t = {},
e = {
horizontal: {
newScroll: this.adapter.scrollLeft(),
oldScroll: this.oldScroll.x,
forward: "right",
backward: "left"
},
vertical: {
newScroll: this.adapter.scrollTop(),
oldScroll: this.oldScroll.y,
forward: "down",
backward: "up"
}
};
for (var i in e) {
var o = e[i],
n = o.newScroll> o.oldScroll,
r = n ? o.forward : o.backward;
for (var s in this.waypoints[i]) {
var a = this.waypoints[i][s],
l = o.oldScroll < a.triggerPoint, h = o.newScroll>= a.triggerPoint,
p = l && h,
u = !l && !h;
(p || u) && (a.queueTrigger(r), t[a.group.id] = a.group)
}
}
for (var c in t) t[c].flushTriggers();
this.oldScroll = {
x: e.horizontal.newScroll,
y: e.vertical.newScroll
}
}, e.prototype.innerHeight = function () {
return this.element == this.element.window ? n.viewportHeight() : this.adapter.innerHeight()
}, e.prototype.remove = function (t) {
delete this.waypoints[t.axis][t.key], this.checkEmpty()
}, e.prototype.innerWidth = function () {
return this.element == this.element.window ? n.viewportWidth() : this.adapter.innerWidth()
}, e.prototype.destroy = function () {
var t = [];
for (var e in this.waypoints)
for (var i in this.waypoints[e]) t.push(this.waypoints[e][i]);
for (var o = 0, n = t.length; n> o; o++) t[o].destroy()
}, e.prototype.refresh = function () {
var t, e = this.element == this.element.window,
i = e ? void 0 : this.adapter.offset(),
o = {};
this.handleScroll(), t = {
horizontal: {
contextOffset: e ? 0 : i.left,
contextScroll: e ? 0 : this.oldScroll.x,
contextDimension: this.innerWidth(),
oldScroll: this.oldScroll.x,
forward: "right",
backward: "left",
offsetProp: "left"
},
vertical: {
contextOffset: e ? 0 : i.top,
contextScroll: e ? 0 : this.oldScroll.y,
contextDimension: this.innerHeight(),
oldScroll: this.oldScroll.y,
forward: "down",
backward: "up",
offsetProp: "top"
}
};
for (var r in t) {
var s = t[r];
for (var a in this.waypoints[r]) {
var l, h, p, u, c, d = this.waypoints[r][a],
f = d.options.offset,
w = d.triggerPoint,
y = 0,
g = null == w;
d.element !== d.element.window && (y = d.adapter.offset()[s.offsetProp]), "function" == typeof f ? f = f.apply(d) : "string" == typeof f && (f = parseFloat(f), d.options.offset.indexOf("%")> -1 && (f = Math.ceil(s.contextDimension * f / 100))), l = s.contextScroll - s.contextOffset, d.triggerPoint = y + l - f, h = w < s.oldScroll, p = d.triggerPoint>= s.oldScroll, u = h && p, c = !h && !p, !g && u ? (d.queueTrigger(s.backward), o[d.group.id] = d.group) : !g && c ? (d.queueTrigger(s.forward), o[d.group.id] = d.group) : g && s.oldScroll>= d.triggerPoint && (d.queueTrigger(s.forward), o[d.group.id] = d.group)
}
}
return n.requestAnimationFrame(function () {
for (var t in o) o[t].flushTriggers()
}), this
}, e.findOrCreateByElement = function (t) {
return e.findByElement(t) || new e(t)
}, e.refreshAll = function () {
for (var t in o) o[t].refresh()
}, e.findByElement = function (t) {
return o[t.waypointContextKey]
}, window.onload = function () {
r && r(), e.refreshAll()
}, n.requestAnimationFrame = function (e) {
var i = window.requestAnimationFrame || window.mozRequestAnimationFrame || window.webkitRequestAnimationFrame || t;
i.call(window, e)
}, n.Context = e
}(),
function () {
"use strict";
function t(t, e) {
return t.triggerPoint - e.triggerPoint
}
function e(t, e) {
return e.triggerPoint - t.triggerPoint
}
function i(t) {
this.name = t.name, this.axis = t.axis, this.id = this.name + "-" + this.axis, this.waypoints = [], this.clearTriggerQueues(), o[this.axis][this.name] = this
}
var o = {
vertical: {},
horizontal: {}
},
n = window.Waypoint;
i.prototype.add = function (t) {
this.waypoints.push(t)
}, i.prototype.clearTriggerQueues = function () {
this.triggerQueues = {
up: [],
down: [],
left: [],
right: []
}
}, i.prototype.flushTriggers = function () {
for (var i in this.triggerQueues) {
var o = this.triggerQueues[i],
n = "up" === i || "left" === i;
o.sort(n ? e : t);
for (var r = 0, s = o.length; s> r; r += 1) {
var a = o[r];
(a.options.continuous || r === o.length - 1) && a.trigger([i])
}
}
this.clearTriggerQueues()
}, i.prototype.next = function (e) {
this.waypoints.sort(t);
var i = n.Adapter.inArray(e, this.waypoints),
o = i === this.waypoints.length - 1;
return o ? null : this.waypoints[i + 1]
}, i.prototype.previous = function (e) {
this.waypoints.sort(t);
var i = n.Adapter.inArray(e, this.waypoints);
return i ? this.waypoints[i - 1] : null
}, i.prototype.queueTrigger = function (t, e) {
this.triggerQueues[e].push(t)
}, i.prototype.remove = function (t) {
var e = n.Adapter.inArray(t, this.waypoints);
e> -1 && this.waypoints.splice(e, 1)
}, i.prototype.first = function () {
return this.waypoints[0]
}, i.prototype.last = function () {
return this.waypoints[this.waypoints.length - 1]
}, i.findOrCreate = function (t) {
return o[t.axis][t.name] || new i(t)
}, n.Group = i
}(),
function () {
"use strict";
function t(t) {
this.$element = e(t)
}
var e = window.jQuery,
i = window.Waypoint;
e.each(["innerHeight", "innerWidth", "off", "offset", "on", "outerHeight", "outerWidth", "scrollLeft", "scrollTop"], function (e, i) {
t.prototype[i] = function () {
var t = Array.prototype.slice.call(arguments);
return this.$element[i].apply(this.$element, t)
}
}), e.each(["extend", "inArray", "isEmptyObject"], function (i, o) {
t[o] = e[o]
}), i.adapters.push({
name: "jquery",
Adapter: t
}), i.Adapter = t
}(),
function () {
"use strict";
function t(t) {
return function () {
var i = [],
o = arguments[0];
return t.isFunction(arguments[0]) && (o = t.extend({}, arguments[1]), o.handler = arguments[0]), this.each(function () {
var n = t.extend({}, o, {
element: this
});
"string" == typeof n.context && (n.context = t(this).closest(n.context)[0]), i.push(new e(n))
}), i
}
}
var e = window.Waypoint;
window.jQuery && (window.jQuery.fn.waypoint = t(window.jQuery)), window.Zepto && (window.Zepto.fn.waypoint = t(window.Zepto))
}();
(function () {
var MutationObserver, Util, WeakMap, getComputedStyle, getComputedStyleRX, __bind = function (fn, me) {
return function () {
return fn.apply(me, arguments);
};
},
__indexOf = [].indexOf || function (item) {
for (var i = 0, l = this.length; i < l; i++) { if (i in this && this[i] === item) return i; } return -1; }; Util = (function () { function Util() {} Util.prototype.extend = function (custom, defaults) { var key, value; for (key in defaults) { value = defaults[key]; if (custom[key] == null) { custom[key] = value; } } return custom; }; Util.prototype.isMobile = function (agent) { return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(agent); }; Util.prototype.addEvent = function (elem, event, fn) { if (elem.addEventListener != null) { return elem.addEventListener(event, fn, false); } else if (elem.attachEvent != null) { return elem.attachEvent("on" + event, fn); } else { return elem[event] = fn; } }; Util.prototype.removeEvent = function (elem, event, fn) { if (elem.removeEventListener != null) { return elem.removeEventListener(event, fn, false); } else if (elem.detachEvent != null) { return elem.detachEvent("on" + event, fn); } else { return delete elem[event]; } }; Util.prototype.innerHeight = function () { if ('innerundefined" && console !== null) { console.warn('MutationObserver is not supported by your browser.'); } if (typeof console !== "undefined" && console !== null) { console.warn('WOW.js cannot detect dom mutations, please call .sync() after loading new content.'); } } MutationObserver.notSupported = true; MutationObserver.prototype.observe = function () {}; return MutationObserver; })()); getComputedStyle = this.getComputedStyle || function (el, pseudo) { this.getPropertyValue = function (prop) { var _ref; if (prop === 'float') { prop = 'styleFloat'; } if (getComputedStyleRX.test(prop)) { prop.replace(getComputedStyleRX, function (_, _char) { return _char.toUpperCase(); }); } return ((_ref = el.currentStyle) != null ? _ref[prop] : void 0) || null; }; return this; }; getComputedStyleRX = /(\-([a-z]){1})/g; this.WOW = (function () { WOW.prototype.defaults = { boxClass: 'wow', animateClass: 'animated animate__animated', offset: 0, mobile: true, live: true }; function WOW(options) { if (options == null) { options = {}; } this.scrollCallback = __bind(this.scrollCallback, this); this.scrollHandler = __bind(this.scrollHandler, this); this.start = __bind(this.start, this); this.scrolled = true; this.config = this.util().extend(options, this.defaults); this.animationNameCache = new WeakMap(); } WOW.prototype.init = function () { var _ref; this.element = window.document.documentElement; if ((_ref = document.readyState) === "interactive" || _ref === "complete") { this.start(); } else { this.util().addEvent(document, 'DOMContentLoaded', this.start); } return this.finished = []; }; WOW.prototype.start = function () { var box, _i, _len, _ref; this.stopped = false; this.boxes = (function () { var _i, _len, _ref, _results; _ref = this.element.querySelectorAll("." + this.config.boxClass); _results = []; for (_i = 0, _len = _ref.length; _i < _len; _i++) { box = _ref[_i]; _results.push(box); } return _results; }).call(this); this.all = (function () { var _i, _len, _ref, _results; _ref = this.boxes; _results = []; for (_i = 0, _len = _ref.length; _i < _len; _i++) { box = _ref[_i]; _results.push(box); } return _results; }).call(this); if (this.boxes.length) { if (this.disabled()) { this.resetStyle(); } else { _ref = this.boxes; for (_i = 0, _len = _ref.length; _i < _len; _i++) { box = _ref[_i]; this.applyStyle(box, true); } } } if (!this.disabled()) { this.util().addEvent(window, 'scroll', this.scrollHandler); this.util().addEvent(window, 'resize', this.scrollHandler); this.interval = setInterval(this.scrollCallback, 50); } if (this.config.live) { return new MutationObserver((function (_this) { return function (records) { var node, record, _j, _len1, _results; _results = []; for (_j = 0, _len1 = records.length; _j < _len1; _j++) { record = records[_j]; _results.push((function () { var _k, _len2, _ref1, _results1; _ref1 = record.addedNodes || []; _results1 = []; for (_k = 0, _len2 = _ref1.length; _k < _len2; _k++) { node = _ref1[_k]; _results1.push(this.doSync(node)); } return _results1; }).call(_this)); } return _results; }; })(this)).observe(document.body, { childList: true, subtree: true }); } }; WOW.prototype.stop = function () { this.stopped = true; this.util().removeEvent(window, 'scroll', this.scrollHandler); this.util().removeEvent(window, 'resize', this.scrollHandler); if (this.interval != null) { return clearInterval(this.interval); } }; WOW.prototype.sync = function (element) { if (MutationObserver.notSupported) { return this.doSync(this.element); } }; WOW.prototype.doSync = function (element) { var box, _i, _len, _ref, _results; if (element == null) { element = this.element; } if (element.nodeType !== 1) { return; } element = element.parentNode || element; _ref = element.querySelectorAll("." + this.config.boxClass); _results = []; for (_i = 0, _len = _ref.length; _i < _len; _i++) { box = _ref[_i]; if (__indexOf.call(this.all, box) < 0) { this.boxes.push(box); this.all.push(box); if (this.stopped || this.disabled()) { this.resetStyle(); } else { this.applyStyle(box, true); } _results.push(this.scrolled = true); } else { _results.push(void 0); } } return _results; }; WOW.prototype.show = function (box) { this.applyStyle(box); return box.className = "" + box.className + " " + this.config.animateClass; }; WOW.prototype.applyStyle = function (box, hidden) { var delay, duration, iteration; duration = box.getAttribute('data-wow-duration'); delay = box.getAttribute('data-wow-delay'); iteration = box.getAttribute('data-wow-iteration'); return this.animate((function (_this) { return function () { return _this.customStyle(box, hidden, duration, delay, iteration); }; })(this)); }; WOW.prototype.animate = (function () { if ('requestAnimationFrame' in window) { return function (callback) { return window.requestAnimationFrame(callback); }; } else { return function (callback) { return callback(); }; } })(); WOW.prototype.resetStyle = function () { var box, _i, _len, _ref, _results; _ref = this.boxes; _results = []; for (_i = 0, _len = _ref.length; _i < _len; _i++) { box = _ref[_i]; _results.push(box.style.visibility = 'visible'); } return _results; }; WOW.prototype.customStyle = function (box, hidden, duration, delay, iteration) { if (hidden) { this.cacheAnimationName(box); } box.style.visibility = hidden ? 'hidden' : 'visible'; if (duration) { this.vendorSet(box.style, { animationDuration: duration }); } if (delay) { this.vendorSet(box.style, { animationDelay: delay }); } if (iteration) { this.vendorSet(box.style, { animationIterationCount: iteration }); } this.vendorSet(box.style, { animationName: hidden ? 'none' : this.cachedAnimationName(box) }); return box; }; WOW.prototype.vendors = ["moz", "webkit"]; WOW.prototype.vendorSet = function (elem, properties) { var name, value, vendor, _results; _results = []; for (name in properties) { value = properties[name]; elem["" + name] = value; _results.push((function () { var _i, _len, _ref, _results1; _ref = this.vendors; _results1 = []; for (_i = 0, _len = _ref.length; _i < _len; _i++) { vendor = _ref[_i]; _results1.push(elem["" + vendor + (name.charAt(0).toUpperCase()) + (name.substr(1))] = value); } return _results1; }).call(this)); } return _results; }; WOW.prototype.vendorCSS = function (elem, property) { var result, style, vendor, _i, _len, _ref; style = getComputedStyle(elem); result = style.getPropertyCSSValue(property); _ref = this.vendors; for (_i = 0, _len = _ref.length; _i < _len; _i++) { vendor = _ref[_i]; result = result || style.getPropertyCSSValue("-" + vendor + "-" + property); } return result; }; WOW.prototype.animationName = function (box) { var animationName; try { animationName = this.vendorCSS(box, 'animation-name').cssText; } catch (_error) { animationName = getComputedStyle(box).getPropertyValue('animation-name'); } if (animationName === 'none') { return ''; } else { return animationName; } }; WOW.prototype.cacheAnimationName = function (box) { return this.animationNameCache.set(box, this.animationName(box)); }; WOW.prototype.cachedAnimationName = function (box) { return this.animationNameCache.get(box); }; WOW.prototype.scrollHandler = function () { return this.scrolled = true; }; WOW.prototype.scrollCallback = function () { var box; if (this.scrolled) { this.scrolled = false; this.boxes = (function () { var _i, _len, _ref, _results; _ref = this.boxes; _results = []; for (_i = 0, _len = _ref.length; _i < _len; _i++) { box = _ref[_i]; if (!(box)) { continue; } if (this.isVisible(box)) { this.show(box); continue; } _results.push(box); } return _results; }).call(this); if (!(this.boxes.length || this.config.live)) { return this.stop(); } } }; WOW.prototype.offsetTop = function (element) { var top; while (element.offsetTop === void 0) { element = element.parentNode; } top = element.offsetTop; while (element = element.offsetParent) { top += element.offsetTop; } return top; }; WOW.prototype.isVisible = function (box) { var bottom, offset, top, viewBottom, viewTop; offset = box.getAttribute('data-wow-offset') || this.config.offset; viewTop = window.pageYOffset; viewBottom = viewTop + Math.min(this.element.clientHeight, this.util().innerHeight()) - offset; top = this.offsetTop(box); bottom = top + box.clientHeight; return top <= viewBottom && bottom>= viewTop;
};
WOW.prototype.util = function () {
return this._util != null ? this._util : this._util = new Util();
};
WOW.prototype.disabled = function () {
return !this.config.mobile && this.util().isMobile(navigator.userAgent);
};
return WOW;
})();
}).call(this);
// svg
! function (o, l) {
var r, a, s = "createElement",
g = "getElementsByTagName",
b = "length",
E = "style",
d = "title",
y = "undefined",
k = "setAttribute",
w = "getAttribute",
x = null,
A = "__svgInject",
C = "--inject-",
S = new RegExp(C + "\\d+", "g"),
I = "LOAD_FAIL",
t = "SVG_NOT_SUPPORTED",
L = "SVG_INVALID",
v = ["src", "alt", "onload", "onerror"],
j = l[s]("a"),
G = typeof SVGRect != y,
f = {
useCache: !0,
copyAttributes: !0,
makeIdsUnique: !0
},
N = {
clipPath: ["clip-path"],
"color-profile": x,
cursor: x,
filter: x,
linearGradient: ["fill", "stroke"],
marker: ["marker",
"marker-end", "marker-mid", "marker-start"
],
mask: x,
pattern: ["fill", "stroke"],
radialGradient: ["fill", "stroke"]
},
u = 1,
c = 2,
O = 1;
function T(e) {
return (r = r || new XMLSerializer).serializeToString(e)
}
function P(e, r) {
var t, n, i, o, a = C + O++,
f = /url\("?#([a-zA-Z][\w:.-]*)"?\)/g,
u = e.querySelectorAll("[id]"),
c = r ? [] : x,
l = {},
s = [],
d = !1;
if (u[b]) {
for (i = 0; i < u[b]; i++)(n = u[i].localName) in N && (l[n] = 1); for (n in l)(N[n] || [n]).forEach(function (e) { s.indexOf(e) < 0 && s.push(e) }); s[b] && s.push(E); var v, p, m, h = e[g]("*"), y = e; for (i = -1; y != x;) { if (y.localName == E)(m = (p = y.textContent) && p.replace(f, function (e, r) { return c && (c[r] = 1), "url(#" + r + a + ")" })) !== p && (y.textContent = m); else if (y.hasAttributes()) { for (o = 0; o < s[b]; o++) v = s[o], (m = (p = y[w](v)) && p.replace(f, function (e, r) { return c && (c[r] = 1), "url(#" + r + a + ")" })) !== p && y[k](v, m); ["xlink:href", "href"].forEach(function (e) { var r = y[w](e); /^\s*#/.test(r) && (r = r.trim(), y[k](e, r + a), c && (c[r.substring(1)] = 1)) }) } y = h[++i] } for (i = 0; i < u[b]; i++) t = u[i], c && !c[t.id] || (t.id += a, d = !0) } return d } function V(e, r, t, n) { if (r) { r[k]("data-inject-url", t); var i = e.parentNode; if (i) { n.copyAttributes && function c(e, r) { for (var t, n, i, o = e.attributes, a = 0; a < o[b]; a++) if (n = (t = o[a]).name, -1 == v.indexOf(n)) if (i = t.value, n == d) { var f, u = r.firstElementChild; u && u.localName.toLowerCase() == d ? f = u : (f = l[s + "NS"]("http://www.w3.org/2000/svg", d), r.insertBefore(f, u)), f.textContent = i } else r[k](n, i) }(e, r); var o = n.beforeInject, a = o && o(e, r) || r; i.replaceChild(a, e), e[A] = u, m(e); var f = n.afterInject; f && f(e, a) } } else D(e, n) } function p() { for (var e = {}, r = arguments, t = 0; t < r[b]; t++) { var n = r[t]; for (var i in n) n.hasOwnProperty(i) && (e[i] = n[i]) } return e } function _(e, r) { if (r) { var t; try { t = function i(e) { return (a = a || new DOMParser).parseFromString(e, "text/xml") }(e) } catch (o) { return x } return t[g]("parsererror")[b] ? x : t.documentElement } var n = l.createElement("div"); return n.innerHTML = e, n.firstElementChild } function m(e) { e.removeAttribute("onload") } function n(e) { console.error("SVGInject: " + e) } function i(e, r, t) { e[A] = c, t.onFail ? t.onFail(e, r) : n(r) } function D(e, r) { m(e), i(e, L, r) } function F(e, r) { m(e), i(e, t, r) } function M(e, r) { i(e, I, r) } function q(e) { e.onload = x, e.onerror = x } function R(e) { n("no img element") } var e = function z(e, r) { var t = p(f, r), h = {}; function n(a, f) { f = p(t, f); var e = function (r) { var e = function () { var e = f.onAllFinish; e && e(), r && r() }; if (a && typeof a[b] != y) { var t = 0, n = a[b]; if (0 == n) e(); else for (var i = function () { ++t == n && e() }, o = 0; o < n; o++) u(a[o], f, i) } else u(a, f, e) }; return typeof Promise == y ? e() : new Promise(e) } function u(u, c, e) { if (u) { var r = u[A]; if (r) Array.isArray(r) ? r.push(e) : e(); else { if (q(u), !G) return F(u, c), void e(); var t = c.beforeLoad, n = t && t(u) || u[w]("src"); if (!n) return "" === n && M(u, c), void e(); var i = []; u[A] = i; var l = function () { e(), i.forEach(function (e) { e() }) }, s = function f(e) { return j.href = e, j.href }(n), d = c.useCache, v = c.makeIdsUnique, p = function (r) { d && (h[s].forEach(function (e) { e(r) }), h[s] = r) }; if (d) { var o, a = function (e) { if (e === I) M(u, c); else if (e === L) D(u, c); else { var r, t = e[0], n = e[1], i = e[2]; v && (t === x ? (t = P(r = _(n, !1), !1), e[0] = t, e[2] = t && T(r)) : t && (n = function o(e) { return e.replace(S, C + O++) }(i))), r = r || _(n, !1), V(u, r, s, c) } l() }; if (typeof (o = h[s]) != y) return void(o.isCallbackQueue ? o.push(a) : a(o)); (o = []).isCallbackQueue = !0, h[s] = o }! function m(e, r, t) { if (e) { var n = new XMLHttpRequest; n.onreadystatechange = function () { if (4 == n.readyState) { var e = n.status; 200 == e ? r(n.responseXML, n.responseText.trim()) : 400 <= e ? t() : 0 == e && t() } }, n.open("GET", e, !0), n.send() } }(s, function (e, r) { var t = e instanceof Document ? e.documentElement : _(r, !0), n = c.afterLoad; if (n) { var i = n(t, r) || t; if (i) { var o = "string" == typeof i; r = o ? i : T(t), t = o ? _(i, !0) : i } } if (t instanceof SVGElement) { var a = x; if (v && (a = P(t, !1)), d) { var f = a && T(t); p([a, r, f]) } V(u, t, s, c) } else D(u, c), p(L); l() }, function () { M(u, c), p(I), l() }) } } else R() } return G && function i(e) { var r = l[g]("head")[0]; if (r) { var t = l[s](E); t.type = "text/css", t.appendChild(l.createTextNode(e)), r.appendChild(t) } }('img[onload^="' + e + '("]{visibility:hidden;}'), n.setOptions = function (e) { t = p(t, e) }, n.create = z, n.err = function (e, r) { e ? e[A] != c && (q(e), G ? (m(e), M(e, t)) : F(e, t), r && (m( e), e.src = r)) : R() }, o[e] = n }("SVGInject"); "object" == typeof module && "object" == typeof module.exports && (module.exports = e) }(window, document); function initSvg(obj) { try { SVGInject(obj); } catch (e) { // 方法尚未实例化,执行递归 setTimeout(function () { initSvg(obj); }, 200) } } /** * appear.js */ (function (t) { t.fn.appear = function (e, o) { var n = t.extend({ data: void 0, one: !0, accX: 0, accY: 0 }, o); return this.each(function () { var o = t(this); if (o.appeared = !1, e) { var i = t(window), a = function () { if (o.is(":visible")) { var t = i.scrollLeft(), e = i.scrollTop(), a = o.offset(), r = a.left, s = a.top, p = n.accX, l = n.accY, h = o.height(), c = i.height(), f = o.width(), u = i.width(); s + h + l>= e && s <= e + c + l && r + f + p>= t && r <= t + u + p ? o.appeared || o.trigger("appear", n.data) : o.appeared = !1 } else o.appeared = !1 }, r = function () { if (o.appeared = !0, n.one) { i.unbind("scroll", a); var r = t.inArray(a, t.fn.appear.checks); r>= 0 && t.fn.appear.checks.splice(r, 1)
}
e.apply(this, arguments)
};
n.one ? o.one("appear", n.data, r) : o.bind("appear", n.data, r), i.scroll(a), t.fn.appear.checks.push(a), a()
} else o.trigger("appear", n.data)
})
}, t.extend(t.fn.appear, {
checks: [],
timeout: null,
checkAll: function () {
var e = t.fn.appear.checks.length;
if (e> 0)
for (; e--;) t.fn.appear.checks[e]()
},
run: function () {
t.fn.appear.timeout && clearTimeout(t.fn.appear.timeout), t.fn.appear.timeout = setTimeout(t.fn.appear.checkAll, 20)
}
}), t.each(["append", "prepend", "after", "before", "attr", "removeAttr", "addClass", "removeClass", "toggleClass", "remove", "css", "show", "hide"], function (e, o) {
var n = t.fn[o];
n && (t.fn[o] = function () {
var e = n.apply(this, arguments);
return t.fn.appear.run(), e
})
})
})(jQuery),
function (t) {
"function" == typeof define && define.amd ? define(["jquery"], t) : "object" == typeof exports ? t(require("jquery")) : t(jQuery)
}(function (t) {
function e(t, e) {
return t.toFixed(e.decimals)
}
var o = function (e, n) {
this.$element = t(e), this.options = t.extend({}, o.DEFAULTS, this.dataOptions(), n), this.init()
};
o.DEFAULTS = {
from: 0,
to: 0,
speed: 1e3,
refreshInterval: 100,
decimals: 0,
formatter: e,
onUpdate: null,
onComplete: null
}, o.prototype.init = function () {
this.value = this.options.from, this.loops = Math.ceil(this.options.speed / this.options.refreshInterval), this.loopCount = 0, this.increment = (this.options.to - this.options.from) / this.loops
}, o.prototype.dataOptions = function () {
var t = 0,
e = parseFloat(this.$element.text().toString().replace(/,/g, ""));
this.$element.data("from") && (t = parseFloat(this.$element.data("from").toString().replace(/,/g, ""))), this.$element.data("to") && (e = parseFloat(this.$element.data("to").toString().replace(/,/g, "")));
var o = 0,
n = e.toString().split(".");
n[1] && (o = n[1].toString().length);
var i = {
from: t,
to: e,
speed: this.$element.data("speed"),
refreshInterval: this.$element.data("refresh-interval"),
decimals: o
},
a = Object.keys(i);
for (var r in a) {
var s = a[r];
void 0 === i[s] && delete i[s]
}
return i
}, o.prototype.update = function () {
this.value += this.increment, this.loopCount++, this.render(), "function" == typeof this.options.onUpdate && this.options.onUpdate.call(this.$element, this.value), this.loopCount>= this.loops && (clearInterval(this.interval), this.value = this.options.to, "function" == typeof this.options.onComplete && this.options.onComplete.call(this.$element, this.value))
}, o.prototype.render = function () {
var t = this.options.formatter.call(this.$element, this.value, this.options);
this.$element.text(t)
}, o.prototype.restart = function () {
this.stop(), this.init(), this.start()
}, o.prototype.start = function () {
this.stop(), this.render(), this.interval = setInterval(this.update.bind(this), this.options.refreshInterval)
}, o.prototype.stop = function () {
this.interval && clearInterval(this.interval)
}, o.prototype.toggle = function () {
this.interval ? this.stop() : this.start()
}, t.fn.countTo = function (e) {
return this.each(function () {
var n = t(this),
i = n.data("countTo"),
a = !i || "object" == typeof e,
r = "object" == typeof e ? e : {},
s = "string" == typeof e ? e : "start";
a && (i && i.stop(), n.data("countTo", i = new o(this, r))), i[s].call(i)
})
}
});
/**
* lottie.js
*/
(typeof navigator !== "undefined") && (function (global, factory) {
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())
})(this, (function () {
'use strict';
var svgNS = 'http://www.w3.org/2000/svg';
var locationHref = '';
var _useWebWorker = false;
var initialDefaultFrame = -999999;
var setWebWorker = function setWebWorker(flag) {
_useWebWorker = !!flag
};
var getWebWorker = function getWebWorker() {
return _useWebWorker
};
var setLocationHref = function setLocationHref(value) {
locationHref = value
};
var getLocationHref = function getLocationHref() {
return locationHref
};
function createTag(type) {
return document.createElement(type)
}
function extendPrototype(sources, destination) {
var i;
var len = sources.length;
var sourcePrototype;
for (i = 0; i < len; i += 1) { sourcePrototype = sources[i].prototype; for (var attr in sourcePrototype) { if (Object.prototype.hasOwnProperty.call(sourcePrototype, attr)) destination.prototype[attr] = sourcePrototype[attr] } } } function getDescriptor(object, prop) { return Object.getOwnPropertyDescriptor(object, prop) } function createProxyFunction(prototype) { function ProxyFunction() {} ProxyFunction.prototype = prototype; return ProxyFunction } var audioControllerFactory = function () { function AudioController(audioFactory) { this.audios = []; this.audioFactory = audioFactory; this._volume = 1; this._isMuted = false } AudioController.prototype = { addAudio: function addAudio(audio) { this.audios.push(audio) }, pause: function pause() { var i; var len = this.audios.length; for (i = 0; i < len; i += 1) { this.audios[i].pause() } }, resume: function resume() { var i; var len = this.audios.length; for (i = 0; i < len; i += 1) { this.audios[i].resume() } }, setRate: function setRate(rateValue) { var i; var len = this.audios.length; for (i = 0; i < len; i += 1) { this.audios[i].setRate(rateValue) } }, createAudio: function createAudio(assetPath) { if (this.audioFactory) { return this.audioFactory(assetPath) } if (window.Howl) { return new window.Howl({ src: [assetPath] }) } return { isPlaying: false, play: function play() { this.isPlaying = true }, seek: function seek() { this.isPlaying = false }, playing: function playing() {}, rate: function rate() {}, setVolume: function setVolume() {} } }, setAudioFactory: function setAudioFactory(audioFactory) { this.audioFactory = audioFactory }, setVolume: function setVolume(value) { this._volume = value; this._updateVolume() }, mute: function mute() { this._isMuted = true; this._updateVolume() }, unmute: function unmute() { this._isMuted = false; this._updateVolume() }, getVolume: function getVolume() { return this._volume }, _updateVolume: function _updateVolume() { var i; var len = this.audios.length; for (i = 0; i < len; i += 1) { this.audios[i].volume(this._volume * (this._isMuted ? 0 : 1)) } } }; return function () { return new AudioController() } }(); var createTypedArray = function () { function createRegularArray(type, len) { var i = 0; var arr = []; var value; switch (type) { case 'int16': case 'uint8c': value = 1; break; default: value = 1.1; break } for (i = 0; i < len; i += 1) { arr.push(value) } return arr } function createTypedArrayFactory(type, len) { if (type === 'float32') { return new Float32Array(len) } if (type === 'int16') { return new Int16Array(len) } if (type === 'uint8c') { return new Uint8ClampedArray(len) } return createRegularArray(type, len) } if (typeof Uint8ClampedArray === 'function' && typeof Float32Array === 'function') { return createTypedArrayFactory } return createRegularArray }(); function createSizedArray(len) { return Array.apply(null, { length: len }) } function _typeof6ドル(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof6ドル = function _typeof(obj) { return typeof obj } } else { _typeof6ドル = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj } } return _typeof6ドル(obj) } var subframeEnabled = true; var expressionsPlugin = null; var idPrefix1ドル = ''; var isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent); var _shouldRoundValues = false; var bmPow = Math.pow; var bmSqrt = Math.sqrt; var bmFloor = Math.floor; var bmMax = Math.max; var bmMin = Math.min; var BMMath = {}; (function () { var propertyNames = ['abs', 'acos', 'acosh', 'asin', 'asinh', 'atan', 'atanh', 'atan2', 'ceil', 'cbrt', 'expm1', 'clz32', 'cos', 'cosh', 'exp', 'floor', 'fround', 'hypot', 'imul', 'log', 'log1p', 'log2', 'log10', 'max', 'min', 'pow', 'random', 'round', 'sign', 'sin', 'sinh', 'sqrt', 'tan', 'tanh', 'trunc', 'E', 'LN10', 'LN2', 'LOG10E', 'LOG2E', 'PI', 'SQRT1_2', 'SQRT2']; var i; var len = propertyNames.length; for (i = 0; i < len; i += 1) { BMMath[propertyNames[i]] = Math[propertyNames[i]] } })(); function ProjectInterface1ドル() { return {} } BMMath.random = Math.random; BMMath.abs = function (val) { var tOfVal = _typeof6ドル(val); if (tOfVal === 'object' && val.length) { var absArr = createSizedArray(val.length); var i; var len = val.length; for (i = 0; i < len; i += 1) { absArr[i] = Math.abs(val[i]) } return absArr } return Math.abs(val) }; var defaultCurveSegments = 150; var degToRads = Math.PI / 180; var roundCorner = 0.5519; function roundValues(flag) { _shouldRoundValues = !!flag } function bmRnd(value) { if (_shouldRoundValues) { return Math.round(value) } return value } function styleDiv(element) { element.style.position = 'absolute'; element.style.top = 0; element.style.left = 0; element.style.display = 'block'; element.style.transformOrigin = '0 0'; element.style.webkitTransformOrigin = '0 0'; element.style.backfaceVisibility = 'visible'; element.style.webkitBackfaceVisibility = 'visible'; element.style.transformStyle = 'preserve-3d'; element.style.webkitTransformStyle = 'preserve-3d'; element.style.mozTransformStyle = 'preserve-3d' } function BMEnterFrameEvent(type, currentTime, totalTime, frameMultiplier) { this.type = type; this.currentTime = currentTime; this.totalTime = totalTime; this.direction = frameMultiplier < 0 ? -1 : 1 } function BMCompleteEvent(type, frameMultiplier) { this.type = type; this.direction = frameMultiplier < 0 ? -1 : 1 } function BMCompleteLoopEvent(type, totalLoops, currentLoop, frameMultiplier) { this.type = type; this.currentLoop = currentLoop; this.totalLoops = totalLoops; this.direction = frameMultiplier < 0 ? -1 : 1 } function BMSegmentStartEvent(type, firstFrame, totalFrames) { this.type = type; this.firstFrame = firstFrame; this.totalFrames = totalFrames } function BMDestroyEvent(type, target) { this.type = type; this.target = target } function BMRenderFrameErrorEvent(nativeError, currentTime) { this.type = 'renderFrameError'; this.nativeError = nativeError; this.currentTime = currentTime } function BMConfigErrorEvent(nativeError) { this.type = 'configError'; this.nativeError = nativeError } function BMAnimationConfigErrorEvent(type, nativeError) { this.type = type; this.nativeError = nativeError } var createElementID = function () { var _count = 0; return function createID() { _count += 1; return idPrefix1ドル + '__lottie_element_' + _count } }(); function HSVtoRGB(h, s, v) { var r; var g; var b; var i; var f; var p; var q; var t; i = Math.floor(h * 6); f = h * 6 - i; p = v * (1 - s); q = v * (1 - f * s); t = v * (1 - (1 - f) * s); switch (i % 6) { case 0: r = v; g = t; b = p; break; case 1: r = q; g = v; b = p; break; case 2: r = p; g = v; b = t; break; case 3: r = p; g = q; b = v; break; case 4: r = t; g = p; b = v; break; case 5: r = v; g = p; b = q; break; default: break } return [r, g, b] } function RGBtoHSV(r, g, b) { var max = Math.max(r, g, b); var min = Math.min(r, g, b); var d = max - min; var h; var s = max === 0 ? 0 : d / max; var v = max / 255; switch (max) { case min: h = 0; break; case r: h = g - b + d * (g < b ? 6 : 0); h /= 6 * d; break; case g: h = b - r + d * 2; h /= 6 * d; break; case b: h = r - g + d * 4; h /= 6 * d; break; default: break } return [h, s, v] } function addSaturationToRGB(color, offset) { var hsv = RGBtoHSV(color[0] * 255, color[1] * 255, color[2] * 255); hsv[1] += offset; if (hsv[1]> 1) {
hsv[1] = 1
} else if (hsv[1] <= 0) { hsv[1] = 0 } return HSVtoRGB(hsv[0], hsv[1], hsv[2]) } function addBrightnessToRGB(color, offset) { var hsv = RGBtoHSV(color[0] * 255, color[1] * 255, color[2] * 255); hsv[2] += offset; if (hsv[2]> 1) {
hsv[2] = 1
} else if (hsv[2] < 0) { hsv[2] = 0 } return HSVtoRGB(hsv[0], hsv[1], hsv[2]) } function addHueToRGB(color, offset) { var hsv = RGBtoHSV(color[0] * 255, color[1] * 255, color[2] * 255); hsv[0] += offset / 360; if (hsv[0]> 1) {
hsv[0] -= 1
} else if (hsv[0] < 0) { hsv[0] += 1 } return HSVtoRGB(hsv[0], hsv[1], hsv[2]) } var rgbToHex = function () { var colorMap = []; var i; var hex; for (i = 0; i < 256; i += 1) { hex = i.toString(16); colorMap[i] = hex.length === 1 ? '0' + hex : hex } return function (r, g, b) { if (r < 0) { r = 0 } if (g < 0) { g = 0 } if (b < 0) { b = 0 } return '#' + colorMap[r] + colorMap[g] + colorMap[b] } }(); var setSubframeEnabled = function setSubframeEnabled(flag) { subframeEnabled = !!flag }; var getSubframeEnabled = function getSubframeEnabled() { return subframeEnabled }; var setExpressionsPlugin = function setExpressionsPlugin(value) { expressionsPlugin = value }; var getExpressionsPlugin = function getExpressionsPlugin() { return expressionsPlugin }; var setDefaultCurveSegments = function setDefaultCurveSegments(value) { defaultCurveSegments = value }; var getDefaultCurveSegments = function getDefaultCurveSegments() { return defaultCurveSegments }; var setIdPrefix = function setIdPrefix(value) { idPrefix1ドル = value }; var getIdPrefix = function getIdPrefix() { return idPrefix1ドル }; function createNS(type) { return document.createElementNS(svgNS, type) } function _typeof5ドル(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof5ドル = function _typeof(obj) { return typeof obj } } else { _typeof5ドル = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj } } return _typeof5ドル(obj) } var dataManager = function () { var _counterId = 1; var processes = []; var workerFn; var workerInstance; var workerProxy = { onmessage: function onmessage() {}, postMessage: function postMessage(path) { workerFn({ data: path }) } }; var _workerSelf = { postMessage: function postMessage(data) { workerProxy.onmessage({ data: data }) } }; function createWorker(fn) { if (window.Worker && window.Blob && getWebWorker()) { var blob = new Blob(['var _workerSelf = self; self.onmessage = ', fn.toString()], { type: 'text/javascript' }); var url = URL.createObjectURL(blob); return new Worker(url) } workerFn = fn; return workerProxy } function setupWorker() { if (!workerInstance) { workerInstance = createWorker(function workerStart(e) { function dataFunctionManager() { function completeLayers(layers, comps) { var layerData; var i; var len = layers.length; var j; var jLen; var k; var kLen; for (i = 0; i < len; i += 1) { layerData = layers[i]; if ('ks' in layerData && !layerData.completed) { layerData.completed = true; if (layerData.tt) { layers[i - 1].td = layerData.tt } if (layerData.hasMask) { var maskProps = layerData.masksProperties; jLen = maskProps.length; for (j = 0; j < jLen; j += 1) { if (maskProps[j].pt.k.i) { convertPathsToAbsoluteValues(maskProps[j].pt.k) } else { kLen = maskProps[j].pt.k.length; for (k = 0; k < kLen; k += 1) { if (maskProps[j].pt.k[k].s) { convertPathsToAbsoluteValues(maskProps[j].pt.k[k].s[0]) } if (maskProps[j].pt.k[k].e) { convertPathsToAbsoluteValues(maskProps[j].pt.k[k].e[0]) } } } } } if (layerData.ty === 0) { layerData.layers = findCompLayers(layerData.refId, comps); completeLayers(layerData.layers, comps) } else if (layerData.ty === 4) { completeShapes(layerData.shapes) } else if (layerData.ty === 5) { completeText(layerData) } } } } function completeChars(chars, assets) { if (chars) { var i = 0; var len = chars.length; for (i = 0; i < len; i += 1) { if (chars[i].t === 1) { chars[i].data.layers = findCompLayers(chars[i].data.refId, assets); completeLayers(chars[i].data.layers, assets) } } } } function findComp(id, comps) { var i = 0; var len = comps.length; while (i < len) { if (comps[i].id === id) { return comps[i] } i += 1 } return null } function findCompLayers(id, comps) { var comp = findComp(id, comps); if (comp) { if (!comp.layers.__used) { comp.layers.__used = true; return comp.layers } return JSON.parse(JSON.stringify(comp.layers)) } return null } function completeShapes(arr) { var i; var len = arr.length; var j; var jLen; for (i = len - 1; i>= 0; i -= 1) {
if (arr[i].ty === 'sh') {
if (arr[i].ks.k.i) {
convertPathsToAbsoluteValues(arr[i].ks.k)
} else {
jLen = arr[i].ks.k.length;
for (j = 0; j < jLen; j += 1) { if (arr[i].ks.k[j].s) { convertPathsToAbsoluteValues(arr[i].ks.k[j].s[0]) } if (arr[i].ks.k[j].e) { convertPathsToAbsoluteValues(arr[i].ks.k[j].e[0]) } } } } else if (arr[i].ty === 'gr') { completeShapes(arr[i].it) } } } function convertPathsToAbsoluteValues(path) { var i; var len = path.i.length; for (i = 0; i < len; i += 1) { path.i[i][0] += path.v[i][0]; path.i[i][1] += path.v[i][1]; path.o[i][0] += path.v[i][0]; path.o[i][1] += path.v[i][1] } } function checkVersion(minimum, animVersionString) { var animVersion = animVersionString ? animVersionString.split('.') : [100, 100, 100]; if (minimum[0]> animVersion[0]) {
return true
}
if (animVersion[0]> minimum[0]) {
return false
}
if (minimum[1]> animVersion[1]) {
return true
}
if (animVersion[1]> minimum[1]) {
return false
}
if (minimum[2]> animVersion[2]) {
return true
}
if (animVersion[2]> minimum[2]) {
return false
}
return null
}
var checkText = function () {
var minimumVersion = [4, 4, 14];
function updateTextLayer(textLayer) {
var documentData = textLayer.t.d;
textLayer.t.d = {
k: [{
s: documentData,
t: 0
}]
}
}
function iterateLayers(layers) {
var i;
var len = layers.length;
for (i = 0; i < len; i += 1) { if (layers[i].ty === 5) { updateTextLayer(layers[i]) } } } return function (animationData) { if (checkVersion(minimumVersion, animationData.v)) { iterateLayers(animationData.layers); if (animationData.assets) { var i; var len = animationData.assets.length; for (i = 0; i < len; i += 1) { if (animationData.assets[i].layers) { iterateLayers(animationData.assets[i].layers) } } } } } }(); var checkChars = function () { var minimumVersion = [4, 7, 99]; return function (animationData) { if (animationData.chars && !checkVersion(minimumVersion, animationData.v)) { var i; var len = animationData.chars.length; for (i = 0; i < len; i += 1) { var charData = animationData.chars[i]; if (charData.data && charData.data.shapes) { completeShapes(charData.data.shapes); charData.data.ip = 0; charData.data.op = 99999; charData.data.st = 0; charData.data.sr = 1; charData.data.ks = { p: { k: [0, 0], a: 0 }, s: { k: [100, 100], a: 0 }, a: { k: [0, 0], a: 0 }, r: { k: 0, a: 0 }, o: { k: 100, a: 0 } }; if (!animationData.chars[i].t) { charData.data.shapes.push({ ty: 'no' }); charData.data.shapes[0].it.push({ p: { k: [0, 0], a: 0 }, s: { k: [100, 100], a: 0 }, a: { k: [0, 0], a: 0 }, r: { k: 0, a: 0 }, o: { k: 100, a: 0 }, sk: { k: 0, a: 0 }, sa: { k: 0, a: 0 }, ty: 'tr' }) } } } } } }(); var checkPathProperties = function () { var minimumVersion = [5, 7, 15]; function updateTextLayer(textLayer) { var pathData = textLayer.t.p; if (typeof pathData.a === 'number') { pathData.a = { a: 0, k: pathData.a } } if (typeof pathData.p === 'number') { pathData.p = { a: 0, k: pathData.p } } if (typeof pathData.r === 'number') { pathData.r = { a: 0, k: pathData.r } } } function iterateLayers(layers) { var i; var len = layers.length; for (i = 0; i < len; i += 1) { if (layers[i].ty === 5) { updateTextLayer(layers[i]) } } } return function (animationData) { if (checkVersion(minimumVersion, animationData.v)) { iterateLayers(animationData.layers); if (animationData.assets) { var i; var len = animationData.assets.length; for (i = 0; i < len; i += 1) { if (animationData.assets[i].layers) { iterateLayers(animationData.assets[i].layers) } } } } } }(); var checkColors = function () { var minimumVersion = [4, 1, 9]; function iterateShapes(shapes) { var i; var len = shapes.length; var j; var jLen; for (i = 0; i < len; i += 1) { if (shapes[i].ty === 'gr') { iterateShapes(shapes[i].it) } else if (shapes[i].ty === 'fl' || shapes[i].ty === 'st') { if (shapes[i].c.k && shapes[i].c.k[0].i) { jLen = shapes[i].c.k.length; for (j = 0; j < jLen; j += 1) { if (shapes[i].c.k[j].s) { shapes[i].c.k[j].s[0] /= 255; shapes[i].c.k[j].s[1] /= 255; shapes[i].c.k[j].s[2] /= 255; shapes[i].c.k[j].s[3] /= 255 } if (shapes[i].c.k[j].e) { shapes[i].c.k[j].e[0] /= 255; shapes[i].c.k[j].e[1] /= 255; shapes[i].c.k[j].e[2] /= 255; shapes[i].c.k[j].e[3] /= 255 } } } else { shapes[i].c.k[0] /= 255; shapes[i].c.k[1] /= 255; shapes[i].c.k[2] /= 255; shapes[i].c.k[3] /= 255 } } } } function iterateLayers(layers) { var i; var len = layers.length; for (i = 0; i < len; i += 1) { if (layers[i].ty === 4) { iterateShapes(layers[i].shapes) } } } return function (animationData) { if (checkVersion(minimumVersion, animationData.v)) { iterateLayers(animationData.layers); if (animationData.assets) { var i; var len = animationData.assets.length; for (i = 0; i < len; i += 1) { if (animationData.assets[i].layers) { iterateLayers(animationData.assets[i].layers) } } } } } }(); var checkShapes = function () { var minimumVersion = [4, 4, 18]; function completeClosingShapes(arr) { var i; var len = arr.length; var j; var jLen; 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
} else {
jLen = arr[i].ks.k.length;
for (j = 0; j < jLen; j += 1) { if (arr[i].ks.k[j].s) { arr[i].ks.k[j].s[0].c = arr[i].closed } if (arr[i].ks.k[j].e) { arr[i].ks.k[j].e[0].c = arr[i].closed } } } } else if (arr[i].ty === 'gr') { completeClosingShapes(arr[i].it) } } } function iterateLayers(layers) { var layerData; var i; var len = layers.length; var j; var jLen; var k; var kLen; for (i = 0; i < len; i += 1) { layerData = layers[i]; if (layerData.hasMask) { var maskProps = layerData.masksProperties; jLen = maskProps.length; for (j = 0; j < jLen; j += 1) { if (maskProps[j].pt.k.i) { maskProps[j].pt.k.c = maskProps[j].cl } else { kLen = maskProps[j].pt.k.length; for (k = 0; k < kLen; k += 1) { if (maskProps[j].pt.k[k].s) { maskProps[j].pt.k[k].s[0].c = maskProps[j].cl } if (maskProps[j].pt.k[k].e) { maskProps[j].pt.k[k].e[0].c = maskProps[j].cl } } } } } if (layerData.ty === 4) { completeClosingShapes(layerData.shapes) } } } return function (animationData) { if (checkVersion(minimumVersion, animationData.v)) { iterateLayers(animationData.layers); if (animationData.assets) { var i; var len = animationData.assets.length; for (i = 0; i < len; i += 1) { if (animationData.assets[i].layers) { iterateLayers(animationData.assets[i].layers) } } } } } }(); function completeData(animationData) { if (animationData.__complete) { return } checkColors(animationData); checkText(animationData); checkChars(animationData); checkPathProperties(animationData); checkShapes(animationData); completeLayers(animationData.layers, animationData.assets); completeChars(animationData.chars, animationData.assets); animationData.__complete = true } function completeText(data) { if (data.t.a.length === 0 && !('m' in data.t.p)) {} } var moduleOb = {}; moduleOb.completeData = completeData; moduleOb.checkColors = checkColors; moduleOb.checkChars = checkChars; moduleOb.checkPathProperties = checkPathProperties; moduleOb.checkShapes = checkShapes; moduleOb.completeLayers = completeLayers; return moduleOb } if (!_workerSelf.dataManager) { _workerSelf.dataManager = dataFunctionManager() } if (!_workerSelf.assetLoader) { _workerSelf.assetLoader = function () { function formatResponse(xhr) { var contentTypeHeader = xhr.getResponseHeader('content-type'); if (contentTypeHeader && xhr.responseType === 'json' && contentTypeHeader.indexOf('json') !== -1) { return xhr.response } if (xhr.response && _typeof5ドル(xhr.response) === 'object') { return xhr.response } if (xhr.response && typeof xhr.response === 'string') { return JSON.parse(xhr.response) } if (xhr.responseText) { return JSON.parse(xhr.responseText) } return null } function loadAsset(path, fullPath, callback, errorCallback) { var response; var xhr = new XMLHttpRequest(); try { xhr.responseType = 'json' } catch (err) {} xhr.onreadystatechange = function () { if (xhr.readyState === 4) { if (xhr.status === 200) { response = formatResponse(xhr); callback(response) } else { try { response = formatResponse(xhr); callback(response) } catch (err) { if (errorCallback) { errorCallback(err) } } } } }; try { xhr.open('GET', path, true) } catch (error) { xhr.open('GET', fullPath + '/' + path, true) } xhr.send() } return { load: loadAsset } }() } if (e.data.type === 'loadAnimation') { _workerSelf.assetLoader.load(e.data.path, e.data.fullPath, function (data) { _workerSelf.dataManager.completeData(data); _workerSelf.postMessage({ id: e.data.id, payload: data, status: 'success' }) }, function () { _workerSelf.postMessage({ id: e.data.id, status: 'error' }) }) } else if (e.data.type === 'complete') { var animation = e.data.animation; _workerSelf.dataManager.completeData(animation); _workerSelf.postMessage({ id: e.data.id, payload: animation, status: 'success' }) } else if (e.data.type === 'loadData') { _workerSelf.assetLoader.load(e.data.path, e.data.fullPath, function (data) { _workerSelf.postMessage({ id: e.data.id, payload: data, status: 'success' }) }, function () { _workerSelf.postMessage({ id: e.data.id, status: 'error' }) }) } }); workerInstance.onmessage = function (event) { var data = event.data; var id = data.id; var process = processes[id]; processes[id] = null; if (data.status === 'success') { process.onComplete(data.payload) } else if (process.onError) { process.onError() } } } } function createProcess(onComplete, onError) { _counterId += 1; var id = 'processId_' + _counterId; processes[id] = { onComplete: onComplete, onError: onError }; return id } function loadAnimation(path, onComplete, onError) { setupWorker(); var processId = createProcess(onComplete, onError); workerInstance.postMessage({ type: 'loadAnimation', path: path, fullPath: window.location.origin + window.location.pathname, id: processId }) } function loadData(path, onComplete, onError) { setupWorker(); var processId = createProcess(onComplete, onError); workerInstance.postMessage({ type: 'loadData', path: path, fullPath: window.location.origin + window.location.pathname, id: processId }) } function completeAnimation(anim, onComplete, onError) { setupWorker(); var processId = createProcess(onComplete, onError); workerInstance.postMessage({ type: 'complete', animation: anim, id: processId }) } return { loadAnimation: loadAnimation, loadData: loadData, completeAnimation: completeAnimation } }(); var ImagePreloader = function () { var proxyImage = function () { var canvas = createTag('canvas'); canvas.width = 1; canvas.height = 1; var ctx = canvas.getContext('2d'); ctx.fillStyle = 'rgba(0,0,0,0)'; ctx.fillRect(0, 0, 1, 1); return canvas }(); function imageLoaded() { this.loadedAssets += 1; if (this.loadedAssets === this.totalImages && this.loadedFootagesCount === this.totalFootages) { if (this.imagesLoadedCb) { this.imagesLoadedCb(null) } } } function footageLoaded() { this.loadedFootagesCount += 1; if (this.loadedAssets === this.totalImages && this.loadedFootagesCount === this.totalFootages) { if (this.imagesLoadedCb) { this.imagesLoadedCb(null) } } } function getAssetsPath(assetData, assetsPath, originalPath) { var path = ''; if (assetData.e) { path = assetData.p } else if (assetsPath) { var imagePath = assetData.p; if (imagePath.indexOf('images/') !== -1) { imagePath = imagePath.split('/')[1] } path = assetsPath + imagePath } else { path = originalPath; path += assetData.u ? assetData.u : ''; path += assetData.p } return path } function testImageLoaded(img) { var _count = 0; var intervalId = setInterval(function () { var box = img.getBBox(); if (box.width || _count> 500) {
this._imageLoaded();
clearInterval(intervalId)
}
_count += 1
}.bind(this), 50)
}
function createImageData(assetData) {
var path = getAssetsPath(assetData, this.assetsPath, this.path);
var img = createNS('image');
if (isSafari) {
this.testImageLoaded(img)
} else {
img.addEventListener('load', this._imageLoaded, false)
}
img.addEventListener('error', function () {
ob.img = proxyImage;
this._imageLoaded()
}.bind(this), false);
img.setAttributeNS('http://www.w3.org/1999/xlink', 'href', path);
if (this._elementHelper.append) {
this._elementHelper.append(img)
} else {
this._elementHelper.appendChild(img)
}
var ob = {
img: img,
assetData: assetData
};
return ob
}
function createImgData(assetData) {
var path = getAssetsPath(assetData, this.assetsPath, this.path);
var img = createTag('img');
img.crossOrigin = 'anonymous';
img.addEventListener('load', this._imageLoaded, false);
img.addEventListener('error', function () {
ob.img = proxyImage;
this._imageLoaded()
}.bind(this), false);
img.src = path;
var ob = {
img: img,
assetData: assetData
};
return ob
}
function createFootageData(data) {
var ob = {
assetData: data
};
var path = getAssetsPath(data, this.assetsPath, this.path);
dataManager.loadData(path, function (footageData) {
ob.img = footageData;
this._footageLoaded()
}.bind(this), function () {
ob.img = {};
this._footageLoaded()
}.bind(this));
return ob
}
function loadAssets(assets, cb) {
this.imagesLoadedCb = cb;
var i;
var len = assets.length;
for (i = 0; i < len; i += 1) { if (!assets[i].layers) { if (!assets[i].t || assets[i].t === 'seq') { this.totalImages += 1; this.images.push(this._createImageData(assets[i])) } else if (assets[i].t === 3) { this.totalFootages += 1; this.images.push(this.createFootageData(assets[i])) } } } } function setPath(path) { this.path = path || '' } function setAssetsPath(path) { this.assetsPath = path || '' } function getAsset(assetData) { var i = 0; var len = this.images.length; while (i < len) { if (this.images[i].assetData === assetData) { return this.images[i].img } i += 1 } return null } function destroy() { this.imagesLoadedCb = null; this.images.length = 0 } function loadedImages() { return this.totalImages === this.loadedAssets } function loadedFootages() { return this.totalFootages === this.loadedFootagesCount } function setCacheType(type, elementHelper) { if (type === 'svg') { this._elementHelper = elementHelper; this._createImageData = this.createImageData.bind(this) } else { this._createImageData = this.createImgData.bind(this) } } function ImagePreloaderFactory() { this._imageLoaded = imageLoaded.bind(this); this._footageLoaded = footageLoaded.bind(this); this.testImageLoaded = testImageLoaded.bind(this); this.createFootageData = createFootageData.bind(this); this.assetsPath = ''; this.path = ''; this.totalImages = 0; this.totalFootages = 0; this.loadedAssets = 0; this.loadedFootagesCount = 0; this.imagesLoadedCb = null; this.images = [] } ImagePreloaderFactory.prototype = { loadAssets: loadAssets, setAssetsPath: setAssetsPath, setPath: setPath, loadedImages: loadedImages, loadedFootages: loadedFootages, destroy: destroy, getAsset: getAsset, createImgData: createImgData, createImageData: createImageData, imageLoaded: imageLoaded, footageLoaded: footageLoaded, setCacheType: setCacheType }; return ImagePreloaderFactory }(); function BaseEvent() {} BaseEvent.prototype = { triggerEvent: function triggerEvent(eventName, args) { if (this._cbs[eventName]) { var callbacks = this._cbs[eventName]; for (var i = 0; i < callbacks.length; i += 1) { callbacks[i](args) } } }, addEventListener: function addEventListener(eventName, callback) { if (!this._cbs[eventName]) { this._cbs[eventName] = [] } this._cbs[eventName].push(callback); return function () { this.removeEventListener(eventName, callback) }.bind(this) }, removeEventListener: function removeEventListener(eventName, callback) { if (!callback) { this._cbs[eventName] = null } else if (this._cbs[eventName]) { var i = 0; var len = this._cbs[eventName].length; while (i < len) { if (this._cbs[eventName][i] === callback) { this._cbs[eventName].splice(i, 1); i -= 1; len -= 1 } i += 1 } if (!this._cbs[eventName].length) { this._cbs[eventName] = null } } } }; var markerParser = function () { function parsePayloadLines(payload) { var lines = payload.split('\r\n'); var keys = {}; var line; var keysCount = 0; for (var i = 0; i < lines.length; i += 1) { line = lines[i].split(':'); if (line.length === 2) { keys[line[0]] = line[1].trim(); keysCount += 1 } } if (keysCount === 0) { throw new Error(); } return keys } return function (_markers) { var markers = []; for (var i = 0; i < _markers.length; i += 1) { var _marker = _markers[i]; var markerData = { time: _marker.tm, duration: _marker.dr }; try { markerData.payload = JSON.parse(_markers[i].cm) } catch (_) { try { markerData.payload = parsePayloadLines(_markers[i].cm) } catch (__) { markerData.payload = { name: _markers[i].cm } } } markers.push(markerData) } return markers } }(); var ProjectInterface = function () { function registerComposition(comp) { this.compositions.push(comp) } return function () { function _thisProjectFunction(name) { var i = 0; var len = this.compositions.length; while (i < len) { if (this.compositions[i].data && this.compositions[i].data.nm === name) { if (this.compositions[i].prepareFrame && this.compositions[i].data.xt) { this.compositions[i].prepareFrame(this.currentFrame) } return this.compositions[i].compInterface } i += 1 } return null } _thisProjectFunction.compositions = []; _thisProjectFunction.currentFrame = 0; _thisProjectFunction.registerComposition = registerComposition; return _thisProjectFunction } }(); var renderers = {}; var registerRenderer = function registerRenderer(key, value) { renderers[key] = value }; function getRenderer(key) { return renderers[key] } function _typeof4ドル(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof4ドル = function _typeof(obj) { return typeof obj } } else { _typeof4ドル = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj } } return _typeof4ドル(obj) } var AnimationItem = function AnimationItem() { this._cbs = []; this.name = ''; this.path = ''; this.isLoaded = false; this.currentFrame = 0; this.currentRawFrame = 0; this.firstFrame = 0; this.totalFrames = 0; this.frameRate = 0; this.frameMult = 0; this.playSpeed = 1; this.playDirection = 1; this.playCount = 0; this.animationData = {}; this.assets = []; this.isPaused = true; this.autoplay = false; this.loop = true; this.renderer = null; this.animationID = createElementID(); this.assetsPath = ''; this.timeCompleted = 0; this.segmentPos = 0; this.isSubframeEnabled = getSubframeEnabled(); this.segments = []; this._idle = true; this._completedLoop = false; this.projectInterface = ProjectInterface(); this.imagePreloader = new ImagePreloader(); this.audioController = audioControllerFactory(); this.markers = []; this.configAnimation = this.configAnimation.bind(this); this.onSetupError = this.onSetupError.bind(this); this.onSegmentComplete = this.onSegmentComplete.bind(this); this.drawnFrameEvent = new BMEnterFrameEvent('drawnFrame', 0, 0, 0) }; extendPrototype([BaseEvent], AnimationItem); AnimationItem.prototype.setParams = function (params) { if (params.wrapper || params.container) { this.wrapper = params.wrapper || params.container } var animType = 'svg'; if (params.animType) { animType = params.animType } else if (params.renderer) { animType = params.renderer } var RendererClass = getRenderer(animType); this.renderer = new RendererClass(this, params.rendererSettings); this.imagePreloader.setCacheType(animType, this.renderer.globalData.defs); this.renderer.setProjectInterface(this.projectInterface); this.animType = animType; if (params.loop === '' || params.loop === null || params.loop === undefined || params.loop === true) { this.loop = true } else if (params.loop === false) { this.loop = false } else { this.loop = parseInt(params.loop, 10) } this.autoplay = 'autoplay' in params ? params.autoplay : true; this.name = params.name ? params.name : ''; this.autoloadSegments = Object.prototype.hasOwnProperty.call(params, 'autoloadSegments') ? params.autoloadSegments : true; this.assetsPath = params.assetsPath; this.initialSegment = params.initialSegment; if (params.audioFactory) { this.audioController.setAudioFactory(params.audioFactory) } if (params.animationData) { this.setupAnimation(params.animationData) } else if (params.path) { if (params.path.lastIndexOf('\\') !== -1) { this.path = params.path.substr(0, params.path.lastIndexOf('\\') + 1) } else { this.path = params.path.substr(0, params.path.lastIndexOf('/') + 1) } this.fileName = params.path.substr(params.path.lastIndexOf('/') + 1); this.fileName = this.fileName.substr(0, this.fileName.lastIndexOf('.json')); dataManager.loadAnimation(params.path, this.configAnimation, this.onSetupError) } }; AnimationItem.prototype.onSetupError = function () { this.trigger('data_failed') }; AnimationItem.prototype.setupAnimation = function (data) { dataManager.completeAnimation(data, this.configAnimation) }; AnimationItem.prototype.setData = function (wrapper, animationData) { if (animationData) { if (_typeof4ドル(animationData) !== 'object') { animationData = JSON.parse(animationData) } } var params = { wrapper: wrapper, animationData: animationData }; var wrapperAttributes = wrapper.attributes; 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 : ''; 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 : 'canvas'; 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 : ''; if (loop === 'false') { params.loop = false } else if (loop === 'true') { params.loop = true } else if (loop !== '') { params.loop = parseInt(loop, 10) } var 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; params.autoplay = autoplay !== 'false'; 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 : ''; var prerender = 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 : ''; if (prerender === 'false') { params.prerender = false } this.setParams(params) }; AnimationItem.prototype.includeLayers = function (data) { if (data.op> this.animationData.op) {
this.animationData.op = data.op;
this.totalFrames = Math.floor(data.op - this.animationData.ip)
}
var layers = this.animationData.layers;
var i;
var len = layers.length;
var newLayers = data.layers;
var j;
var jLen = newLayers.length;
for (j = 0; j < jLen; j += 1) { i = 0; while (i < len) { if (layers[i].id === newLayers[j].id) { layers[i] = newLayers[j]; break } i += 1 } } if (data.chars || data.fonts) { this.renderer.globalData.fontManager.addChars(data.chars); this.renderer.globalData.fontManager.addFonts(data.fonts, this.renderer.globalData.defs) } if (data.assets) { len = data.assets.length; for (i = 0; i < len; i += 1) { this.animationData.assets.push(data.assets[i]) } } this.animationData.__complete = false; dataManager.completeAnimation(this.animationData, this.onSegmentComplete) }; AnimationItem.prototype.onSegmentComplete = function (data) { this.animationData = data; var expressionsPlugin = getExpressionsPlugin(); if (expressionsPlugin) { expressionsPlugin.initExpressions(this) } this.loadNextSegment() }; AnimationItem.prototype.loadNextSegment = function () { var segments = this.animationData.segments; if (!segments || segments.length === 0 || !this.autoloadSegments) { this.trigger('data_ready'); this.timeCompleted = this.totalFrames; return } var segment = segments.shift(); this.timeCompleted = segment.time * this.frameRate; var segmentPath = this.path + this.fileName + '_' + this.segmentPos + '.json'; this.segmentPos += 1; dataManager.loadData(segmentPath, this.includeLayers.bind(this), function () { this.trigger('data_failed') }.bind(this)) }; AnimationItem.prototype.loadSegments = function () { var segments = this.animationData.segments; if (!segments) { this.timeCompleted = this.totalFrames } this.loadNextSegment() }; AnimationItem.prototype.imagesLoaded = function () { this.trigger('loaded_images'); this.checkLoaded() }; AnimationItem.prototype.preloadImages = function () { this.imagePreloader.setAssetsPath(this.assetsPath); this.imagePreloader.setPath(this.path); this.imagePreloader.loadAssets(this.animationData.assets, this.imagesLoaded.bind(this)) }; AnimationItem.prototype.configAnimation = function (animData) { if (!this.renderer) { return } try { this.animationData = animData; if (this.initialSegment) { this.totalFrames = Math.floor(this.initialSegment[1] - this.initialSegment[0]); this.firstFrame = Math.round(this.initialSegment[0]) } else { this.totalFrames = Math.floor(this.animationData.op - this.animationData.ip); this.firstFrame = Math.round(this.animationData.ip) } this.renderer.configAnimation(animData); if (!animData.assets) { animData.assets = [] } this.assets = this.animationData.assets; this.frameRate = this.animationData.fr; this.frameMult = this.animationData.fr / 1000; this.renderer.searchExtraCompositions(animData.assets); this.markers = markerParser(animData.markers || []); this.trigger('config_ready'); this.preloadImages(); this.loadSegments(); this.updaFrameModifier(); this.waitForFontsLoaded(); if (this.isPaused) { this.audioController.pause() } } catch (error) { this.triggerConfigError(error) } }; AnimationItem.prototype.waitForFontsLoaded = function () { if (!this.renderer) { return } if (this.renderer.globalData.fontManager.isLoaded) { this.checkLoaded() } else { setTimeout(this.waitForFontsLoaded.bind(this), 20) } }; AnimationItem.prototype.checkLoaded = function () { if (!this.isLoaded && this.renderer.globalData.fontManager.isLoaded && (this.imagePreloader.loadedImages() || this.renderer.rendererType !== 'canvas') && this.imagePreloader.loadedFootages()) { this.isLoaded = true; var expressionsPlugin = getExpressionsPlugin(); if (expressionsPlugin) { expressionsPlugin.initExpressions(this) } this.renderer.initItems(); setTimeout(function () { this.trigger('DOMLoaded') }.bind(this), 0); this.gotoFrame(); if (this.autoplay) { this.play() } } }; AnimationItem.prototype.resize = function () { this.renderer.updateContainerSize() }; AnimationItem.prototype.setSubframe = function (flag) { this.isSubframeEnabled = !!flag }; AnimationItem.prototype.gotoFrame = function () { this.currentFrame = this.isSubframeEnabled ? this.currentRawFrame : ~~this.currentRawFrame; if (this.timeCompleted !== this.totalFrames && this.currentFrame> this.timeCompleted) {
this.currentFrame = this.timeCompleted
}
this.trigger('enterFrame');
this.renderFrame();
this.trigger('drawnFrame')
};
AnimationItem.prototype.renderFrame = function () {
if (this.isLoaded === false || !this.renderer) {
return
}
try {
this.renderer.renderFrame(this.currentFrame + this.firstFrame)
} catch (error) {
this.triggerRenderFrameError(error)
}
};
AnimationItem.prototype.play = function (name) {
if (name && this.name !== name) {
return
}
if (this.isPaused === true) {
this.isPaused = false;
this.trigger('_pause');
this.audioController.resume();
if (this._idle) {
this._idle = false;
this.trigger('_active')
}
}
};
AnimationItem.prototype.pause = function (name) {
if (name && this.name !== name) {
return
}
if (this.isPaused === false) {
this.isPaused = true;
this.trigger('_play');
this._idle = true;
this.trigger('_idle');
this.audioController.pause()
}
};
AnimationItem.prototype.togglePause = function (name) {
if (name && this.name !== name) {
return
}
if (this.isPaused === true) {
this.play()
} else {
this.pause()
}
};
AnimationItem.prototype.stop = function (name) {
if (name && this.name !== name) {
return
}
this.pause();
this.playCount = 0;
this._completedLoop = false;
this.setCurrentRawFrameValue(0)
};
AnimationItem.prototype.getMarkerData = function (markerName) {
var marker;
for (var i = 0; i < this.markers.length; i += 1) { marker = this.markers[i]; if (marker.payload && marker.payload.name === markerName) { return marker } } return null }; AnimationItem.prototype.goToAndStop = function (value, isFrame, name) { if (name && this.name !== name) { return } var numValue = Number(value); if (isNaN(numValue)) { var marker = this.getMarkerData(value); if (marker) { this.goToAndStop(marker.time, true) } } else if (isFrame) { this.setCurrentRawFrameValue(value) } else { this.setCurrentRawFrameValue(value * this.frameModifier) } this.pause() }; AnimationItem.prototype.goToAndPlay = function (value, isFrame, name) { if (name && this.name !== name) { return } var numValue = Number(value); if (isNaN(numValue)) { var marker = this.getMarkerData(value); if (marker) { if (!marker.duration) { this.goToAndStop(marker.time, true) } else { this.playSegments([marker.time, marker.time + marker.duration], true) } } } else { this.goToAndStop(numValue, isFrame, name) } this.play() }; AnimationItem.prototype.advanceTime = function (value) { if (this.isPaused === true || this.isLoaded === false) { return } var nextValue = this.currentRawFrame + value * this.frameModifier; var _isComplete = false; if (nextValue>= this.totalFrames - 1 && this.frameModifier> 0) {
if (!this.loop || this.playCount === this.loop) {
if (!this.checkSegments(nextValue> this.totalFrames ? nextValue % this.totalFrames : 0)) {
_isComplete = true;
nextValue = this.totalFrames - 1
}
} else if (nextValue>= this.totalFrames) {
this.playCount += 1;
if (!this.checkSegments(nextValue % this.totalFrames)) {
this.setCurrentRawFrameValue(nextValue % this.totalFrames);
this._completedLoop = true;
this.trigger('loopComplete')
}
} else {
this.setCurrentRawFrameValue(nextValue)
}
} else if (nextValue < 0) { if (!this.checkSegments(nextValue % this.totalFrames)) { if (this.loop && !(this.playCount-- <= 0 && this.loop !== true)) { this.setCurrentRawFrameValue(this.totalFrames + nextValue % this.totalFrames); if (!this._completedLoop) { this._completedLoop = true } else { this.trigger('loopComplete') } } else { _isComplete = true; nextValue = 0 } } } else { this.setCurrentRawFrameValue(nextValue) } if (_isComplete) { this.setCurrentRawFrameValue(nextValue); this.pause(); this.trigger('complete') } }; AnimationItem.prototype.adjustSegment = function (arr, offset) { this.playCount = 0; if (arr[1] < arr[0]) { if (this.frameModifier> 0) {
if (this.playSpeed < 0) { this.setSpeed(-this.playSpeed) } else { this.setDirection(-1) } } this.totalFrames = arr[0] - arr[1]; this.timeCompleted = this.totalFrames; this.firstFrame = arr[1]; this.setCurrentRawFrameValue(this.totalFrames - 0.001 - offset) } else if (arr[1]> arr[0]) {
if (this.frameModifier < 0) { if (this.playSpeed < 0) { this.setSpeed(-this.playSpeed) } else { this.setDirection(1) } } this.totalFrames = arr[1] - arr[0]; this.timeCompleted = this.totalFrames; this.firstFrame = arr[0]; this.setCurrentRawFrameValue(0.001 + offset) } this.trigger('segmentStart') }; AnimationItem.prototype.setSegment = function (init, end) { var pendingFrame = -1; if (this.isPaused) { if (this.currentRawFrame + this.firstFrame < init) { pendingFrame = init } else if (this.currentRawFrame + this.firstFrame> end) {
pendingFrame = end - init
}
}
this.firstFrame = init;
this.totalFrames = end - init;
this.timeCompleted = this.totalFrames;
if (pendingFrame !== -1) {
this.goToAndStop(pendingFrame, true)
}
};
AnimationItem.prototype.playSegments = function (arr, forceFlag) {
if (forceFlag) {
this.segments.length = 0
}
if (_typeof4ドル(arr[0]) === 'object') {
var i;
var len = arr.length;
for (i = 0; i < len; i += 1) { this.segments.push(arr[i]) } } else { this.segments.push(arr) } if (this.segments.length && forceFlag) { this.adjustSegment(this.segments.shift(), 0) } if (this.isPaused) { this.play() } }; AnimationItem.prototype.resetSegments = function (forceFlag) { this.segments.length = 0; this.segments.push([this.animationData.ip, this.animationData.op]); if (forceFlag) { this.checkSegments(0) } }; AnimationItem.prototype.checkSegments = function (offset) { if (this.segments.length) { this.adjustSegment(this.segments.shift(), offset); return true } return false }; AnimationItem.prototype.destroy = function (name) { if (name && this.name !== name || !this.renderer) { return } this.renderer.destroy(); this.imagePreloader.destroy(); this.trigger('destroy'); this._cbs = null; this.onEnterFrame = null; this.onLoopComplete = null; this.onComplete = null; this.onSegmentStart = null; this.onDestroy = null; this.renderer = null; this.renderer = null; this.imagePreloader = null; this.projectInterface = null }; AnimationItem.prototype.setCurrentRawFrameValue = function (value) { this.currentRawFrame = value; this.gotoFrame() }; AnimationItem.prototype.setSpeed = function (val) { this.playSpeed = val; this.updaFrameModifier() }; AnimationItem.prototype.setDirection = function (val) { this.playDirection = val < 0 ? -1 : 1; this.updaFrameModifier() }; AnimationItem.prototype.setVolume = function (val, name) { if (name && this.name !== name) { return } this.audioController.setVolume(val) }; AnimationItem.prototype.getVolume = function () { return this.audioController.getVolume() }; AnimationItem.prototype.mute = function (name) { if (name && this.name !== name) { return } this.audioController.mute() }; AnimationItem.prototype.unmute = function (name) { if (name && this.name !== name) { return } this.audioController.unmute() }; AnimationItem.prototype.updaFrameModifier = function () { this.frameModifier = this.frameMult * this.playSpeed * this.playDirection; this.audioController.setRate(this.playSpeed * this.playDirection) }; AnimationItem.prototype.getPath = function () { return this.path }; AnimationItem.prototype.getAssetsPath = function (assetData) { var path = ''; if (assetData.e) { path = assetData.p } else if (this.assetsPath) { var imagePath = assetData.p; if (imagePath.indexOf('images/') !== -1) { imagePath = imagePath.split('/')[1] } path = this.assetsPath + imagePath } else { path = this.path; path += assetData.u ? assetData.u : ''; path += assetData.p } return path }; AnimationItem.prototype.getAssetData = function (id) { var i = 0; var len = this.assets.length; while (i < len) { if (id === this.assets[i].id) { return this.assets[i] } i += 1 } return null }; AnimationItem.prototype.hide = function () { this.renderer.hide() }; AnimationItem.prototype.show = function () { this.renderer.show() }; AnimationItem.prototype.getDuration = function (isFrame) { return isFrame ? this.totalFrames : this.totalFrames / this.frameRate }; AnimationItem.prototype.updateDocumentData = function (path, documentData, index) { try { var element = this.renderer.getElementByPath(path); element.updateDocumentData(documentData, index) } catch (error) {} }; AnimationItem.prototype.trigger = function (name) { if (this._cbs && this._cbs[name]) { switch (name) { case 'enterFrame': this.triggerEvent(name, new BMEnterFrameEvent(name, this.currentFrame, this.totalFrames, this.frameModifier)); break; case 'drawnFrame': this.drawnFrameEvent.currentTime = this.currentFrame; this.drawnFrameEvent.totalTime = this.totalFrames; this.drawnFrameEvent.direction = this.frameModifier; this.triggerEvent(name, this.drawnFrameEvent); break; case 'loopComplete': this.triggerEvent(name, new BMCompleteLoopEvent(name, this.loop, this.playCount, this.frameMult)); break; case 'complete': this.triggerEvent(name, new BMCompleteEvent(name, this.frameMult)); break; case 'segmentStart': this.triggerEvent(name, new BMSegmentStartEvent(name, this.firstFrame, this.totalFrames)); break; case 'destroy': this.triggerEvent(name, new BMDestroyEvent(name, this)); break; default: this.triggerEvent(name) } } if (name === 'enterFrame' && this.onEnterFrame) { this.onEnterFrame.call(this, new BMEnterFrameEvent(name, this.currentFrame, this.totalFrames, this.frameMult)) } if (name === 'loopComplete' && this.onLoopComplete) { this.onLoopComplete.call(this, new BMCompleteLoopEvent(name, this.loop, this.playCount, this.frameMult)) } if (name === 'complete' && this.onComplete) { this.onComplete.call(this, new BMCompleteEvent(name, this.frameMult)) } if (name === 'segmentStart' && this.onSegmentStart) { this.onSegmentStart.call(this, new BMSegmentStartEvent(name, this.firstFrame, this.totalFrames)) } if (name === 'destroy' && this.onDestroy) { this.onDestroy.call(this, new BMDestroyEvent(name, this)) } }; AnimationItem.prototype.triggerRenderFrameError = function (nativeError) { var error = new BMRenderFrameErrorEvent(nativeError, this.currentFrame); this.triggerEvent('error', error); if (this.onError) { this.onError.call(this, error) } }; AnimationItem.prototype.triggerConfigError = function (nativeError) { var error = new BMConfigErrorEvent(nativeError, this.currentFrame); this.triggerEvent('error', error); if (this.onError) { this.onError.call(this, error) } }; var animationManager = function () { var moduleOb = {}; var registeredAnimations = []; var initTime = 0; var len = 0; var playingAnimationsNum = 0; var _stopped = true; var _isFrozen = false; function removeElement(ev) { var i = 0; var animItem = ev.target; while (i < len) { if (registeredAnimations[i].animation === animItem) { registeredAnimations.splice(i, 1); i -= 1; len -= 1; if (!animItem.isPaused) { subtractPlayingCount() } } i += 1 } } function registerAnimation(element, animationData) { if (!element) { return null } var i = 0; while (i < len) { if (registeredAnimations[i].elem === element && registeredAnimations[i].elem !== null) { return registeredAnimations[i].animation } i += 1 } var animItem = new AnimationItem(); setupAnimation(animItem, element); animItem.setData(element, animationData); return animItem } function getRegisteredAnimations() { var i; var lenAnims = registeredAnimations.length; var animations = []; for (i = 0; i < lenAnims; i += 1) { animations.push(registeredAnimations[i].animation) } return animations } function addPlayingCount() { playingAnimationsNum += 1; activate() } function subtractPlayingCount() { playingAnimationsNum -= 1 } function setupAnimation(animItem, element) { animItem.addEventListener('destroy', removeElement); animItem.addEventListener('_active', addPlayingCount); animItem.addEventListener('_idle', subtractPlayingCount); registeredAnimations.push({ elem: element, animation: animItem }); len += 1 } function loadAnimation(params) { var animItem = new AnimationItem(); setupAnimation(animItem, null); animItem.setParams(params); return animItem } function setSpeed(val, animation) { var i; for (i = 0; i < len; i += 1) { registeredAnimations[i].animation.setSpeed(val, animation) } } function setDirection(val, animation) { var i; for (i = 0; i < len; i += 1) { registeredAnimations[i].animation.setDirection(val, animation) } } function play(animation) { var i; for (i = 0; i < len; i += 1) { registeredAnimations[i].animation.play(animation) } } function resume(nowTime) { var elapsedTime = nowTime - initTime; var i; for (i = 0; i < len; i += 1) { registeredAnimations[i].animation.advanceTime(elapsedTime) } initTime = nowTime; if (playingAnimationsNum && !_isFrozen) { window.requestAnimationFrame(resume) } else { _stopped = true } } function first(nowTime) { initTime = nowTime; window.requestAnimationFrame(resume) } function pause(animation) { var i; for (i = 0; i < len; i += 1) { registeredAnimations[i].animation.pause(animation) } } function goToAndStop(value, isFrame, animation) { var i; for (i = 0; i < len; i += 1) { registeredAnimations[i].animation.goToAndStop(value, isFrame, animation) } } function stop(animation) { var i; for (i = 0; i < len; i += 1) { registeredAnimations[i].animation.stop(animation) } } function togglePause(animation) { var i; for (i = 0; i < len; i += 1) { registeredAnimations[i].animation.togglePause(animation) } } function destroy(animation) { var i; for (i = len - 1; i>= 0; i -= 1) {
registeredAnimations[i].animation.destroy(animation)
}
}
function searchAnimations(animationData, standalone, renderer) {
var animElements = [].concat([].slice.call(document.getElementsByClassName('lottie')), [].slice.call(document.getElementsByClassName('bodymovin')));
var i;
var lenAnims = animElements.length;
for (i = 0; i < lenAnims; i += 1) { if (renderer) { animElements[i].setAttribute('data-bm-type', renderer) } registerAnimation(animElements[i], animationData) } if (standalone && lenAnims === 0) { if (!renderer) { renderer = 'svg' } var body = document.getElementsByTagName('body')[0]; body.innerText = ''; var div = createTag('div'); div.style.width = '100%'; div.style.height = '100%'; div.setAttribute('data-bm-type', renderer); body.appendChild(div); registerAnimation(div, animationData) } } function resize() { var i; for (i = 0; i < len; i += 1) { registeredAnimations[i].animation.resize() } } function activate() { if (!_isFrozen && playingAnimationsNum) { if (_stopped) { window.requestAnimationFrame(first); _stopped = false } } } function freeze() { _isFrozen = true } function unfreeze() { _isFrozen = false; activate() } function setVolume(val, animation) { var i; for (i = 0; i < len; i += 1) { registeredAnimations[i].animation.setVolume(val, animation) } } function mute(animation) { var i; for (i = 0; i < len; i += 1) { registeredAnimations[i].animation.mute(animation) } } function unmute(animation) { var i; for (i = 0; i < len; i += 1) { registeredAnimations[i].animation.unmute(animation) } } moduleOb.registerAnimation = registerAnimation; moduleOb.loadAnimation = loadAnimation; moduleOb.setSpeed = setSpeed; moduleOb.setDirection = setDirection; moduleOb.play = play; moduleOb.pause = pause; moduleOb.stop = stop; moduleOb.togglePause = togglePause; moduleOb.searchAnimations = searchAnimations; moduleOb.resize = resize; moduleOb.goToAndStop = goToAndStop; moduleOb.destroy = destroy; moduleOb.freeze = freeze; moduleOb.unfreeze = unfreeze; moduleOb.setVolume = setVolume; moduleOb.mute = mute; moduleOb.unmute = unmute; moduleOb.getRegisteredAnimations = getRegisteredAnimations; return moduleOb }(); var BezierFactory = function () { var ob = {}; ob.getBezierEasing = getBezierEasing; var beziers = {}; function getBezierEasing(a, b, c, d, nm) { var str = nm || ('bez_' + a + '_' + b + '_' + c + '_' + d).replace(/\./g, 'p'); if (beziers[str]) { return beziers[str] } var bezEasing = new BezierEasing([a, b, c, d]); beziers[str] = bezEasing; return bezEasing } var NEWTON_ITERATIONS = 4; var NEWTON_MIN_SLOPE = 0.001; var SUBDIVISION_PRECISION = 0.0000001; var SUBDIVISION_MAX_ITERATIONS = 10; var kSplineTableSize = 11; var kSampleStepSize = 1.0 / (kSplineTableSize - 1.0); var float32ArraySupported = typeof Float32Array === 'function'; function A(aA1, aA2) { return 1.0 - 3.0 * aA2 + 3.0 * aA1 } function B(aA1, aA2) { return 3.0 * aA2 - 6.0 * aA1 } function C(aA1) { return 3.0 * aA1 } function calcBezier(aT, aA1, aA2) { return ((A(aA1, aA2) * aT + B(aA1, aA2)) * aT + C(aA1)) * aT } function getSlope(aT, aA1, aA2) { return 3.0 * A(aA1, aA2) * aT * aT + 2.0 * B(aA1, aA2) * aT + C(aA1) } function binarySubdivide(aX, aA, aB, mX1, mX2) { var currentX, currentT, i = 0; do { currentT = aA + (aB - aA) / 2.0; currentX = calcBezier(currentT, mX1, mX2) - aX; if (currentX> 0.0) {
aB = currentT
} else {
aA = currentT
}
} while (Math.abs(currentX)> SUBDIVISION_PRECISION && ++i < SUBDIVISION_MAX_ITERATIONS); return currentT } function newtonRaphsonIterate(aX, aGuessT, mX1, mX2) { for (var i = 0; i < NEWTON_ITERATIONS; ++i) { var currentSlope = getSlope(aGuessT, mX1, mX2); if (currentSlope === 0.0) return aGuessT; var currentX = calcBezier(aGuessT, mX1, mX2) - aX; aGuessT -= currentX / currentSlope } return aGuessT } function BezierEasing(points) { this._p = points; this._mSampleValues = float32ArraySupported ? new Float32Array(kSplineTableSize) : new Array(kSplineTableSize); this._precomputed = false; this.get = this.get.bind(this) } BezierEasing.prototype = { get: function get(x) { var mX1 = this._p[0], mY1 = this._p[1], mX2 = this._p[2], mY2 = this._p[3]; if (!this._precomputed) this._precompute(); if (mX1 === mY1 && mX2 === mY2) return x; if (x === 0) return 0; if (x === 1) return 1; return calcBezier(this._getTForX(x), mY1, mY2) }, _precompute: function _precompute() { var mX1 = this._p[0], mY1 = this._p[1], mX2 = this._p[2], mY2 = this._p[3]; this._precomputed = true; if (mX1 !== mY1 || mX2 !== mY2) { this._calcSampleValues() } }, _calcSampleValues: function _calcSampleValues() { var mX1 = this._p[0], mX2 = this._p[2]; for (var i = 0; i < kSplineTableSize; ++i) { this._mSampleValues[i] = calcBezier(i * kSampleStepSize, mX1, mX2) } }, _getTForX: function _getTForX(aX) { var mX1 = this._p[0], mX2 = this._p[2], mSampleValues = this._mSampleValues; var intervalStart = 0.0; var currentSample = 1; var lastSample = kSplineTableSize - 1; for (; currentSample !== lastSample && mSampleValues[currentSample] <= aX; ++currentSample) { intervalStart += kSampleStepSize }--currentSample; var dist = (aX - mSampleValues[currentSample]) / (mSampleValues[currentSample + 1] - mSampleValues[currentSample]); var guessForT = intervalStart + dist * kSampleStepSize; var initialSlope = getSlope(guessForT, mX1, mX2); if (initialSlope>= NEWTON_MIN_SLOPE) {
return newtonRaphsonIterate(aX, guessForT, mX1, mX2)
}
if (initialSlope === 0.0) {
return guessForT
}
return binarySubdivide(aX, intervalStart, intervalStart + kSampleStepSize, mX1, mX2)
}
};
return ob
}();
var pooling = function () {
function _double(arr) {
return arr.concat(createSizedArray(arr.length))
}
return {
"double": _double
}
}();
var poolFactory = function () {
return function (initialLength, _create, _release) {
var _length = 0;
var _maxLength = initialLength;
var pool = createSizedArray(_maxLength);
var ob = {
newElement: newElement,
release: release
};
function newElement() {
var element;
if (_length) {
_length -= 1;
element = pool[_length]
} else {
element = _create()
}
return element
}
function release(element) {
if (_length === _maxLength) {
pool = pooling["double"](pool);
_maxLength *= 2
}
if (_release) {
_release(element)
}
pool[_length] = element;
_length += 1
}
return ob
}
}();
var bezierLengthPool = function () {
function create() {
return {
addedLength: 0,
percents: createTypedArray('float32', getDefaultCurveSegments()),
lengths: createTypedArray('float32', getDefaultCurveSegments())
}
}
return poolFactory(8, create)
}();
var segmentsLengthPool = function () {
function create() {
return {
lengths: [],
totalLength: 0
}
}
function release(element) {
var i;
var len = element.lengths.length;
for (i = 0; i < len; i += 1) { bezierLengthPool.release(element.lengths[i]) } element.lengths.length = 0 } return poolFactory(8, create, release) }(); function bezFunction() { var math = Math; function pointOnLine2D(x1, y1, x2, y2, x3, y3) { var det1 = x1 * y2 + y1 * x3 + x2 * y3 - x3 * y2 - y3 * x1 - x2 * y1; return det1> -0.001 && det1 < 0.001 } function pointOnLine3D(x1, y1, z1, x2, y2, z2, x3, y3, z3) { if (z1 === 0 && z2 === 0 && z3 === 0) { return pointOnLine2D(x1, y1, x2, y2, x3, y3) } var dist1 = math.sqrt(math.pow(x2 - x1, 2) + math.pow(y2 - y1, 2) + math.pow(z2 - z1, 2)); var dist2 = math.sqrt(math.pow(x3 - x1, 2) + math.pow(y3 - y1, 2) + math.pow(z3 - z1, 2)); var dist3 = math.sqrt(math.pow(x3 - x2, 2) + math.pow(y3 - y2, 2) + math.pow(z3 - z2, 2)); var diffDist; if (dist1> dist2) {
if (dist1> dist3) {
diffDist = dist1 - dist2 - dist3
} else {
diffDist = dist3 - dist2 - dist1
}
} else if (dist3> dist2) {
diffDist = dist3 - dist2 - dist1
} else {
diffDist = dist2 - dist1 - dist3
}
return diffDist> -0.0001 && diffDist < 0.0001 } var getBezierLength = function () { return function (pt1, pt2, pt3, pt4) { var curveSegments = getDefaultCurveSegments(); var k; var i; var len; var ptCoord; var perc; var addedLength = 0; var ptDistance; var point = []; var lastPoint = []; var lengthData = bezierLengthPool.newElement(); len = pt3.length; for (k = 0; k < curveSegments; k += 1) { perc = k / (curveSegments - 1); ptDistance = 0; for (i = 0; i < len; i += 1) { 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]; point[i] = ptCoord; if (lastPoint[i] !== null) { ptDistance += bmPow(point[i] - lastPoint[i], 2) } lastPoint[i] = point[i] } if (ptDistance) { ptDistance = bmSqrt(ptDistance); addedLength += ptDistance } lengthData.percents[k] = perc; lengthData.lengths[k] = addedLength } lengthData.addedLength = addedLength; return lengthData } }(); function getSegmentsLength(shapeData) { var segmentsLength = segmentsLengthPool.newElement(); var closed = shapeData.c; var pathV = shapeData.v; var pathO = shapeData.o; var pathI = shapeData.i; var i; var len = shapeData._length; var lengths = segmentsLength.lengths; var totalLength = 0; for (i = 0; i < len - 1; i += 1) { lengths[i] = getBezierLength(pathV[i], pathV[i + 1], pathO[i], pathI[i + 1]); totalLength += lengths[i].addedLength } if (closed && len) { lengths[i] = getBezierLength(pathV[i], pathV[0], pathO[i], pathI[0]); totalLength += lengths[i].addedLength } segmentsLength.totalLength = totalLength; return segmentsLength } function BezierData(length) { this.segmentLength = 0; this.points = new Array(length) } function PointData(partial, point) { this.partialLength = partial; this.point = point } var buildBezierData = function () { var storedData = {}; return function (pt1, pt2, pt3, pt4) { var bezierName = (pt1[0] + '_' + pt1[1] + '_' + pt2[0] + '_' + pt2[1] + '_' + pt3[0] + '_' + pt3[1] + '_' + pt4[0] + '_' + pt4[1]).replace(/\./g, 'p'); if (!storedData[bezierName]) { var curveSegments = getDefaultCurveSegments(); var k; var i; var len; var ptCoord; var perc; var addedLength = 0; var ptDistance; var point; var lastPoint = null; 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 } var bezierData = new BezierData(curveSegments); len = pt3.length; for (k = 0; k < curveSegments; k += 1) { point = createSizedArray(len); perc = k / (curveSegments - 1); ptDistance = 0; for (i = 0; i < len; i += 1) { 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]; point[i] = ptCoord; if (lastPoint !== null) { ptDistance += bmPow(point[i] - lastPoint[i], 2) } } ptDistance = bmSqrt(ptDistance); addedLength += ptDistance; bezierData.points[k] = new PointData(ptDistance, point); lastPoint = point } bezierData.segmentLength = addedLength; storedData[bezierName] = bezierData } return storedData[bezierName] } }(); function getDistancePerc(perc, bezierData) { var percents = bezierData.percents; var lengths = bezierData.lengths; var len = percents.length; var initPos = bmFloor((len - 1) * perc); var lengthPos = perc * bezierData.addedLength; var lPerc = 0; if (initPos === len - 1 || initPos === 0 || lengthPos === lengths[initPos]) { return percents[initPos] } var dir = lengths[initPos]> lengthPos ? -1 : 1;
var flag = true;
while (flag) {
if (lengths[initPos] <= lengthPos && lengths[initPos + 1]> lengthPos) {
lPerc = (lengthPos - lengths[initPos]) / (lengths[initPos + 1] - lengths[initPos]);
flag = false
} else {
initPos += dir
}
if (initPos < 0 || initPos>= len - 1) {
if (initPos === len - 1) {
return percents[initPos]
}
flag = false
}
}
return percents[initPos] + (percents[initPos + 1] - percents[initPos]) * lPerc
}
function getPointInSegment(pt1, pt2, pt3, pt4, percent, bezierData) {
var t1 = getDistancePerc(percent, bezierData);
var u1 = 1 - t1;
var ptX = 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]) * 1000) / 1000;
var ptY = 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]) * 1000) / 1000;
return [ptX, ptY]
}
var bezierSegmentPoints = createTypedArray('float32', 8);
function getNewSegment(pt1, pt2, pt3, pt4, startPerc, endPerc, bezierData) {
if (startPerc < 0) { startPerc = 0 } else if (startPerc> 1) {
startPerc = 1
}
var t0 = getDistancePerc(startPerc, bezierData);
endPerc = endPerc> 1 ? 1 : endPerc;
var t1 = getDistancePerc(endPerc, bezierData);
var i;
var len = pt1.length;
var u0 = 1 - t0;
var u1 = 1 - t1;
var u0u0u0 = u0 * u0 * u0;
var t0u0u0_3 = t0 * u0 * u0 * 3;
var t0t0u0_3 = t0 * t0 * u0 * 3;
var t0t0t0 = t0 * t0 * t0;
var u0u0u1 = u0 * u0 * u1;
var t0u0u1_3 = t0 * u0 * u1 + u0 * t0 * u1 + u0 * u0 * t1;
var t0t0u1_3 = t0 * t0 * u1 + u0 * t0 * t1 + t0 * u0 * t1;
var t0t0t1 = t0 * t0 * t1;
var u0u1u1 = u0 * u1 * u1;
var t0u1u1_3 = t0 * u1 * u1 + u0 * t1 * u1 + u0 * u1 * t1;
var t0t1u1_3 = t0 * t1 * u1 + u0 * t1 * t1 + t0 * u1 * t1;
var t0t1t1 = t0 * t1 * t1;
var u1u1u1 = u1 * u1 * u1;
var t1u1u1_3 = t1 * u1 * u1 + u1 * t1 * u1 + u1 * u1 * t1;
var t1t1u1_3 = t1 * t1 * u1 + u1 * t1 * t1 + t1 * u1 * t1;
var t1t1t1 = t1 * t1 * t1;
for (i = 0; i < len; i += 1) { bezierSegmentPoints[i * 4] = math.round((u0u0u0 * pt1[i] + t0u0u0_3 * pt3[i] + t0t0u0_3 * pt4[i] + t0t0t0 * pt2[i]) * 1000) / 1000; bezierSegmentPoints[i * 4 + 1] = math.round((u0u0u1 * pt1[i] + t0u0u1_3 * pt3[i] + t0t0u1_3 * pt4[i] + t0t0t1 * pt2[i]) * 1000) / 1000; bezierSegmentPoints[i * 4 + 2] = math.round((u0u1u1 * pt1[i] + t0u1u1_3 * pt3[i] + t0t1u1_3 * pt4[i] + t0t1t1 * pt2[i]) * 1000) / 1000; bezierSegmentPoints[i * 4 + 3] = math.round((u1u1u1 * pt1[i] + t1u1u1_3 * pt3[i] + t1t1u1_3 * pt4[i] + t1t1t1 * pt2[i]) * 1000) / 1000 } return bezierSegmentPoints } return { getSegmentsLength: getSegmentsLength, getNewSegment: getNewSegment, getPointInSegment: getPointInSegment, buildBezierData: buildBezierData, pointOnLine2D: pointOnLine2D, pointOnLine3D: pointOnLine3D } } var bez = bezFunction(); var PropertyFactory = function () { var initFrame = initialDefaultFrame; var mathAbs = Math.abs; function interpolateValue(frameNum, caching) { var offsetTime = this.offsetTime; var newValue; if (this.propType === 'multidimensional') { newValue = createTypedArray('float32', this.pv.length) } var iterationIndex = caching.lastIndex; var i = iterationIndex; var len = this.keyframes.length - 1; var flag = true; var keyData; var nextKeyData; var keyframeMetadata; while (flag) { keyData = this.keyframes[i]; nextKeyData = this.keyframes[i + 1]; if (i === len - 1 && frameNum>= nextKeyData.t - offsetTime) {
if (keyData.h) {
keyData = nextKeyData
}
iterationIndex = 0;
break
}
if (nextKeyData.t - offsetTime> frameNum) {
iterationIndex = i;
break
}
if (i < len - 1) { i += 1 } else { iterationIndex = 0; flag = false } } keyframeMetadata = this.keyframesMetadata[i] || {}; var k; var kLen; var perc; var jLen; var j; var fnc; var nextKeyTime = nextKeyData.t - offsetTime; var keyTime = keyData.t - offsetTime; var endValue; if (keyData.to) { if (!keyframeMetadata.bezierData) { keyframeMetadata.bezierData = bez.buildBezierData(keyData.s, nextKeyData.s || keyData.e, keyData.to, keyData.ti) } var bezierData = keyframeMetadata.bezierData; if (frameNum>= nextKeyTime || frameNum < keyTime) { var ind = frameNum>= nextKeyTime ? bezierData.points.length - 1 : 0;
kLen = bezierData.points[ind].point.length;
for (k = 0; k < kLen; k += 1) { newValue[k] = bezierData.points[ind].point[k] } } else { if (keyframeMetadata.__fnct) { fnc = keyframeMetadata.__fnct } else { fnc = BezierFactory.getBezierEasing(keyData.o.x, keyData.o.y, keyData.i.x, keyData.i.y, keyData.n).get; keyframeMetadata.__fnct = fnc } perc = fnc((frameNum - keyTime) / (nextKeyTime - keyTime)); var distanceInLine = bezierData.segmentLength * perc; var segmentPerc; var addedLength = caching.lastFrame < frameNum && caching._lastKeyframeIndex === i ? caching._lastAddedLength : 0; j = caching.lastFrame < frameNum && caching._lastKeyframeIndex === i ? caching._lastPoint : 0; flag = true; jLen = bezierData.points.length; while (flag) { addedLength += bezierData.points[j].partialLength; if (distanceInLine === 0 || perc === 0 || j === bezierData.points.length - 1) { kLen = bezierData.points[j].point.length; for (k = 0; k < kLen; k += 1) { newValue[k] = bezierData.points[j].point[k] } break } else if (distanceInLine>= addedLength && distanceInLine < addedLength + bezierData.points[j + 1].partialLength) { segmentPerc = (distanceInLine - addedLength) / bezierData.points[j + 1].partialLength; kLen = bezierData.points[j].point.length; 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 } break } if (j < jLen - 1) { j += 1 } else { flag = false } } caching._lastPoint = j; caching._lastAddedLength = addedLength - bezierData.points[j].partialLength; caching._lastKeyframeIndex = i } } else { var outX; var outY; var inX; var inY; var keyValue; len = keyData.s.length; endValue = nextKeyData.s || keyData.e; if (this.sh && keyData.h !== 1) { if (frameNum>= nextKeyTime) {
newValue[0] = endValue[0];
newValue[1] = endValue[1];
newValue[2] = endValue[2]
} else if (frameNum <= keyTime) { newValue[0] = keyData.s[0]; newValue[1] = keyData.s[1]; newValue[2] = keyData.s[2] } else { var quatStart = createQuaternion(keyData.s); var quatEnd = createQuaternion(endValue); var time = (frameNum - keyTime) / (nextKeyTime - keyTime); quaternionToEuler(newValue, slerp(quatStart, quatEnd, time)) } } else { for (i = 0; i < len; i += 1) { if (keyData.h !== 1) { if (frameNum>= nextKeyTime) {
perc = 1
} else if (frameNum < keyTime) { perc = 0 } else { if (keyData.o.x.constructor === Array) { if (!keyframeMetadata.__fnct) { keyframeMetadata.__fnct = [] } if (!keyframeMetadata.__fnct[i]) { outX = keyData.o.x[i] === undefined ? keyData.o.x[0] : keyData.o.x[i]; outY = keyData.o.y[i] === undefined ? keyData.o.y[0] : keyData.o.y[i]; inX = keyData.i.x[i] === undefined ? keyData.i.x[0] : keyData.i.x[i]; inY = keyData.i.y[i] === undefined ? keyData.i.y[0] : keyData.i.y[i]; fnc = BezierFactory.getBezierEasing(outX, outY, inX, inY).get; keyframeMetadata.__fnct[i] = fnc } else { fnc = keyframeMetadata.__fnct[i] } } else if (!keyframeMetadata.__fnct) { outX = keyData.o.x; outY = keyData.o.y; inX = keyData.i.x; inY = keyData.i.y; fnc = BezierFactory.getBezierEasing(outX, outY, inX, inY).get; keyData.keyframeMetadata = fnc } else { fnc = keyframeMetadata.__fnct } perc = fnc((frameNum - keyTime) / (nextKeyTime - keyTime)) } } endValue = nextKeyData.s || keyData.e; keyValue = keyData.h === 1 ? keyData.s[i] : keyData.s[i] + (endValue[i] - keyData.s[i]) * perc; if (this.propType === 'multidimensional') { newValue[i] = keyValue } else { newValue = keyValue } } } } caching.lastIndex = iterationIndex; return newValue } function slerp(a, b, t) { var out = []; var ax = a[0]; var ay = a[1]; var az = a[2]; var aw = a[3]; var bx = b[0]; var by = b[1]; var bz = b[2]; var bw = b[3]; var omega; var cosom; var sinom; var scale0; var scale1; cosom = ax * bx + ay * by + az * bz + aw * bw; if (cosom < 0.0) { cosom = -cosom; bx = -bx; by = -by; bz = -bz; bw = -bw } if (1.0 - cosom> 0.000001) {
omega = Math.acos(cosom);
sinom = Math.sin(omega);
scale0 = Math.sin((1.0 - t) * omega) / sinom;
scale1 = Math.sin(t * omega) / sinom
} else {
scale0 = 1.0 - t;
scale1 = t
}
out[0] = scale0 * ax + scale1 * bx;
out[1] = scale0 * ay + scale1 * by;
out[2] = scale0 * az + scale1 * bz;
out[3] = scale0 * aw + scale1 * bw;
return out
}
function quaternionToEuler(out, quat) {
var qx = quat[0];
var qy = quat[1];
var qz = quat[2];
var qw = quat[3];
var heading = Math.atan2(2 * qy * qw - 2 * qx * qz, 1 - 2 * qy * qy - 2 * qz * qz);
var attitude = Math.asin(2 * qx * qy + 2 * qz * qw);
var bank = Math.atan2(2 * qx * qw - 2 * qy * qz, 1 - 2 * qx * qx - 2 * qz * qz);
out[0] = heading / degToRads;
out[1] = attitude / degToRads;
out[2] = bank / degToRads
}
function createQuaternion(values) {
var heading = values[0] * degToRads;
var attitude = values[1] * degToRads;
var bank = values[2] * degToRads;
var c1 = Math.cos(heading / 2);
var c2 = Math.cos(attitude / 2);
var c3 = Math.cos(bank / 2);
var s1 = Math.sin(heading / 2);
var s2 = Math.sin(attitude / 2);
var s3 = Math.sin(bank / 2);
var w = c1 * c2 * c3 - s1 * s2 * s3;
var x = s1 * s2 * c3 + c1 * c2 * s3;
var y = s1 * c2 * c3 + c1 * s2 * s3;
var z = c1 * s2 * c3 - s1 * c2 * s3;
return [x, y, z, w]
}
function getValueAtCurrentTime() {
var frameNum = this.comp.renderedFrame - this.offsetTime;
var initTime = this.keyframes[0].t - this.offsetTime;
var endTime = this.keyframes[this.keyframes.length - 1].t - this.offsetTime;
if (!(frameNum === this._caching.lastFrame || this._caching.lastFrame !== initFrame && (this._caching.lastFrame>= endTime && frameNum>= endTime || this._caching.lastFrame < initTime && frameNum < initTime))) { if (this._caching.lastFrame>= frameNum) {
this._caching._lastKeyframeIndex = -1;
this._caching.lastIndex = 0
}
var renderResult = this.interpolateValue(frameNum, this._caching);
this.pv = renderResult
}
this._caching.lastFrame = frameNum;
return this.pv
}
function setVValue(val) {
var multipliedValue;
if (this.propType === 'unidimensional') {
multipliedValue = val * this.mult;
if (mathAbs(this.v - multipliedValue)> 0.00001) {
this.v = multipliedValue;
this._mdf = true
}
} else {
var i = 0;
var len = this.v.length;
while (i < len) { multipliedValue = val[i] * this.mult; if (mathAbs(this.v[i] - multipliedValue)> 0.00001) {
this.v[i] = multipliedValue;
this._mdf = true
}
i += 1
}
}
}
function processEffectsSequence() {
if (this.elem.globalData.frameId === this.frameId || !this.effectsSequence.length) {
return
}
if (this.lock) {
this.setVValue(this.pv);
return
}
this.lock = true;
this._mdf = this._isFirstFrame;
var i;
var len = this.effectsSequence.length;
var finalValue = this.kf ? this.pv : this.data.k;
for (i = 0; i < len; i += 1) { finalValue = this.effectsSequence[i](finalValue) } this.setVValue(finalValue); this._isFirstFrame = false; this.lock = false; this.frameId = this.elem.globalData.frameId } function addEffect(effectFunction) { this.effectsSequence.push(effectFunction); this.container.addDynamicProperty(this) } function ValueProperty(elem, data, mult, container) { this.propType = 'unidimensional'; this.mult = mult || 1; this.data = data; this.v = mult ? data.k * mult : data.k; this.pv = data.k; this._mdf = false; this.elem = elem; this.container = container; this.comp = elem.comp; this.k = false; this.kf = false; this.vel = 0; this.effectsSequence = []; this._isFirstFrame = true; this.getValue = processEffectsSequence; this.setVValue = setVValue; this.addEffect = addEffect } function MultiDimensionalProperty(elem, data, mult, container) { this.propType = 'multidimensional'; this.mult = mult || 1; this.data = data; this._mdf = false; this.elem = elem; this.container = container; this.comp = elem.comp; this.k = false; this.kf = false; this.frameId = -1; var i; var len = data.k.length; this.v = createTypedArray('float32', len); this.pv = createTypedArray('float32', len); this.vel = createTypedArray('float32', len); for (i = 0; i < len; i += 1) { this.v[i] = data.k[i] * this.mult; this.pv[i] = data.k[i] } this._isFirstFrame = true; this.effectsSequence = []; this.getValue = processEffectsSequence; this.setVValue = setVValue; this.addEffect = addEffect } function KeyframedValueProperty(elem, data, mult, container) { this.propType = 'unidimensional'; this.keyframes = data.k; this.keyframesMetadata = []; this.offsetTime = elem.data.st; this.frameId = -1; this._caching = { lastFrame: initFrame, lastIndex: 0, value: 0, _lastKeyframeIndex: -1 }; this.k = true; this.kf = true; this.data = data; this.mult = mult || 1; this.elem = elem; this.container = container; this.comp = elem.comp; this.v = initFrame; this.pv = initFrame; this._isFirstFrame = true; this.getValue = processEffectsSequence; this.setVValue = setVValue; this.interpolateValue = interpolateValue; this.effectsSequence = [getValueAtCurrentTime.bind(this)]; this.addEffect = addEffect } function KeyframedMultidimensionalProperty(elem, data, mult, container) { this.propType = 'multidimensional'; var i; var len = data.k.length; var s; var e; var to; var ti; 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) { s = data.k[i].s; e = data.k[i + 1].s; to = data.k[i].to; ti = data.k[i].ti; 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])) { data.k[i].to = null; data.k[i].ti = null } if (s[0] === e[0] && s[1] === e[1] && to[0] === 0 && to[1] === 0 && ti[0] === 0 && ti[1] === 0) { if (s.length === 2 || s[2] === e[2] && to[2] === 0 && ti[2] === 0) { data.k[i].to = null; data.k[i].ti = null } } } } this.effectsSequence = [getValueAtCurrentTime.bind(this)]; this.data = data; this.keyframes = data.k; this.keyframesMetadata = []; this.offsetTime = elem.data.st; this.k = true; this.kf = true; this._isFirstFrame = true; this.mult = mult || 1; this.elem = elem; this.container = container; this.comp = elem.comp; this.getValue = processEffectsSequence; this.setVValue = setVValue; this.interpolateValue = interpolateValue; this.frameId = -1; var arrLen = data.k[0].s.length; this.v = createTypedArray('float32', arrLen); this.pv = createTypedArray('float32', arrLen); for (i = 0; i < arrLen; i += 1) { this.v[i] = initFrame; this.pv[i] = initFrame } this._caching = { lastFrame: initFrame, lastIndex: 0, value: createTypedArray('float32', arrLen) }; this.addEffect = addEffect } function getProp(elem, data, type, mult, container) { var p; if (!data.k.length) { p = new ValueProperty(elem, data, mult, container) } else if (typeof data.k[0] === 'number') { p = new MultiDimensionalProperty(elem, data, mult, container) } else { switch (type) { case 0: p = new KeyframedValueProperty(elem, data, mult, container); break; case 1: p = new KeyframedMultidimensionalProperty(elem, data, mult, container); break; default: break } } if (p.effectsSequence.length) { container.addDynamicProperty(p) } return p } var ob = { getProp: getProp }; return ob }(); function DynamicPropertyContainer() {} DynamicPropertyContainer.prototype = { addDynamicProperty: function addDynamicProperty(prop) { if (this.dynamicProperties.indexOf(prop) === -1) { this.dynamicProperties.push(prop); this.container.addDynamicProperty(this); this._isAnimated = true } }, iterateDynamicProperties: function iterateDynamicProperties() { this._mdf = false; var i; var len = this.dynamicProperties.length; for (i = 0; i < len; i += 1) { this.dynamicProperties[i].getValue(); if (this.dynamicProperties[i]._mdf) { this._mdf = true } } }, initDynamicPropertyContainer: function initDynamicPropertyContainer(container) { this.container = container; this.dynamicProperties = []; this._mdf = false; this._isAnimated = false } }; var pointPool = function () { function create() { return createTypedArray('float32', 2) } return poolFactory(8, create) }(); function ShapePath() { this.c = false; this._length = 0; this._maxLength = 8; this.v = createSizedArray(this._maxLength); this.o = createSizedArray(this._maxLength); this.i = createSizedArray(this._maxLength) } ShapePath.prototype.setPathData = function (closed, len) { this.c = closed; this.setLength(len); var i = 0; while (i < len) { this.v[i] = pointPool.newElement(); this.o[i] = pointPool.newElement(); this.i[i] = pointPool.newElement(); i += 1 } }; ShapePath.prototype.setLength = function (len) { while (this._maxLength < len) { this.doubleArrayLength() } this._length = len }; ShapePath.prototype.doubleArrayLength = function () { this.v = this.v.concat(createSizedArray(this._maxLength)); this.i = this.i.concat(createSizedArray(this._maxLength)); this.o = this.o.concat(createSizedArray(this._maxLength)); this._maxLength *= 2 }; ShapePath.prototype.setXYAt = function (x, y, type, pos, replace) { var arr; this._length = Math.max(this._length, pos + 1); if (this._length>= this._maxLength) {
this.doubleArrayLength()
}
switch (type) {
case 'v':
arr = this.v;
break;
case 'i':
arr = this.i;
break;
case 'o':
arr = this.o;
break;
default:
arr = [];
break
}
if (!arr[pos] || arr[pos] && !replace) {
arr[pos] = pointPool.newElement()
}
arr[pos][0] = x;
arr[pos][1] = y
};
ShapePath.prototype.setTripleAt = function (vX, vY, oX, oY, iX, iY, pos, replace) {
this.setXYAt(vX, vY, 'v', pos, replace);
this.setXYAt(oX, oY, 'o', pos, replace);
this.setXYAt(iX, iY, 'i', pos, replace)
};
ShapePath.prototype.reverse = function () {
var newPath = new ShapePath();
newPath.setPathData(this.c, this._length);
var vertices = this.v;
var outPoints = this.o;
var inPoints = this.i;
var init = 0;
if (this.c) {
newPath.setTripleAt(vertices[0][0], vertices[0][1], inPoints[0][0], inPoints[0][1], outPoints[0][0], outPoints[0][1], 0, false);
init = 1
}
var cnt = this._length - 1;
var len = this._length;
var i;
for (i = init; i < len; i += 1) { newPath.setTripleAt(vertices[cnt][0], vertices[cnt][1], inPoints[cnt][0], inPoints[cnt][1], outPoints[cnt][0], outPoints[cnt][1], i, false); cnt -= 1 } return newPath }; var shapePool = function () { function create() { return new ShapePath() } function release(shapePath) { var len = shapePath._length; var i; for (i = 0; i < len; i += 1) { pointPool.release(shapePath.v[i]); pointPool.release(shapePath.i[i]); pointPool.release(shapePath.o[i]); shapePath.v[i] = null; shapePath.i[i] = null; shapePath.o[i] = null } shapePath._length = 0; shapePath.c = false } function clone(shape) { var cloned = factory.newElement(); var i; var len = shape._length === undefined ? shape.v.length : shape._length; cloned.setLength(len); cloned.c = shape.c; 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) } return cloned } var factory = poolFactory(4, create, release); factory.clone = clone; return factory }(); function ShapeCollection() { this._length = 0; this._maxLength = 4; this.shapes = createSizedArray(this._maxLength) } ShapeCollection.prototype.addShape = function (shapeData) { if (this._length === this._maxLength) { this.shapes = this.shapes.concat(createSizedArray(this._maxLength)); this._maxLength *= 2 } this.shapes[this._length] = shapeData; this._length += 1 }; ShapeCollection.prototype.releaseShapes = function () { var i; for (i = 0; i < this._length; i += 1) { shapePool.release(this.shapes[i]) } this._length = 0 }; var shapeCollectionPool = function () { var ob = { newShapeCollection: newShapeCollection, release: release }; var _length = 0; var _maxLength = 4; var pool = createSizedArray(_maxLength); function newShapeCollection() { var shapeCollection; if (_length) { _length -= 1; shapeCollection = pool[_length] } else { shapeCollection = new ShapeCollection() } return shapeCollection } function release(shapeCollection) { var i; var len = shapeCollection._length; for (i = 0; i < len; i += 1) { shapePool.release(shapeCollection.shapes[i]) } shapeCollection._length = 0; if (_length === _maxLength) { pool = pooling["double"](pool); _maxLength *= 2 } pool[_length] = shapeCollection; _length += 1 } return ob }(); var ShapePropertyFactory = function () { var initFrame = -999999; function interpolateShape(frameNum, previousValue, caching) { var iterationIndex = caching.lastIndex; var keyPropS; var keyPropE; var isHold; var j; var k; var jLen; var kLen; var perc; var vertexValue; var kf = this.keyframes; if (frameNum < kf[0].t - this.offsetTime) { keyPropS = kf[0].s[0]; isHold = true; iterationIndex = 0 } else if (frameNum>= kf[kf.length - 1].t - this.offsetTime) {
keyPropS = kf[kf.length - 1].s ? kf[kf.length - 1].s[0] : kf[kf.length - 2].e[0];
isHold = true
} else {
var i = iterationIndex;
var len = kf.length - 1;
var flag = true;
var keyData;
var nextKeyData;
var keyframeMetadata;
while (flag) {
keyData = kf[i];
nextKeyData = kf[i + 1];
if (nextKeyData.t - this.offsetTime> frameNum) {
break
}
if (i < len - 1) { i += 1 } else { flag = false } } keyframeMetadata = this.keyframesMetadata[i] || {}; isHold = keyData.h === 1; iterationIndex = i; if (!isHold) { if (frameNum>= nextKeyData.t - this.offsetTime) {
perc = 1
} else if (frameNum < keyData.t - this.offsetTime) { perc = 0 } else { var fnc; if (keyframeMetadata.__fnct) { fnc = keyframeMetadata.__fnct } else { fnc = BezierFactory.getBezierEasing(keyData.o.x, keyData.o.y, keyData.i.x, keyData.i.y).get; keyframeMetadata.__fnct = fnc } perc = fnc((frameNum - (keyData.t - this.offsetTime)) / (nextKeyData.t - this.offsetTime - (keyData.t - this.offsetTime))) } keyPropE = nextKeyData.s ? nextKeyData.s[0] : keyData.e[0] } keyPropS = keyData.s[0] } jLen = previousValue._length; kLen = keyPropS.i[0].length; caching.lastIndex = iterationIndex; for (j = 0; j < jLen; j += 1) { for (k = 0; k < kLen; k += 1) { vertexValue = isHold ? keyPropS.i[j][k] : keyPropS.i[j][k] + (keyPropE.i[j][k] - keyPropS.i[j][k]) * perc; previousValue.i[j][k] = vertexValue; vertexValue = isHold ? keyPropS.o[j][k] : keyPropS.o[j][k] + (keyPropE.o[j][k] - keyPropS.o[j][k]) * perc; previousValue.o[j][k] = vertexValue; vertexValue = isHold ? keyPropS.v[j][k] : keyPropS.v[j][k] + (keyPropE.v[j][k] - keyPropS.v[j][k]) * perc; previousValue.v[j][k] = vertexValue } } } function interpolateShapeCurrentTime() { var frameNum = this.comp.renderedFrame - this.offsetTime; var initTime = this.keyframes[0].t - this.offsetTime; var endTime = this.keyframes[this.keyframes.length - 1].t - this.offsetTime; var lastFrame = this._caching.lastFrame; if (!(lastFrame !== initFrame && (lastFrame < initTime && frameNum < initTime || lastFrame> endTime && frameNum> endTime))) {
this._caching.lastIndex = lastFrame < frameNum ? this._caching.lastIndex : 0; this.interpolateShape(frameNum, this.pv, this._caching) } this._caching.lastFrame = frameNum; return this.pv } function resetShape() { this.paths = this.localShapeCollection } function shapesEqual(shape1, shape2) { if (shape1._length !== shape2._length || shape1.c !== shape2.c) { return false } var i; var len = shape1._length; 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 } } return true } function setVValue(newPath) { if (!shapesEqual(this.v, newPath)) { this.v = shapePool.clone(newPath); this.localShapeCollection.releaseShapes(); this.localShapeCollection.addShape(this.v); this._mdf = true; this.paths = this.localShapeCollection } } function processEffectsSequence() { if (this.elem.globalData.frameId === this.frameId) { return } if (!this.effectsSequence.length) { this._mdf = false; return } if (this.lock) { this.setVValue(this.pv); return } this.lock = true; this._mdf = false; var finalValue; if (this.kf) { finalValue = this.pv } else if (this.data.ks) { finalValue = this.data.ks.k } else { finalValue = this.data.pt.k } var i; var len = this.effectsSequence.length; for (i = 0; i < len; i += 1) { finalValue = this.effectsSequence[i](finalValue) } this.setVValue(finalValue); this.lock = false; this.frameId = this.elem.globalData.frameId } function ShapeProperty(elem, data, type) { this.propType = 'shape'; this.comp = elem.comp; this.container = elem; this.elem = elem; this.data = data; this.k = false; this.kf = false; this._mdf = false; var pathData = type === 3 ? data.pt.k : data.ks.k; this.v = shapePool.clone(pathData); this.pv = shapePool.clone(this.v); this.localShapeCollection = shapeCollectionPool.newShapeCollection(); this.paths = this.localShapeCollection; this.paths.addShape(this.v); this.reset = resetShape; this.effectsSequence = [] } function addEffect(effectFunction) { this.effectsSequence.push(effectFunction); this.container.addDynamicProperty(this) } ShapeProperty.prototype.interpolateShape = interpolateShape; ShapeProperty.prototype.getValue = processEffectsSequence; ShapeProperty.prototype.setVValue = setVValue; ShapeProperty.prototype.addEffect = addEffect; function KeyframedShapeProperty(elem, data, type) { this.propType = 'shape'; this.comp = elem.comp; this.elem = elem; this.container = elem; this.offsetTime = elem.data.st; this.keyframes = type === 3 ? data.pt.k : data.ks.k; this.keyframesMetadata = []; this.k = true; this.kf = true; var len = this.keyframes[0].s[0].i.length; this.v = shapePool.newElement(); this.v.setPathData(this.keyframes[0].s[0].c, len); this.pv = shapePool.clone(this.v); this.localShapeCollection = shapeCollectionPool.newShapeCollection(); this.paths = this.localShapeCollection; this.paths.addShape(this.v); this.lastFrame = initFrame; this.reset = resetShape; this._caching = { lastFrame: initFrame, lastIndex: 0 }; this.effectsSequence = [interpolateShapeCurrentTime.bind(this)] } KeyframedShapeProperty.prototype.getValue = processEffectsSequence; KeyframedShapeProperty.prototype.interpolateShape = interpolateShape; KeyframedShapeProperty.prototype.setVValue = setVValue; KeyframedShapeProperty.prototype.addEffect = addEffect; var EllShapeProperty = function () { var cPoint = roundCorner; function EllShapePropertyFactory(elem, data) { this.v = shapePool.newElement(); this.v.setPathData(true, 4); this.localShapeCollection = shapeCollectionPool.newShapeCollection(); this.paths = this.localShapeCollection; this.localShapeCollection.addShape(this.v); this.d = data.d; this.elem = elem; this.comp = elem.comp; this.frameId = -1; this.initDynamicPropertyContainer(elem); this.p = PropertyFactory.getProp(elem, data.p, 1, 0, this); this.s = PropertyFactory.getProp(elem, data.s, 1, 0, this); if (this.dynamicProperties.length) { this.k = true } else { this.k = false; this.convertEllToPath() } } EllShapePropertyFactory.prototype = { reset: resetShape, getValue: function getValue() { if (this.elem.globalData.frameId === this.frameId) { return } this.frameId = this.elem.globalData.frameId; this.iterateDynamicProperties(); if (this._mdf) { this.convertEllToPath() } }, convertEllToPath: function convertEllToPath() { var p0 = this.p.v[0]; var p1 = this.p.v[1]; var s0 = this.s.v[0] / 2; var s1 = this.s.v[1] / 2; var _cw = this.d !== 3; var _v = this.v; _v.v[0][0] = p0; _v.v[0][1] = p1 - s1; _v.v[1][0] = _cw ? p0 + s0 : p0 - s0; _v.v[1][1] = p1; _v.v[2][0] = p0; _v.v[2][1] = p1 + s1; _v.v[3][0] = _cw ? p0 - s0 : p0 + s0; _v.v[3][1] = p1; _v.i[0][0] = _cw ? p0 - s0 * cPoint : p0 + s0 * cPoint; _v.i[0][1] = p1 - s1; _v.i[1][0] = _cw ? p0 + s0 : p0 - s0; _v.i[1][1] = p1 - s1 * cPoint; _v.i[2][0] = _cw ? p0 + s0 * cPoint : p0 - s0 * cPoint; _v.i[2][1] = p1 + s1; _v.i[3][0] = _cw ? p0 - s0 : p0 + s0; _v.i[3][1] = p1 + s1 * cPoint; _v.o[0][0] = _cw ? p0 + s0 * cPoint : p0 - s0 * cPoint; _v.o[0][1] = p1 - s1; _v.o[1][0] = _cw ? p0 + s0 : p0 - s0; _v.o[1][1] = p1 + s1 * cPoint; _v.o[2][0] = _cw ? p0 - s0 * cPoint : p0 + s0 * cPoint; _v.o[2][1] = p1 + s1; _v.o[3][0] = _cw ? p0 - s0 : p0 + s0; _v.o[3][1] = p1 - s1 * cPoint } }; extendPrototype([DynamicPropertyContainer], EllShapePropertyFactory); return EllShapePropertyFactory }(); var StarShapeProperty = function () { function StarShapePropertyFactory(elem, data) { this.v = shapePool.newElement(); this.v.setPathData(true, 0); this.elem = elem; this.comp = elem.comp; this.data = data; this.frameId = -1; this.d = data.d; this.initDynamicPropertyContainer(elem); if (data.sy === 1) { this.ir = PropertyFactory.getProp(elem, data.ir, 0, 0, this); this.is = PropertyFactory.getProp(elem, data.is, 0, 0.01, this); this.convertToPath = this.convertStarToPath } else { this.convertToPath = this.convertPolygonToPath } this.pt = PropertyFactory.getProp(elem, data.pt, 0, 0, this); this.p = PropertyFactory.getProp(elem, data.p, 1, 0, this); this.r = PropertyFactory.getProp(elem, data.r, 0, degToRads, this); this.or = PropertyFactory.getProp(elem, data.or, 0, 0, this); this.os = PropertyFactory.getProp(elem, data.os, 0, 0.01, this); this.localShapeCollection = shapeCollectionPool.newShapeCollection(); this.localShapeCollection.addShape(this.v); this.paths = this.localShapeCollection; if (this.dynamicProperties.length) { this.k = true } else { this.k = false; this.convertToPath() } } StarShapePropertyFactory.prototype = { reset: resetShape, getValue: function getValue() { if (this.elem.globalData.frameId === this.frameId) { return } this.frameId = this.elem.globalData.frameId; this.iterateDynamicProperties(); if (this._mdf) { this.convertToPath() } }, convertStarToPath: function convertStarToPath() { var numPts = Math.floor(this.pt.v) * 2; var angle = Math.PI * 2 / numPts; var longFlag = true; var longRad = this.or.v; var shortRad = this.ir.v; var longRound = this.os.v; var shortRound = this.is.v; var longPerimSegment = 2 * Math.PI * longRad / (numPts * 2); var shortPerimSegment = 2 * Math.PI * shortRad / (numPts * 2); var i; var rad; var roundness; var perimSegment; var currentAng = -Math.PI / 2; currentAng += this.r.v; var dir = this.data.d === 3 ? -1 : 1; this.v._length = 0; for (i = 0; i < numPts; i += 1) { rad = longFlag ? longRad : shortRad; roundness = longFlag ? longRound : shortRound; perimSegment = longFlag ? longPerimSegment : shortPerimSegment; var x = rad * Math.cos(currentAng); var y = rad * Math.sin(currentAng); var ox = x === 0 && y === 0 ? 0 : y / Math.sqrt(x * x + y * y); var oy = x === 0 && y === 0 ? 0 : -x / Math.sqrt(x * x + y * y); x += +this.p.v[0]; y += +this.p.v[1]; 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); longFlag = !longFlag; currentAng += angle * dir } }, convertPolygonToPath: function convertPolygonToPath() { var numPts = Math.floor(this.pt.v); var angle = Math.PI * 2 / numPts; var rad = this.or.v; var roundness = this.os.v; var perimSegment = 2 * Math.PI * rad / (numPts * 4); var i; var currentAng = -Math.PI * 0.5; var dir = this.data.d === 3 ? -1 : 1; currentAng += this.r.v; this.v._length = 0; for (i = 0; i < numPts; i += 1) { var x = rad * Math.cos(currentAng); var y = rad * Math.sin(currentAng); var ox = x === 0 && y === 0 ? 0 : y / Math.sqrt(x * x + y * y); var oy = x === 0 && y === 0 ? 0 : -x / Math.sqrt(x * x + y * y); x += +this.p.v[0]; y += +this.p.v[1]; 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); currentAng += angle * dir } this.paths.length = 0; this.paths[0] = this.v } }; extendPrototype([DynamicPropertyContainer], StarShapePropertyFactory); return StarShapePropertyFactory }(); var RectShapeProperty = function () { function RectShapePropertyFactory(elem, data) { this.v = shapePool.newElement(); this.v.c = true; this.localShapeCollection = shapeCollectionPool.newShapeCollection(); this.localShapeCollection.addShape(this.v); this.paths = this.localShapeCollection; this.elem = elem; this.comp = elem.comp; this.frameId = -1; this.d = data.d; this.initDynamicPropertyContainer(elem); this.p = PropertyFactory.getProp(elem, data.p, 1, 0, this); this.s = PropertyFactory.getProp(elem, data.s, 1, 0, this); this.r = PropertyFactory.getProp(elem, data.r, 0, 0, this); if (this.dynamicProperties.length) { this.k = true } else { this.k = false; this.convertRectToPath() } } RectShapePropertyFactory.prototype = { convertRectToPath: function convertRectToPath() { var p0 = this.p.v[0]; var p1 = this.p.v[1]; var v0 = this.s.v[0] / 2; var v1 = this.s.v[1] / 2; var round = bmMin(v0, v1, this.r.v); var cPoint = round * (1 - roundCorner); this.v._length = 0; if (this.d === 2 || this.d === 1) { this.v.setTripleAt(p0 + v0, p1 - v1 + round, p0 + v0, p1 - v1 + round, p0 + v0, p1 - v1 + cPoint, 0, true); this.v.setTripleAt(p0 + v0, p1 + v1 - round, p0 + v0, p1 + v1 - cPoint, p0 + v0, p1 + v1 - round, 1, true); if (round !== 0) { this.v.setTripleAt(p0 + v0 - round, p1 + v1, p0 + v0 - round, p1 + v1, p0 + v0 - cPoint, p1 + v1, 2, true); this.v.setTripleAt(p0 - v0 + round, p1 + v1, p0 - v0 + cPoint, p1 + v1, p0 - v0 + round, p1 + v1, 3, true); this.v.setTripleAt(p0 - v0, p1 + v1 - round, p0 - v0, p1 + v1 - round, p0 - v0, p1 + v1 - cPoint, 4, true); this.v.setTripleAt(p0 - v0, p1 - v1 + round, p0 - v0, p1 - v1 + cPoint, p0 - v0, p1 - v1 + round, 5, true); this.v.setTripleAt(p0 - v0 + round, p1 - v1, p0 - v0 + round, p1 - v1, p0 - v0 + cPoint, p1 - v1, 6, true); this.v.setTripleAt(p0 + v0 - round, p1 - v1, p0 + v0 - cPoint, p1 - v1, p0 + v0 - round, p1 - v1, 7, true) } else { this.v.setTripleAt(p0 - v0, p1 + v1, p0 - v0 + cPoint, p1 + v1, p0 - v0, p1 + v1, 2); this.v.setTripleAt(p0 - v0, p1 - v1, p0 - v0, p1 - v1 + cPoint, p0 - v0, p1 - v1, 3) } } else { this.v.setTripleAt(p0 + v0, p1 - v1 + round, p0 + v0, p1 - v1 + cPoint, p0 + v0, p1 - v1 + round, 0, true); if (round !== 0) { this.v.setTripleAt(p0 + v0 - round, p1 - v1, p0 + v0 - round, p1 - v1, p0 + v0 - cPoint, p1 - v1, 1, true); this.v.setTripleAt(p0 - v0 + round, p1 - v1, p0 - v0 + cPoint, p1 - v1, p0 - v0 + round, p1 - v1, 2, true); this.v.setTripleAt(p0 - v0, p1 - v1 + round, p0 - v0, p1 - v1 + round, p0 - v0, p1 - v1 + cPoint, 3, true); this.v.setTripleAt(p0 - v0, p1 + v1 - round, p0 - v0, p1 + v1 - cPoint, p0 - v0, p1 + v1 - round, 4, true); this.v.setTripleAt(p0 - v0 + round, p1 + v1, p0 - v0 + round, p1 + v1, p0 - v0 + cPoint, p1 + v1, 5, true); this.v.setTripleAt(p0 + v0 - round, p1 + v1, p0 + v0 - cPoint, p1 + v1, p0 + v0 - round, p1 + v1, 6, true); this.v.setTripleAt(p0 + v0, p1 + v1 - round, p0 + v0, p1 + v1 - round, p0 + v0, p1 + v1 - cPoint, 7, true) } else { this.v.setTripleAt(p0 - v0, p1 - v1, p0 - v0 + cPoint, p1 - v1, p0 - v0, p1 - v1, 1, true); this.v.setTripleAt(p0 - v0, p1 + v1, p0 - v0, p1 + v1 - cPoint, p0 - v0, p1 + v1, 2, true); this.v.setTripleAt(p0 + v0, p1 + v1, p0 + v0 - cPoint, p1 + v1, p0 + v0, p1 + v1, 3, true) } } }, getValue: function getValue() { if (this.elem.globalData.frameId === this.frameId) { return } this.frameId = this.elem.globalData.frameId; this.iterateDynamicProperties(); if (this._mdf) { this.convertRectToPath() } }, reset: resetShape }; extendPrototype([DynamicPropertyContainer], RectShapePropertyFactory); return RectShapePropertyFactory }(); function getShapeProp(elem, data, type) { var prop; if (type === 3 || type === 4) { var dataProp = type === 3 ? data.pt : data.ks; var keys = dataProp.k; if (keys.length) { prop = new KeyframedShapeProperty(elem, data, type) } else { prop = new ShapeProperty(elem, data, type) } } else if (type === 5) { prop = new RectShapeProperty(elem, data) } else if (type === 6) { prop = new EllShapeProperty(elem, data) } else if (type === 7) { prop = new StarShapeProperty(elem, data) } if (prop.k) { elem.addDynamicProperty(prop) } return prop } function getConstructorFunction() { return ShapeProperty } function getKeyframedConstructorFunction() { return KeyframedShapeProperty } var ob = {}; ob.getShapeProp = getShapeProp; ob.getConstructorFunction = getConstructorFunction; ob.getKeyframedConstructorFunction = getKeyframedConstructorFunction; return ob }(); var Matrix = function () { var _cos = Math.cos; var _sin = Math.sin; var _tan = Math.tan; var _rnd = Math.round; function reset() { 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; return this } function rotate(angle) { if (angle === 0) { return this } var mCos = _cos(angle); var mSin = _sin(angle); return this._t(mCos, -mSin, 0, 0, mSin, mCos, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1) } function rotateX(angle) { if (angle === 0) { return this } var mCos = _cos(angle); var mSin = _sin(angle); return this._t(1, 0, 0, 0, 0, mCos, -mSin, 0, 0, mSin, mCos, 0, 0, 0, 0, 1) } function rotateY(angle) { if (angle === 0) { return this } var mCos = _cos(angle); var mSin = _sin(angle); return this._t(mCos, 0, mSin, 0, 0, 1, 0, 0, -mSin, 0, mCos, 0, 0, 0, 0, 1) } function rotateZ(angle) { if (angle === 0) { return this } var mCos = _cos(angle); var mSin = _sin(angle); return this._t(mCos, -mSin, 0, 0, mSin, mCos, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1) } function shear(sx, sy) { return this._t(1, sy, sx, 1, 0, 0) } function skew(ax, ay) { return this.shear(_tan(ax), _tan(ay)) } function skewFromAxis(ax, angle) { var mCos = _cos(angle); var mSin = _sin(angle); 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) } function scale(sx, sy, sz) { if (!sz && sz !== 0) { sz = 1 } if (sx === 1 && sy === 1 && sz === 1) { return this } return this._t(sx, 0, 0, 0, 0, sy, 0, 0, 0, 0, sz, 0, 0, 0, 0, 1) } function setTransform(a, b, c, d, e, f, g, h, i, j, k, l, m, n, o, p) { this.props[0] = a; this.props[1] = b; this.props[2] = c; this.props[3] = d; this.props[4] = e; this.props[5] = f; this.props[6] = g; this.props[7] = h; this.props[8] = i; this.props[9] = j; this.props[10] = k; this.props[11] = l; this.props[12] = m; this.props[13] = n; this.props[14] = o; this.props[15] = p; return this } function translate(tx, ty, tz) { tz = tz || 0; 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) } return this } function transform(a2, b2, c2, d2, e2, f2, g2, h2, i2, j2, k2, l2, m2, n2, o2, p2) { var _p = this.props; 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) { _p[12] = _p[12] * a2 + _p[15] * m2; _p[13] = _p[13] * f2 + _p[15] * n2; _p[14] = _p[14] * k2 + _p[15] * o2; _p[15] *= p2; this._identityCalculated = false; return this } var a1 = _p[0]; var b1 = _p[1]; var c1 = _p[2]; var d1 = _p[3]; var e1 = _p[4]; var f1 = _p[5]; var g1 = _p[6]; var h1 = _p[7]; var i1 = _p[8]; var j1 = _p[9]; var k1 = _p[10]; var l1 = _p[11]; var m1 = _p[12]; var n1 = _p[13]; var o1 = _p[14]; var p1 = _p[15]; _p[0] = a1 * a2 + b1 * e2 + c1 * i2 + d1 * m2; _p[1] = a1 * b2 + b1 * f2 + c1 * j2 + d1 * n2; _p[2] = a1 * c2 + b1 * g2 + c1 * k2 + d1 * o2; _p[3] = a1 * d2 + b1 * h2 + c1 * l2 + d1 * p2; _p[4] = e1 * a2 + f1 * e2 + g1 * i2 + h1 * m2; _p[5] = e1 * b2 + f1 * f2 + g1 * j2 + h1 * n2; _p[6] = e1 * c2 + f1 * g2 + g1 * k2 + h1 * o2; _p[7] = e1 * d2 + f1 * h2 + g1 * l2 + h1 * p2; _p[8] = i1 * a2 + j1 * e2 + k1 * i2 + l1 * m2; _p[9] = i1 * b2 + j1 * f2 + k1 * j2 + l1 * n2; _p[10] = i1 * c2 + j1 * g2 + k1 * k2 + l1 * o2; _p[11] = i1 * d2 + j1 * h2 + k1 * l2 + l1 * p2; _p[12] = m1 * a2 + n1 * e2 + o1 * i2 + p1 * m2; _p[13] = m1 * b2 + n1 * f2 + o1 * j2 + p1 * n2; _p[14] = m1 * c2 + n1 * g2 + o1 * k2 + p1 * o2; _p[15] = m1 * d2 + n1 * h2 + o1 * l2 + p1 * p2; this._identityCalculated = false; return this } function isIdentity() { if (!this._identityCalculated) { 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); this._identityCalculated = true } return this._identity } function equals(matr) { var i = 0; while (i < 16) { if (matr.props[i] !== this.props[i]) { return false } i += 1 } return true } function clone(matr) { var i; for (i = 0; i < 16; i += 1) { matr.props[i] = this.props[i] } return matr } function cloneFromProps(props) { var i; for (i = 0; i < 16; i += 1) { this.props[i] = props[i] } } function applyToPoint(x, y, z) { return { x: x * this.props[0] + y * this.props[4] + z * this.props[8] + this.props[12], y: x * this.props[1] + y * this.props[5] + z * this.props[9] + this.props[13], z: x * this.props[2] + y * this.props[6] + z * this.props[10] + this.props[14] } } function applyToX(x, y, z) { return x * this.props[0] + y * this.props[4] + z * this.props[8] + this.props[12] } function applyToY(x, y, z) { return x * this.props[1] + y * this.props[5] + z * this.props[9] + this.props[13] } function applyToZ(x, y, z) { return x * this.props[2] + y * this.props[6] + z * this.props[10] + this.props[14] } function getInverseMatrix() { var determinant = this.props[0] * this.props[5] - this.props[1] * this.props[4]; var a = this.props[5] / determinant; var b = -this.props[1] / determinant; var c = -this.props[4] / determinant; var d = this.props[0] / determinant; var e = (this.props[4] * this.props[13] - this.props[5] * this.props[12]) / determinant; var f = -(this.props[0] * this.props[13] - this.props[1] * this.props[12]) / determinant; var inverseMatrix = new Matrix(); inverseMatrix.props[0] = a; inverseMatrix.props[1] = b; inverseMatrix.props[4] = c; inverseMatrix.props[5] = d; inverseMatrix.props[12] = e; inverseMatrix.props[13] = f; return inverseMatrix } function inversePoint(pt) { var inverseMatrix = this.getInverseMatrix(); return inverseMatrix.applyToPointArray(pt[0], pt[1], pt[2] || 0) } function inversePoints(pts) { var i; var len = pts.length; var retPts = []; for (i = 0; i < len; i += 1) { retPts[i] = inversePoint(pts[i]) } return retPts } function applyToTriplePoints(pt1, pt2, pt3) { var arr = createTypedArray('float32', 6); if (this.isIdentity()) { arr[0] = pt1[0]; arr[1] = pt1[1]; arr[2] = pt2[0]; arr[3] = pt2[1]; arr[4] = pt3[0]; arr[5] = pt3[1] } else { var p0 = this.props[0]; var p1 = this.props[1]; var p4 = this.props[4]; var p5 = this.props[5]; var p12 = this.props[12]; var p13 = this.props[13]; arr[0] = pt1[0] * p0 + pt1[1] * p4 + p12; arr[1] = pt1[0] * p1 + pt1[1] * p5 + p13; arr[2] = pt2[0] * p0 + pt2[1] * p4 + p12; arr[3] = pt2[0] * p1 + pt2[1] * p5 + p13; arr[4] = pt3[0] * p0 + pt3[1] * p4 + p12; arr[5] = pt3[0] * p1 + pt3[1] * p5 + p13 } return arr } function applyToPointArray(x, y, z) { var arr; if (this.isIdentity()) { arr = [x, y, z] } else { arr = [x * this.props[0] + y * this.props[4] + z * this.props[8] + this.props[12], x * this.props[1] + y * this.props[5] + z * this.props[9] + this.props[13], x * this.props[2] + y * this.props[6] + z * this.props[10] + this.props[14]] } return arr } function applyToPointStringified(x, y) { if (this.isIdentity()) { return x + ',' + y } var _p = this.props; 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 } function toCSS() { var i = 0; var props = this.props; var cssValue = 'matrix3d('; var v = 10000; while (i < 16) { cssValue += _rnd(props[i] * v) / v; cssValue += i === 15 ? ')' : ','; i += 1 } return cssValue } function roundMatrixProperty(val) { var v = 10000; if (val < 0.000001 && val> 0 || val> -0.000001 && val < 0) { return _rnd(val * v) / v } return val } function to2dCSS() { var props = this.props; var _a = roundMatrixProperty(props[0]); var _b = roundMatrixProperty(props[1]); var _c = roundMatrixProperty(props[4]); var _d = roundMatrixProperty(props[5]); var _e = roundMatrixProperty(props[12]); var _f = roundMatrixProperty(props[13]); return 'matrix(' + _a + ',' + _b + ',' + _c + ',' + _d + ',' + _e + ',' + _f + ')' } return function () { this.reset = reset; this.rotate = rotate; this.rotateX = rotateX; this.rotateY = rotateY; this.rotateZ = rotateZ; this.skew = skew; this.skewFromAxis = skewFromAxis; this.shear = shear; this.scale = scale; this.setTransform = setTransform; this.translate = translate; this.transform = transform; this.applyToPoint = applyToPoint; this.applyToX = applyToX; this.applyToY = applyToY; this.applyToZ = applyToZ; this.applyToPointArray = applyToPointArray; this.applyToTriplePoints = applyToTriplePoints; this.applyToPointStringified = applyToPointStringified; this.toCSS = toCSS; this.to2dCSS = to2dCSS; this.clone = clone; this.cloneFromProps = cloneFromProps; this.equals = equals; this.inversePoints = inversePoints; this.inversePoint = inversePoint; this.getInverseMatrix = getInverseMatrix; this._t = this.transform; this.isIdentity = isIdentity; this._identity = true; this._identityCalculated = false; this.props = createTypedArray('float32', 16); this.reset() } }(); function _typeof3ドル(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof3ドル = function _typeof(obj) { return typeof obj } } else { _typeof3ドル = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj } } return _typeof3ドル(obj) } var lottie = {}; var standalone = '__[STANDALONE]__'; var animationData = '__[ANIMATIONDATA]__'; var renderer = ''; function setLocation(href) { setLocationHref(href) } function searchAnimations() { if (standalone === true) { animationManager.searchAnimations(animationData, standalone, renderer) } else { animationManager.searchAnimations() } } function setSubframeRendering(flag) { setSubframeEnabled(flag) } function setPrefix(prefix) { setIdPrefix(prefix) } function loadAnimation(params) { if (standalone === true) { params.animationData = JSON.parse(animationData) } return animationManager.loadAnimation(params) } function setQuality(value) { if (typeof value === 'string') { switch (value) { case 'high': setDefaultCurveSegments(200); break; default: case 'medium': setDefaultCurveSegments(50); break; case 'low': setDefaultCurveSegments(10); break } } else if (!isNaN(value) && value> 1) {
setDefaultCurveSegments(value)
}
if (getDefaultCurveSegments()>= 50) {
roundValues(false)
} else {
roundValues(true)
}
}
function inBrowser() {
return typeof navigator !== 'undefined'
}
function installPlugin(type, plugin) {
if (type === 'expressions') {
setExpressionsPlugin(plugin)
}
}
function getFactory(name) {
switch (name) {
case 'propertyFactory':
return PropertyFactory;
case 'shapePropertyFactory':
return ShapePropertyFactory;
case 'matrix':
return Matrix;
default:
return null
}
}
lottie.play = animationManager.play;
lottie.pause = animationManager.pause;
lottie.setLocationHref = setLocation;
lottie.togglePause = animationManager.togglePause;
lottie.setSpeed = animationManager.setSpeed;
lottie.setDirection = animationManager.setDirection;
lottie.stop = animationManager.stop;
lottie.searchAnimations = searchAnimations;
lottie.registerAnimation = animationManager.registerAnimation;
lottie.loadAnimation = loadAnimation;
lottie.setSubframeRendering = setSubframeRendering;
lottie.resize = animationManager.resize;
lottie.goToAndStop = animationManager.goToAndStop;
lottie.destroy = animationManager.destroy;
lottie.setQuality = setQuality;
lottie.inBrowser = inBrowser;
lottie.installPlugin = installPlugin;
lottie.freeze = animationManager.freeze;
lottie.unfreeze = animationManager.unfreeze;
lottie.setVolume = animationManager.setVolume;
lottie.mute = animationManager.mute;
lottie.unmute = animationManager.unmute;
lottie.getRegisteredAnimations = animationManager.getRegisteredAnimations;
lottie.useWebWorker = setWebWorker;
lottie.setIDPrefix = setPrefix;
lottie.__getFactory = getFactory;
lottie.version = '5.9.6';
function checkReady() {
if (document.readyState === 'complete') {
clearInterval(readyStateCheckInterval);
searchAnimations()
}
}
function getQueryVariable(variable) {
var vars = queryString.split('&');
for (var i = 0; i < vars.length; i += 1) { var pair = vars[i].split('='); if (decodeURIComponent(pair[0]) == variable) { return decodeURIComponent(pair[1]) } } return null } var queryString = ''; if (standalone) { var scripts = document.getElementsByTagName('script'); var index = scripts.length - 1; var myScript = scripts[index] || { src: '' }; queryString = myScript.src ? myScript.src.replace(/^[^\?]+\??/, '') : ''; renderer = getQueryVariable('renderer') } var readyStateCheckInterval = setInterval(checkReady, 100); try { if (!((typeof exports === "undefined" ? "undefined" : _typeof3ドル(exports)) === 'object' && typeof module !== 'undefined') && !(typeof define === 'function' && define.amd)) { window.bodymovin = lottie } } catch (err) {} var ShapeModifiers = function () { var ob = {}; var modifiers = {}; ob.registerModifier = registerModifier; ob.getModifier = getModifier; function registerModifier(nm, factory) { if (!modifiers[nm]) { modifiers[nm] = factory } } function getModifier(nm, elem, data) { return new modifiers[nm](elem, data) } return ob }(); function ShapeModifier() {} ShapeModifier.prototype.initModifierProperties = function () {}; ShapeModifier.prototype.addShapeToModifier = function () {}; ShapeModifier.prototype.addShape = function (data) { if (!this.closed) { data.sh.container.addDynamicProperty(data.sh); var shapeData = { shape: data.sh, data: data, localShapeCollection: shapeCollectionPool.newShapeCollection() }; this.shapes.push(shapeData); this.addShapeToModifier(shapeData); if (this._isAnimated) { data.setAsAnimated() } } }; ShapeModifier.prototype.init = function (elem, data) { this.shapes = []; this.elem = elem; this.initDynamicPropertyContainer(elem); this.initModifierProperties(elem, data); this.frameId = initialDefaultFrame; this.closed = false; this.k = false; if (this.dynamicProperties.length) { this.k = true } else { this.getValue(true) } }; ShapeModifier.prototype.processKeys = function () { if (this.elem.globalData.frameId === this.frameId) { return } this.frameId = this.elem.globalData.frameId; this.iterateDynamicProperties() }; extendPrototype([DynamicPropertyContainer], ShapeModifier); function TrimModifier() {} extendPrototype([ShapeModifier], TrimModifier); TrimModifier.prototype.initModifierProperties = function (elem, data) { this.s = PropertyFactory.getProp(elem, data.s, 0, 0.01, this); this.e = PropertyFactory.getProp(elem, data.e, 0, 0.01, this); this.o = PropertyFactory.getProp(elem, data.o, 0, 0, this); this.sValue = 0; this.eValue = 0; this.getValue = this.processKeys; this.m = data.m; this._isAnimated = !!this.s.effectsSequence.length || !!this.e.effectsSequence.length || !!this.o.effectsSequence.length }; TrimModifier.prototype.addShapeToModifier = function (shapeData) { shapeData.pathsData = [] }; TrimModifier.prototype.calculateShapeEdges = function (s, e, shapeLength, addedLength, totalModifierLength) { var segments = []; if (e <= 1) { segments.push({ s: s, e: e }) } else if (s>= 1) {
segments.push({
s: s - 1,
e: e - 1
})
} else {
segments.push({
s: s,
e: 1
});
segments.push({
s: 0,
e: e - 1
})
}
var shapeSegments = [];
var i;
var len = segments.length;
var segmentOb;
for (i = 0; i < len; i += 1) { segmentOb = segments[i]; if (!(segmentOb.e * totalModifierLength < addedLength || segmentOb.s * totalModifierLength> addedLength + shapeLength)) {
var shapeS;
var shapeE;
if (segmentOb.s * totalModifierLength <= addedLength) { shapeS = 0 } else { shapeS = (segmentOb.s * totalModifierLength - addedLength) / shapeLength } if (segmentOb.e * totalModifierLength>= addedLength + shapeLength) {
shapeE = 1
} else {
shapeE = (segmentOb.e * totalModifierLength - addedLength) / shapeLength
}
shapeSegments.push([shapeS, shapeE])
}
}
if (!shapeSegments.length) {
shapeSegments.push([0, 0])
}
return shapeSegments
};
TrimModifier.prototype.releasePathsData = function (pathsData) {
var i;
var len = pathsData.length;
for (i = 0; i < len; i += 1) { segmentsLengthPool.release(pathsData[i]) } pathsData.length = 0; return pathsData }; TrimModifier.prototype.processShapes = function (_isFirstFrame) { var s; var e; if (this._mdf || _isFirstFrame) { var o = this.o.v % 360 / 360; if (o < 0) { o += 1 } if (this.s.v> 1) {
s = 1 + o
} else if (this.s.v < 0) { s = 0 + o } else { s = this.s.v + o } if (this.e.v> 1) {
e = 1 + o
} else if (this.e.v < 0) { e = 0 + o } else { e = this.e.v + o } if (s> e) {
var _s = s;
s = e;
e = _s
}
s = Math.round(s * 10000) * 0.0001;
e = Math.round(e * 10000) * 0.0001;
this.sValue = s;
this.eValue = e
} else {
s = this.sValue;
e = this.eValue
}
var shapePaths;
var i;
var len = this.shapes.length;
var j;
var jLen;
var pathsData;
var pathData;
var totalShapeLength;
var totalModifierLength = 0;
if (e === s) {
for (i = 0; i < len; i += 1) { this.shapes[i].localShapeCollection.releaseShapes(); this.shapes[i].shape._mdf = true; this.shapes[i].shape.paths = this.shapes[i].localShapeCollection; if (this._mdf) { this.shapes[i].pathsData.length = 0 } } } else if (!(e === 1 && s === 0 || e === 0 && s === 1)) { var segments = []; var shapeData; var localShapeCollection; for (i = 0; i < len; i += 1) { shapeData = this.shapes[i]; if (!shapeData.shape._mdf && !this._mdf && !_isFirstFrame && this.m !== 2) { shapeData.shape.paths = shapeData.localShapeCollection } else { shapePaths = shapeData.shape.paths; jLen = shapePaths._length; totalShapeLength = 0; if (!shapeData.shape._mdf && shapeData.pathsData.length) { totalShapeLength = shapeData.totalShapeLength } else { pathsData = this.releasePathsData(shapeData.pathsData); for (j = 0; j < jLen; j += 1) { pathData = bez.getSegmentsLength(shapePaths.shapes[j]); pathsData.push(pathData); totalShapeLength += pathData.totalLength } shapeData.totalShapeLength = totalShapeLength; shapeData.pathsData = pathsData } totalModifierLength += totalShapeLength; shapeData.shape._mdf = true } } var shapeS = s; var shapeE = e; var addedLength = 0; var edges; for (i = len - 1; i>= 0; i -= 1) {
shapeData = this.shapes[i];
if (shapeData.shape._mdf) {
localShapeCollection = shapeData.localShapeCollection;
localShapeCollection.releaseShapes();
if (this.m === 2 && len> 1) {
edges = this.calculateShapeEdges(s, e, shapeData.totalShapeLength, addedLength, totalModifierLength);
addedLength += shapeData.totalShapeLength
} else {
edges = [
[shapeS, shapeE]
]
}
jLen = edges.length;
for (j = 0; j < jLen; j += 1) { shapeS = edges[j][0]; shapeE = edges[j][1]; segments.length = 0; if (shapeE <= 1) { segments.push({ s: shapeData.totalShapeLength * shapeS, e: shapeData.totalShapeLength * shapeE }) } else if (shapeS>= 1) {
segments.push({
s: shapeData.totalShapeLength * (shapeS - 1),
e: shapeData.totalShapeLength * (shapeE - 1)
})
} else {
segments.push({
s: shapeData.totalShapeLength * shapeS,
e: shapeData.totalShapeLength
});
segments.push({
s: 0,
e: shapeData.totalShapeLength * (shapeE - 1)
})
}
var newShapesData = this.addShapes(shapeData, segments[0]);
if (segments[0].s !== segments[0].e) {
if (segments.length> 1) {
var lastShapeInCollection = shapeData.shape.paths.shapes[shapeData.shape.paths._length - 1];
if (lastShapeInCollection.c) {
var lastShape = newShapesData.pop();
this.addPaths(newShapesData, localShapeCollection);
newShapesData = this.addShapes(shapeData, segments[1], lastShape)
} else {
this.addPaths(newShapesData, localShapeCollection);
newShapesData = this.addShapes(shapeData, segments[1])
}
}
this.addPaths(newShapesData, localShapeCollection)
}
}
shapeData.shape.paths = localShapeCollection
}
}
} else if (this._mdf) {
for (i = 0; i < len; i += 1) { this.shapes[i].pathsData.length = 0; this.shapes[i].shape._mdf = true } } }; TrimModifier.prototype.addPaths = function (newPaths, localShapeCollection) { var i; var len = newPaths.length; for (i = 0; i < len; i += 1) { localShapeCollection.addShape(newPaths[i]) } }; TrimModifier.prototype.addSegment = function (pt1, pt2, pt3, pt4, shapePath, pos, newShape) { shapePath.setXYAt(pt2[0], pt2[1], 'o', pos); shapePath.setXYAt(pt3[0], pt3[1], 'i', pos + 1); if (newShape) { shapePath.setXYAt(pt1[0], pt1[1], 'v', pos) } shapePath.setXYAt(pt4[0], pt4[1], 'v', pos + 1) }; TrimModifier.prototype.addSegmentFromArray = function (points, shapePath, pos, newShape) { shapePath.setXYAt(points[1], points[5], 'o', pos); shapePath.setXYAt(points[2], points[6], 'i', pos + 1); if (newShape) { shapePath.setXYAt(points[0], points[4], 'v', pos) } shapePath.setXYAt(points[3], points[7], 'v', pos + 1) }; TrimModifier.prototype.addShapes = function (shapeData, shapeSegment, shapePath) { var pathsData = shapeData.pathsData; var shapePaths = shapeData.shape.paths.shapes; var i; var len = shapeData.shape.paths._length; var j; var jLen; var addedLength = 0; var currentLengthData; var segmentCount; var lengths; var segment; var shapes = []; var initPos; var newShape = true; if (!shapePath) { shapePath = shapePool.newElement(); segmentCount = 0; initPos = 0 } else { segmentCount = shapePath._length; initPos = shapePath._length } shapes.push(shapePath); for (i = 0; i < len; i += 1) { lengths = pathsData[i].lengths; shapePath.c = shapePaths[i].c; jLen = shapePaths[i].c ? lengths.length : lengths.length + 1; for (j = 1; j < jLen; j += 1) { currentLengthData = lengths[j - 1]; if (addedLength + currentLengthData.addedLength < shapeSegment.s) { addedLength += currentLengthData.addedLength; shapePath.c = false } else if (addedLength> shapeSegment.e) {
shapePath.c = false;
break
} else {
if (shapeSegment.s <= addedLength && shapeSegment.e>= addedLength + currentLengthData.addedLength) {
this.addSegment(shapePaths[i].v[j - 1], shapePaths[i].o[j - 1], shapePaths[i].i[j], shapePaths[i].v[j], shapePath, segmentCount, newShape);
newShape = false
} else {
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]);
this.addSegmentFromArray(segment, shapePath, segmentCount, newShape);
newShape = false;
shapePath.c = false
}
addedLength += currentLengthData.addedLength;
segmentCount += 1
}
}
if (shapePaths[i].c && lengths.length) {
currentLengthData = lengths[j - 1];
if (addedLength <= shapeSegment.e) { var segmentLength = lengths[j - 1].addedLength; if (shapeSegment.s <= addedLength && shapeSegment.e>= addedLength + segmentLength) {
this.addSegment(shapePaths[i].v[j - 1], shapePaths[i].o[j - 1], shapePaths[i].i[0], shapePaths[i].v[0], shapePath, segmentCount, newShape);
newShape = false
} else {
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]);
this.addSegmentFromArray(segment, shapePath, segmentCount, newShape);
newShape = false;
shapePath.c = false
}
} else {
shapePath.c = false
}
addedLength += currentLengthData.addedLength;
segmentCount += 1
}
if (shapePath._length) {
shapePath.setXYAt(shapePath.v[initPos][0], shapePath.v[initPos][1], 'i', initPos);
shapePath.setXYAt(shapePath.v[shapePath._length - 1][0], shapePath.v[shapePath._length - 1][1], 'o', shapePath._length - 1)
}
if (addedLength> shapeSegment.e) {
break
}
if (i < len - 1) { shapePath = shapePool.newElement(); newShape = true; shapes.push(shapePath); segmentCount = 0 } } return shapes }; function PuckerAndBloatModifier() {} extendPrototype([ShapeModifier], PuckerAndBloatModifier); PuckerAndBloatModifier.prototype.initModifierProperties = function (elem, data) { this.getValue = this.processKeys; this.amount = PropertyFactory.getProp(elem, data.a, 0, null, this); this._isAnimated = !!this.amount.effectsSequence.length }; PuckerAndBloatModifier.prototype.processPath = function (path, amount) { var percent = amount / 100; var centerPoint = [0, 0]; var pathLength = path._length; var i = 0; for (i = 0; i < pathLength; i += 1) { centerPoint[0] += path.v[i][0]; centerPoint[1] += path.v[i][1] } centerPoint[0] /= pathLength; centerPoint[1] /= pathLength; var clonedPath = shapePool.newElement(); clonedPath.c = path.c; var vX; var vY; var oX; var oY; var iX; var iY; for (i = 0; i < pathLength; i += 1) { vX = path.v[i][0] + (centerPoint[0] - path.v[i][0]) * percent; vY = path.v[i][1] + (centerPoint[1] - path.v[i][1]) * percent; oX = path.o[i][0] + (centerPoint[0] - path.o[i][0]) * -percent; oY = path.o[i][1] + (centerPoint[1] - path.o[i][1]) * -percent; iX = path.i[i][0] + (centerPoint[0] - path.i[i][0]) * -percent; iY = path.i[i][1] + (centerPoint[1] - path.i[i][1]) * -percent; clonedPath.setTripleAt(vX, vY, oX, oY, iX, iY, i) } return clonedPath }; PuckerAndBloatModifier.prototype.processShapes = function (_isFirstFrame) { var shapePaths; var i; var len = this.shapes.length; var j; var jLen; var amount = this.amount.v; if (amount !== 0) { var shapeData; var localShapeCollection; for (i = 0; i < len; i += 1) { shapeData = this.shapes[i]; localShapeCollection = shapeData.localShapeCollection; if (!(!shapeData.shape._mdf && !this._mdf && !_isFirstFrame)) { localShapeCollection.releaseShapes(); shapeData.shape._mdf = true; shapePaths = shapeData.shape.paths.shapes; jLen = shapeData.shape.paths._length; for (j = 0; j < jLen; j += 1) { localShapeCollection.addShape(this.processPath(shapePaths[j], amount)) } } shapeData.shape.paths = shapeData.localShapeCollection } } if (!this.dynamicProperties.length) { this._mdf = false } }; var TransformPropertyFactory = function () { var defaultVector = [0, 0]; function applyToMatrix(mat) { var _mdf = this._mdf; this.iterateDynamicProperties(); this._mdf = this._mdf || _mdf; if (this.a) { mat.translate(-this.a.v[0], -this.a.v[1], this.a.v[2]) } if (this.s) { mat.scale(this.s.v[0], this.s.v[1], this.s.v[2]) } if (this.sk) { mat.skewFromAxis(-this.sk.v, this.sa.v) } if (this.r) { mat.rotate(-this.r.v) } 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]) } if (this.data.p.s) { if (this.data.p.z) { mat.translate(this.px.v, this.py.v, -this.pz.v) } else { mat.translate(this.px.v, this.py.v, 0) } } else { mat.translate(this.p.v[0], this.p.v[1], -this.p.v[2]) } } function processKeys(forceRender) { if (this.elem.globalData.frameId === this.frameId) { return } if (this._isDirty) { this.precalculateMatrix(); this._isDirty = false } this.iterateDynamicProperties(); if (this._mdf || forceRender) { var frameRate; this.v.cloneFromProps(this.pre.props); if (this.appliedTransformations < 1) { this.v.translate(-this.a.v[0], -this.a.v[1], this.a.v[2]) } if (this.appliedTransformations < 2) { this.v.scale(this.s.v[0], this.s.v[1], this.s.v[2]) } if (this.sk && this.appliedTransformations < 3) { this.v.skewFromAxis(-this.sk.v, this.sa.v) } if (this.r && this.appliedTransformations < 4) { this.v.rotate(-this.r.v) } 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]) } if (this.autoOriented) { var v1; var v2; frameRate = this.elem.globalData.frameRate; if (this.p && this.p.keyframes && this.p.getValueAtTime) { if (this.p._caching.lastFrame + this.p.offsetTime <= this.p.keyframes[0].t) { v1 = this.p.getValueAtTime((this.p.keyframes[0].t + 0.01) / frameRate, 0); v2 = this.p.getValueAtTime(this.p.keyframes[0].t / frameRate, 0) } else if (this.p._caching.lastFrame + this.p.offsetTime>= this.p.keyframes[this.p.keyframes.length - 1].t) {
v1 = this.p.getValueAtTime(this.p.keyframes[this.p.keyframes.length - 1].t / frameRate, 0);
v2 = this.p.getValueAtTime((this.p.keyframes[this.p.keyframes.length - 1].t - 0.05) / frameRate, 0)
} else {
v1 = this.p.pv;
v2 = this.p.getValueAtTime((this.p._caching.lastFrame + this.p.offsetTime - 0.01) / frameRate, this.p.offsetTime)
}
} else if (this.px && this.px.keyframes && this.py.keyframes && this.px.getValueAtTime && this.py.getValueAtTime) {
v1 = [];
v2 = [];
var px = this.px;
var py = this.py;
if (px._caching.lastFrame + px.offsetTime <= px.keyframes[0].t) { v1[0] = px.getValueAtTime((px.keyframes[0].t + 0.01) / frameRate, 0); v1[1] = py.getValueAtTime((py.keyframes[0].t + 0.01) / frameRate, 0); v2[0] = px.getValueAtTime(px.keyframes[0].t / frameRate, 0); v2[1] = py.getValueAtTime(py.keyframes[0].t / frameRate, 0) } else if (px._caching.lastFrame + px.offsetTime>= px.keyframes[px.keyframes.length - 1].t) {
v1[0] = px.getValueAtTime(px.keyframes[px.keyframes.length - 1].t / frameRate, 0);
v1[1] = py.getValueAtTime(py.keyframes[py.keyframes.length - 1].t / frameRate, 0);
v2[0] = px.getValueAtTime((px.keyframes[px.keyframes.length - 1].t - 0.01) / frameRate, 0);
v2[1] = py.getValueAtTime((py.keyframes[py.keyframes.length - 1].t - 0.01) / frameRate, 0)
} else {
v1 = [px.pv, py.pv];
v2[0] = px.getValueAtTime((px._caching.lastFrame + px.offsetTime - 0.01) / frameRate, px.offsetTime);
v2[1] = py.getValueAtTime((py._caching.lastFrame + py.offsetTime - 0.01) / frameRate, py.offsetTime)
}
} else {
v2 = defaultVector;
v1 = v2
}
this.v.rotate(-Math.atan2(v1[1] - v2[1], v1[0] - v2[0]))
}
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)
} else {
this.v.translate(this.px.v, this.py.v, 0)
}
} else {
this.v.translate(this.p.v[0], this.p.v[1], -this.p.v[2])
}
}
this.frameId = this.elem.globalData.frameId
}
function precalculateMatrix() {
if (!this.a.k) {
this.pre.translate(-this.a.v[0], -this.a.v[1], this.a.v[2]);
this.appliedTransformations = 1
} else {
return
}
if (!this.s.effectsSequence.length) {
this.pre.scale(this.s.v[0], this.s.v[1], this.s.v[2]);
this.appliedTransformations = 2
} else {
return
}
if (this.sk) {
if (!this.sk.effectsSequence.length && !this.sa.effectsSequence.length) {
this.pre.skewFromAxis(-this.sk.v, this.sa.v);
this.appliedTransformations = 3
} else {
return
}
}
if (this.r) {
if (!this.r.effectsSequence.length) {
this.pre.rotate(-this.r.v);
this.appliedTransformations = 4
}
} else if (!this.rz.effectsSequence.length && !this.ry.effectsSequence.length && !this.rx.effectsSequence.length && !this.or.effectsSequence.length) {
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]);
this.appliedTransformations = 4
}
}
function autoOrient() {}
function addDynamicProperty(prop) {
this._addDynamicProperty(prop);
this.elem.addDynamicProperty(prop);
this._isDirty = true
}
function TransformProperty(elem, data, container) {
this.elem = elem;
this.frameId = -1;
this.propType = 'transform';
this.data = data;
this.v = new Matrix();
this.pre = new Matrix();
this.appliedTransformations = 0;
this.initDynamicPropertyContainer(container || elem);
if (data.p && data.p.s) {
this.px = PropertyFactory.getProp(elem, data.p.x, 0, 0, this);
this.py = PropertyFactory.getProp(elem, data.p.y, 0, 0, this);
if (data.p.z) {
this.pz = PropertyFactory.getProp(elem, data.p.z, 0, 0, this)
}
} else {
this.p = PropertyFactory.getProp(elem, data.p || {
k: [0, 0, 0]
}, 1, 0, this)
}
if (data.rx) {
this.rx = PropertyFactory.getProp(elem, data.rx, 0, degToRads, this);
this.ry = PropertyFactory.getProp(elem, data.ry, 0, degToRads, this);
this.rz = PropertyFactory.getProp(elem, data.rz, 0, degToRads, this);
if (data.or.k[0].ti) {
var i;
var len = data.or.k.length;
for (i = 0; i < len; i += 1) { data.or.k[i].to = null; data.or.k[i].ti = null } } this.or = PropertyFactory.getProp(elem, data.or, 1, degToRads, this); this.or.sh = true } else { this.r = PropertyFactory.getProp(elem, data.r || { k: 0 }, 0, degToRads, this) } if (data.sk) { this.sk = PropertyFactory.getProp(elem, data.sk, 0, degToRads, this); this.sa = PropertyFactory.getProp(elem, data.sa, 0, degToRads, this) } this.a = PropertyFactory.getProp(elem, data.a || { k: [0, 0, 0] }, 1, 0, this); this.s = PropertyFactory.getProp(elem, data.s || { k: [100, 100, 100] }, 1, 0.01, this); if (data.o) { this.o = PropertyFactory.getProp(elem, data.o, 0, 0.01, elem) } else { this.o = { _mdf: false, v: 1 } } this._isDirty = true; if (!this.dynamicProperties.length) { this.getValue(true) } } TransformProperty.prototype = { applyToMatrix: applyToMatrix, getValue: processKeys, precalculateMatrix: precalculateMatrix, autoOrient: autoOrient }; extendPrototype([DynamicPropertyContainer], TransformProperty); TransformProperty.prototype.addDynamicProperty = addDynamicProperty; TransformProperty.prototype._addDynamicProperty = DynamicPropertyContainer.prototype.addDynamicProperty; function getTransformProperty(elem, data, container) { return new TransformProperty(elem, data, container) } return { getTransformProperty: getTransformProperty } }(); function RepeaterModifier() {} extendPrototype([ShapeModifier], RepeaterModifier); RepeaterModifier.prototype.initModifierProperties = function (elem, data) { this.getValue = this.processKeys; this.c = PropertyFactory.getProp(elem, data.c, 0, null, this); this.o = PropertyFactory.getProp(elem, data.o, 0, null, this); this.tr = TransformPropertyFactory.getTransformProperty(elem, data.tr, this); this.so = PropertyFactory.getProp(elem, data.tr.so, 0, 0.01, this); this.eo = PropertyFactory.getProp(elem, data.tr.eo, 0, 0.01, this); this.data = data; if (!this.dynamicProperties.length) { this.getValue(true) } this._isAnimated = !!this.dynamicProperties.length; this.pMatrix = new Matrix(); this.rMatrix = new Matrix(); this.sMatrix = new Matrix(); this.tMatrix = new Matrix(); this.matrix = new Matrix() }; RepeaterModifier.prototype.applyTransforms = function (pMatrix, rMatrix, sMatrix, transform, perc, inv) { var dir = inv ? -1 : 1; var scaleX = transform.s.v[0] + (1 - transform.s.v[0]) * (1 - perc); var scaleY = transform.s.v[1] + (1 - transform.s.v[1]) * (1 - perc); pMatrix.translate(transform.p.v[0] * dir * perc, transform.p.v[1] * dir * perc, transform.p.v[2]); rMatrix.translate(-transform.a.v[0], -transform.a.v[1], transform.a.v[2]); rMatrix.rotate(-transform.r.v * dir * perc); rMatrix.translate(transform.a.v[0], transform.a.v[1], transform.a.v[2]); sMatrix.translate(-transform.a.v[0], -transform.a.v[1], transform.a.v[2]); sMatrix.scale(inv ? 1 / scaleX : scaleX, inv ? 1 / scaleY : scaleY); sMatrix.translate(transform.a.v[0], transform.a.v[1], transform.a.v[2]) }; RepeaterModifier.prototype.init = function (elem, arr, pos, elemsData) { this.elem = elem; this.arr = arr; this.pos = pos; this.elemsData = elemsData; this._currentCopies = 0; this._elements = []; this._groups = []; this.frameId = -1; this.initDynamicPropertyContainer(elem); this.initModifierProperties(elem, arr[pos]); while (pos> 0) {
pos -= 1;
this._elements.unshift(arr[pos])
}
if (this.dynamicProperties.length) {
this.k = true
} else {
this.getValue(true)
}
};
RepeaterModifier.prototype.resetElements = function (elements) {
var i;
var len = elements.length;
for (i = 0; i < len; i += 1) { elements[i]._processed = false; if (elements[i].ty === 'gr') { this.resetElements(elements[i].it) } } }; RepeaterModifier.prototype.cloneElements = function (elements) { var newElements = JSON.parse(JSON.stringify(elements)); this.resetElements(newElements); return newElements }; RepeaterModifier.prototype.changeGroupRender = function (elements, renderFlag) { var i; var len = elements.length; for (i = 0; i < len; i += 1) { elements[i]._render = renderFlag; if (elements[i].ty === 'gr') { this.changeGroupRender(elements[i].it, renderFlag) } } }; RepeaterModifier.prototype.processShapes = function (_isFirstFrame) { var items; var itemsTransform; var i; var dir; var cont; var hasReloaded = false; if (this._mdf || _isFirstFrame) { var copies = Math.ceil(this.c.v); if (this._groups.length < copies) { while (this._groups.length < copies) { var group = { it: this.cloneElements(this._elements), ty: 'gr' }; group.it.push({ a: { a: 0, ix: 1, k: [0, 0] }, nm: 'Transform', o: { a: 0, ix: 7, k: 100 }, p: { a: 0, ix: 2, k: [0, 0] }, r: { a: 1, ix: 6, k: [{ s: 0, e: 0, t: 0 }, { s: 0, e: 0, t: 1 }] }, s: { a: 0, ix: 3, k: [100, 100] }, sa: { a: 0, ix: 5, k: 0 }, sk: { a: 0, ix: 4, k: 0 }, ty: 'tr' }); this.arr.splice(0, 0, group); this._groups.splice(0, 0, group); this._currentCopies += 1 } this.elem.reloadShapes(); hasReloaded = true } cont = 0; var renderFlag; for (i = 0; i <= this._groups.length - 1; i += 1) { renderFlag = cont < copies; this._groups[i]._render = renderFlag; this.changeGroupRender(this._groups[i].it, renderFlag); if (!renderFlag) { var elems = this.elemsData[i].it; var transformData = elems[elems.length - 1]; if (transformData.transform.op.v !== 0) { transformData.transform.op._mdf = true; transformData.transform.op.v = 0 } else { transformData.transform.op._mdf = false } } cont += 1 } this._currentCopies = copies; var offset = this.o.v; var offsetModulo = offset % 1; var roundOffset = offset> 0 ? Math.floor(offset) : Math.ceil(offset);
var pProps = this.pMatrix.props;
var rProps = this.rMatrix.props;
var sProps = this.sMatrix.props;
this.pMatrix.reset();
this.rMatrix.reset();
this.sMatrix.reset();
this.tMatrix.reset();
this.matrix.reset();
var iteration = 0;
if (offset> 0) {
while (iteration < roundOffset) { this.applyTransforms(this.pMatrix, this.rMatrix, this.sMatrix, this.tr, 1, false); iteration += 1 } if (offsetModulo) { this.applyTransforms(this.pMatrix, this.rMatrix, this.sMatrix, this.tr, offsetModulo, false); iteration += offsetModulo } } else if (offset < 0) { while (iteration> roundOffset) {
this.applyTransforms(this.pMatrix, this.rMatrix, this.sMatrix, this.tr, 1, true);
iteration -= 1
}
if (offsetModulo) {
this.applyTransforms(this.pMatrix, this.rMatrix, this.sMatrix, this.tr, -offsetModulo, true);
iteration -= offsetModulo
}
}
i = this.data.m === 1 ? 0 : this._currentCopies - 1;
dir = this.data.m === 1 ? 1 : -1;
cont = this._currentCopies;
var j;
var jLen;
while (cont) {
items = this.elemsData[i].it;
itemsTransform = items[items.length - 1].transform.mProps.v.props;
jLen = itemsTransform.length;
items[items.length - 1].transform.mProps._mdf = true;
items[items.length - 1].transform.op._mdf = true;
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));
if (iteration !== 0) {
if (i !== 0 && dir === 1 || i !== this._currentCopies - 1 && dir === -1) {
this.applyTransforms(this.pMatrix, this.rMatrix, this.sMatrix, this.tr, 1, false)
}
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]);
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]);
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]);
for (j = 0; j < jLen; j += 1) { itemsTransform[j] = this.matrix.props[j] } this.matrix.reset() } else { this.matrix.reset(); for (j = 0; j < jLen; j += 1) { itemsTransform[j] = this.matrix.props[j] } } iteration += 1; cont -= 1; i += dir } } else { cont = this._currentCopies; i = 0; dir = 1; while (cont) { items = this.elemsData[i].it; itemsTransform = items[items.length - 1].transform.mProps.v.props; items[items.length - 1].transform.mProps._mdf = false; items[items.length - 1].transform.op._mdf = false; cont -= 1; i += dir } } return hasReloaded }; RepeaterModifier.prototype.addShape = function () {}; function RoundCornersModifier() {} extendPrototype([ShapeModifier], RoundCornersModifier); RoundCornersModifier.prototype.initModifierProperties = function (elem, data) { this.getValue = this.processKeys; this.rd = PropertyFactory.getProp(elem, data.r, 0, null, this); this._isAnimated = !!this.rd.effectsSequence.length }; RoundCornersModifier.prototype.processPath = function (path, round) { var clonedPath = shapePool.newElement(); clonedPath.c = path.c; var i; var len = path._length; var currentV; var currentI; var currentO; var closerV; var distance; var newPosPerc; var index = 0; var vX; var vY; var oX; var oY; var iX; var iY; for (i = 0; i < len; i += 1) { currentV = path.v[i]; currentO = path.o[i]; currentI = path.i[i]; 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) { clonedPath.setTripleAt(currentV[0], currentV[1], currentO[0], currentO[1], currentI[0], currentI[1], index); index += 1 } else { if (i === 0) { closerV = path.v[len - 1] } else { closerV = path.v[i - 1] } distance = Math.sqrt(Math.pow(currentV[0] - closerV[0], 2) + Math.pow(currentV[1] - closerV[1], 2)); newPosPerc = distance ? Math.min(distance / 2, round) / distance : 0; iX = currentV[0] + (closerV[0] - currentV[0]) * newPosPerc; vX = iX; iY = currentV[1] - (currentV[1] - closerV[1]) * newPosPerc; vY = iY; oX = vX - (vX - currentV[0]) * roundCorner; oY = vY - (vY - currentV[1]) * roundCorner; clonedPath.setTripleAt(vX, vY, oX, oY, iX, iY, index); index += 1; if (i === len - 1) { closerV = path.v[0] } else { closerV = path.v[i + 1] } distance = Math.sqrt(Math.pow(currentV[0] - closerV[0], 2) + Math.pow(currentV[1] - closerV[1], 2)); newPosPerc = distance ? Math.min(distance / 2, round) / distance : 0; oX = currentV[0] + (closerV[0] - currentV[0]) * newPosPerc; vX = oX; oY = currentV[1] + (closerV[1] - currentV[1]) * newPosPerc; vY = oY; iX = vX - (vX - currentV[0]) * roundCorner; iY = vY - (vY - currentV[1]) * roundCorner; clonedPath.setTripleAt(vX, vY, oX, oY, iX, iY, index); index += 1 } } else { 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); index += 1 } } return clonedPath }; RoundCornersModifier.prototype.processShapes = function (_isFirstFrame) { var shapePaths; var i; var len = this.shapes.length; var j; var jLen; var rd = this.rd.v; if (rd !== 0) { var shapeData; var localShapeCollection; for (i = 0; i < len; i += 1) { shapeData = this.shapes[i]; localShapeCollection = shapeData.localShapeCollection; if (!(!shapeData.shape._mdf && !this._mdf && !_isFirstFrame)) { localShapeCollection.releaseShapes(); shapeData.shape._mdf = true; shapePaths = shapeData.shape.paths.shapes; jLen = shapeData.shape.paths._length; for (j = 0; j < jLen; j += 1) { localShapeCollection.addShape(this.processPath(shapePaths[j], rd)) } } shapeData.shape.paths = shapeData.localShapeCollection } } if (!this.dynamicProperties.length) { this._mdf = false } }; function getFontProperties(fontData) { var styles = fontData.fStyle ? fontData.fStyle.split(' ') : []; var fWeight = 'normal'; var fStyle = 'normal'; var len = styles.length; var styleName; for (var i = 0; i < len; i += 1) { styleName = styles[i].toLowerCase(); switch (styleName) { case 'italic': fStyle = 'italic'; break; case 'bold': fWeight = '700'; break; case 'black': fWeight = '900'; break; case 'medium': fWeight = '500'; break; case 'regular': case 'normal': fWeight = '400'; break; case 'light': case 'thin': fWeight = '200'; break; default: break } } return { style: fStyle, weight: fontData.fWeight || fWeight } } var FontManager = function () { var maxWaitingTime = 5000; var emptyChar = { w: 0, size: 0, shapes: [], data: { shapes: [] } }; var combinedCharacters = []; combinedCharacters = combinedCharacters.concat([2304, 2305, 2306, 2307, 2362, 2363, 2364, 2364, 2366, 2367, 2368, 2369, 2370, 2371, 2372, 2373, 2374, 2375, 2376, 2377, 2378, 2379, 2380, 2381, 2382, 2383, 2387, 2388, 2389, 2390, 2391, 2402, 2403]); var surrogateModifiers = ['d83cdffb', 'd83cdffc', 'd83cdffd', 'd83cdffe', 'd83cdfff']; var zeroWidthJoiner = [65039, 8205]; function trimFontOptions(font) { var familyArray = font.split(','); var i; var len = familyArray.length; var enabledFamilies = []; for (i = 0; i < len; i += 1) { if (familyArray[i] !== 'sans-serif' && familyArray[i] !== 'monospace') { enabledFamilies.push(familyArray[i]) } } return enabledFamilies.join(',') } function setUpNode(font, family) { var parentNode = createTag('span'); parentNode.setAttribute('aria-hidden', true); parentNode.style.fontFamily = family; var node = createTag('span'); node.innerText = 'giItT1WQy@!-/#'; parentNode.style.position = 'absolute'; parentNode.style.left = '-10000px'; parentNode.style.top = '-10000px'; parentNode.style.fontSize = '300px'; parentNode.style.fontVariant = 'normal'; parentNode.style.fontStyle = 'normal'; parentNode.style.fontWeight = 'normal'; parentNode.style.letterSpacing = '0'; parentNode.appendChild(node); document.body.appendChild(parentNode); var width = node.offsetWidth; node.style.fontFamily = trimFontOptions(font) + ', ' + family; return { node: node, w: width, parent: parentNode } } function checkLoadedFonts() { var i; var len = this.fonts.length; var node; var w; var loadedCount = len; for (i = 0; i < len; i += 1) { if (this.fonts[i].loaded) { loadedCount -= 1 } else if (this.fonts[i].fOrigin === 'n' || this.fonts[i].origin === 0) { this.fonts[i].loaded = true } else { node = this.fonts[i].monoCase.node; w = this.fonts[i].monoCase.w; if (node.offsetWidth !== w) { loadedCount -= 1; this.fonts[i].loaded = true } else { node = this.fonts[i].sansCase.node; w = this.fonts[i].sansCase.w; if (node.offsetWidth !== w) { loadedCount -= 1; this.fonts[i].loaded = true } } if (this.fonts[i].loaded) { this.fonts[i].sansCase.parent.parentNode.removeChild(this.fonts[i].sansCase.parent); this.fonts[i].monoCase.parent.parentNode.removeChild(this.fonts[i].monoCase.parent) } } } if (loadedCount !== 0 && Date.now() - this.initTime < maxWaitingTime) { setTimeout(this.checkLoadedFontsBinded, 20) } else { setTimeout(this.setIsLoadedBinded, 10) } } function createHelper(fontData, def) { var engine = document.body && def ? 'svg' : 'canvas'; var helper; var fontProps = getFontProperties(fontData); if (engine === 'svg') { var tHelper = createNS('text'); tHelper.style.fontSize = '100px'; tHelper.setAttribute('font-family', fontData.fFamily); tHelper.setAttribute('font-style', fontProps.style); tHelper.setAttribute('font-weight', fontProps.weight); tHelper.textContent = '1'; if (fontData.fClass) { tHelper.style.fontFamily = 'inherit'; tHelper.setAttribute('class', fontData.fClass) } else { tHelper.style.fontFamily = fontData.fFamily } def.appendChild(tHelper); helper = tHelper } else { var tCanvasHelper = new OffscreenCanvas(500, 500).getContext('2d'); tCanvasHelper.font = fontProps.style + ' ' + fontProps.weight + ' 100px ' + fontData.fFamily; helper = tCanvasHelper } function measure(text) { if (engine === 'svg') { helper.textContent = text; return helper.getComputedTextLength() } return helper.measureText(text).width } return { measureText: measure } } function addFonts(fontData, defs) { if (!fontData) { this.isLoaded = true; return } if (this.chars) { this.isLoaded = true; this.fonts = fontData.list; return } if (!document.body) { this.isLoaded = true; fontData.list.forEach(function (data) { data.helper = createHelper(data); data.cache = {} }); this.fonts = fontData.list; return } var fontArr = fontData.list; var i; var len = fontArr.length; var _pendingFonts = len; for (i = 0; i < len; i += 1) { var shouldLoadFont = true; var loadedSelector; var j; fontArr[i].loaded = false; fontArr[i].monoCase = setUpNode(fontArr[i].fFamily, 'monospace'); fontArr[i].sansCase = setUpNode(fontArr[i].fFamily, 'sans-serif'); if (!fontArr[i].fPath) { fontArr[i].loaded = true; _pendingFonts -= 1 } else if (fontArr[i].fOrigin === 'p' || fontArr[i].origin === 3) { loadedSelector = document.querySelectorAll('style[f-forigin="p"][f-family="' + fontArr[i].fFamily + '"], style[f-origin="3"][f-family="' + fontArr[i].fFamily + '"]'); if (loadedSelector.length> 0) {
shouldLoadFont = false
}
if (shouldLoadFont) {
var s = createTag('style');
s.setAttribute('f-forigin', fontArr[i].fOrigin);
s.setAttribute('f-origin', fontArr[i].origin);
s.setAttribute('f-family', fontArr[i].fFamily);
s.type = 'text/css';
s.innerText = '@font-face {font-family: ' + fontArr[i].fFamily + "; font-style: normal; src: url('" + fontArr[i].fPath + "');}";
defs.appendChild(s)
}
} else if (fontArr[i].fOrigin === 'g' || fontArr[i].origin === 1) {
loadedSelector = document.querySelectorAll('link[f-forigin="g"], link[f-origin="1"]');
for (j = 0; j < loadedSelector.length; j += 1) { if (loadedSelector[j].href.indexOf(fontArr[i].fPath) !== -1) { shouldLoadFont = false } } if (shouldLoadFont) { var l = createTag('link'); l.setAttribute('f-forigin', fontArr[i].fOrigin); l.setAttribute('f-origin', fontArr[i].origin); l.type = 'text/css'; l.rel = 'stylesheet'; l.href = fontArr[i].fPath; document.body.appendChild(l) } } else if (fontArr[i].fOrigin === 't' || fontArr[i].origin === 2) { loadedSelector = document.querySelectorAll('script[f-forigin="t"], script[f-origin="2"]'); for (j = 0; j < loadedSelector.length; j += 1) { if (fontArr[i].fPath === loadedSelector[j].src) { shouldLoadFont = false } } if (shouldLoadFont) { var sc = createTag('link'); sc.setAttribute('f-forigin', fontArr[i].fOrigin); sc.setAttribute('f-origin', fontArr[i].origin); sc.setAttribute('rel', 'stylesheet'); sc.setAttribute('href', fontArr[i].fPath); defs.appendChild(sc) } } fontArr[i].helper = createHelper(fontArr[i], defs); fontArr[i].cache = {}; this.fonts.push(fontArr[i]) } if (_pendingFonts === 0) { this.isLoaded = true } else { setTimeout(this.checkLoadedFonts.bind(this), 100) } } function addChars(chars) { if (!chars) { return } if (!this.chars) { this.chars = [] } var i; var len = chars.length; var j; var jLen = this.chars.length; var found; for (i = 0; i < len; i += 1) { j = 0; found = false; while (j < jLen) { if (this.chars[j].style === chars[i].style && this.chars[j].fFamily === chars[i].fFamily && this.chars[j].ch === chars[i].ch) { found = true } j += 1 } if (!found) { this.chars.push(chars[i]); jLen += 1 } } } function getCharData(_char, style, font) { var i = 0; var len = this.chars.length; while (i < len) { if (this.chars[i].ch === _char && this.chars[i].style === style && this.chars[i].fFamily === font) { return this.chars[i] } i += 1 } if ((typeof _char === 'string' && _char.charCodeAt(0) !== 13 || !_char) && console && console.warn && !this._warned) { this._warned = true; console.warn('Missing character from exported characters list: ', _char, style, font) } return emptyChar } function measureText(_char2, fontName, size) { var fontData = this.getFontByName(fontName); var index = _char2.charCodeAt(0); if (!fontData.cache[index + 1]) { var tHelper = fontData.helper; if (_char2 === ' ') { var doubleSize = tHelper.measureText('|' + _char2 + '|'); var singleSize = tHelper.measureText('||'); fontData.cache[index + 1] = (doubleSize - singleSize) / 100 } else { fontData.cache[index + 1] = tHelper.measureText(_char2) / 100 } } return fontData.cache[index + 1] * size } function getFontByName(name) { var i = 0; var len = this.fonts.length; while (i < len) { if (this.fonts[i].fName === name) { return this.fonts[i] } i += 1 } return this.fonts[0] } function isModifier(firstCharCode, secondCharCode) { var sum = firstCharCode.toString(16) + secondCharCode.toString(16); return surrogateModifiers.indexOf(sum) !== -1 } function isZeroWidthJoiner(firstCharCode, secondCharCode) { if (!secondCharCode) { return firstCharCode === zeroWidthJoiner[1] } return firstCharCode === zeroWidthJoiner[0] && secondCharCode === zeroWidthJoiner[1] } function isCombinedCharacter(_char3) { return combinedCharacters.indexOf(_char3) !== -1 } function setIsLoaded() { this.isLoaded = true } var Font = function Font() { this.fonts = []; this.chars = null; this.typekitLoaded = 0; this.isLoaded = false; this._warned = false; this.initTime = Date.now(); this.setIsLoadedBinded = this.setIsLoaded.bind(this); this.checkLoadedFontsBinded = this.checkLoadedFonts.bind(this) }; Font.isModifier = isModifier; Font.isZeroWidthJoiner = isZeroWidthJoiner; Font.isCombinedCharacter = isCombinedCharacter; var fontPrototype = { addChars: addChars, addFonts: addFonts, getCharData: getCharData, getFontByName: getFontByName, measureText: measureText, checkLoadedFonts: checkLoadedFonts, setIsLoaded: setIsLoaded }; Font.prototype = fontPrototype; return Font }(); function RenderableElement() {} RenderableElement.prototype = { initRenderable: function initRenderable() { this.isInRange = false; this.hidden = false; this.isTransparent = false; this.renderableComponents = [] }, addRenderableComponent: function addRenderableComponent(component) { if (this.renderableComponents.indexOf(component) === -1) { this.renderableComponents.push(component) } }, removeRenderableComponent: function removeRenderableComponent(component) { if (this.renderableComponents.indexOf(component) !== -1) { this.renderableComponents.splice(this.renderableComponents.indexOf(component), 1) } }, prepareRenderableFrame: function prepareRenderableFrame(num) { this.checkLayerLimits(num) }, checkTransparency: function checkTransparency() { if (this.finalTransform.mProp.o.v <= 0) { if (!this.isTransparent && this.globalData.renderConfig.hideOnTransparent) { this.isTransparent = true; this.hide() } } else if (this.isTransparent) { this.isTransparent = false; this.show() } }, checkLayerLimits: function checkLayerLimits(num) { if (this.data.ip - this.data.st <= num && this.data.op - this.data.st> num) {
if (this.isInRange !== true) {
this.globalData._mdf = true;
this._mdf = true;
this.isInRange = true;
this.show()
}
} else if (this.isInRange !== false) {
this.globalData._mdf = true;
this.isInRange = false;
this.hide()
}
},
renderRenderable: function renderRenderable() {
var i;
var len = this.renderableComponents.length;
for (i = 0; i < len; i += 1) { this.renderableComponents[i].renderFrame(this._isFirstFrame) } }, sourceRectAtTime: function sourceRectAtTime() { return { top: 0, left: 0, width: 100, height: 100 } }, getLayerSize: function getLayerSize() { if (this.data.ty === 5) { return { w: this.data.textData.width, h: this.data.textData.height } } return { w: this.data.width, h: this.data.height } } }; var MaskManagerInterface = function () { function MaskInterface(mask, data) { this._mask = mask; this._data = data } Object.defineProperty(MaskInterface.prototype, 'maskPath', { get: function get() { if (this._mask.prop.k) { this._mask.prop.getValue() } return this._mask.prop } }); Object.defineProperty(MaskInterface.prototype, 'maskOpacity', { get: function get() { if (this._mask.op.k) { this._mask.op.getValue() } return this._mask.op.v * 100 } }); var MaskManager = function MaskManager(maskManager) { var _masksInterfaces = createSizedArray(maskManager.viewData.length); var i; var len = maskManager.viewData.length; for (i = 0; i < len; i += 1) { _masksInterfaces[i] = new MaskInterface(maskManager.viewData[i], maskManager.masksProperties[i]) } var maskFunction = function maskFunction(name) { i = 0; while (i < len) { if (maskManager.masksProperties[i].nm === name) { return _masksInterfaces[i] } i += 1 } return null }; return maskFunction }; return MaskManager }(); var ExpressionPropertyInterface = function () { var defaultUnidimensionalValue = { pv: 0, v: 0, mult: 1 }; var defaultMultidimensionalValue = { pv: [0, 0, 0], v: [0, 0, 0], mult: 1 }; function completeProperty(expressionValue, property, type) { Object.defineProperty(expressionValue, 'velocity', { get: function get() { return property.getVelocityAtTime(property.comp.currentFrame) } }); expressionValue.numKeys = property.keyframes ? property.keyframes.length : 0; expressionValue.key = function (pos) { if (!expressionValue.numKeys) { return 0 } var value = ''; if ('s' in property.keyframes[pos - 1]) { value = property.keyframes[pos - 1].s } else if ('e' in property.keyframes[pos - 2]) { value = property.keyframes[pos - 2].e } else { value = property.keyframes[pos - 2].s } var valueProp = type === 'unidimensional' ? new Number(value) : Object.assign({}, value); valueProp.time = property.keyframes[pos - 1].t / property.elem.comp.globalData.frameRate; valueProp.value = type === 'unidimensional' ? value[0] : value; return valueProp }; expressionValue.valueAtTime = property.getValueAtTime; expressionValue.speedAtTime = property.getSpeedAtTime; expressionValue.velocityAtTime = property.getVelocityAtTime; expressionValue.propertyGroup = property.propertyGroup } function UnidimensionalPropertyInterface(property) { if (!property || !('pv' in property)) { property = defaultUnidimensionalValue } var mult = 1 / property.mult; var val = property.pv * mult; var expressionValue = new Number(val); expressionValue.value = val; completeProperty(expressionValue, property, 'unidimensional'); return function () { if (property.k) { property.getValue() } val = property.v * mult; if (expressionValue.value !== val) { expressionValue = new Number(val); expressionValue.value = val; completeProperty(expressionValue, property, 'unidimensional') } return expressionValue } } function MultidimensionalPropertyInterface(property) { if (!property || !('pv' in property)) { property = defaultMultidimensionalValue } var mult = 1 / property.mult; var len = property.data && property.data.l || property.pv.length; var expressionValue = createTypedArray('float32', len); var arrValue = createTypedArray('float32', len); expressionValue.value = arrValue; completeProperty(expressionValue, property, 'multidimensional'); return function () { if (property.k) { property.getValue() } for (var i = 0; i < len; i += 1) { arrValue[i] = property.v[i] * mult; expressionValue[i] = arrValue[i] } return expressionValue } } function defaultGetter() { return defaultUnidimensionalValue } return function (property) { if (!property) { return defaultGetter } if (property.propType === 'unidimensional') { return UnidimensionalPropertyInterface(property) } return MultidimensionalPropertyInterface(property) } }(); var TransformExpressionInterface = function () { return function (transform) { function _thisFunction(name) { switch (name) { case 'scale': case 'Scale': case 'ADBE Scale': case 6: return _thisFunction.scale; case 'rotation': case 'Rotation': case 'ADBE Rotation': case 'ADBE Rotate Z': case 10: return _thisFunction.rotation; case 'ADBE Rotate X': return _thisFunction.xRotation; case 'ADBE Rotate Y': return _thisFunction.yRotation; case 'position': case 'Position': case 'ADBE Position': case 2: return _thisFunction.position; case 'ADBE Position_0': return _thisFunction.xPosition; case 'ADBE Position_1': return _thisFunction.yPosition; case 'ADBE Position_2': return _thisFunction.zPosition; case 'anchorPoint': case 'AnchorPoint': case 'Anchor Point': case 'ADBE AnchorPoint': case 1: return _thisFunction.anchorPoint; case 'opacity': case 'Opacity': case 11: return _thisFunction.opacity; default: return null } } Object.defineProperty(_thisFunction, 'rotation', { get: ExpressionPropertyInterface(transform.r || transform.rz) }); Object.defineProperty(_thisFunction, 'zRotation', { get: ExpressionPropertyInterface(transform.rz || transform.r) }); Object.defineProperty(_thisFunction, 'xRotation', { get: ExpressionPropertyInterface(transform.rx) }); Object.defineProperty(_thisFunction, 'yRotation', { get: ExpressionPropertyInterface(transform.ry) }); Object.defineProperty(_thisFunction, 'scale', { get: ExpressionPropertyInterface(transform.s) }); var _px; var _py; var _pz; var _transformFactory; if (transform.p) { _transformFactory = ExpressionPropertyInterface(transform.p) } else { _px = ExpressionPropertyInterface(transform.px); _py = ExpressionPropertyInterface(transform.py); if (transform.pz) { _pz = ExpressionPropertyInterface(transform.pz) } } Object.defineProperty(_thisFunction, 'position', { get: function get() { if (transform.p) { return _transformFactory() } return [_px(), _py(), _pz ? _pz() : 0] } }); Object.defineProperty(_thisFunction, 'xPosition', { get: ExpressionPropertyInterface(transform.px) }); Object.defineProperty(_thisFunction, 'yPosition', { get: ExpressionPropertyInterface(transform.py) }); Object.defineProperty(_thisFunction, 'zPosition', { get: ExpressionPropertyInterface(transform.pz) }); Object.defineProperty(_thisFunction, 'anchorPoint', { get: ExpressionPropertyInterface(transform.a) }); Object.defineProperty(_thisFunction, 'opacity', { get: ExpressionPropertyInterface(transform.o) }); Object.defineProperty(_thisFunction, 'skew', { get: ExpressionPropertyInterface(transform.sk) }); Object.defineProperty(_thisFunction, 'skewAxis', { get: ExpressionPropertyInterface(transform.sa) }); Object.defineProperty(_thisFunction, 'orientation', { get: ExpressionPropertyInterface(transform.or) }); return _thisFunction } }(); var LayerExpressionInterface = function () { function getMatrix(time) { var toWorldMat = new Matrix(); if (time !== undefined) { var propMatrix = this._elem.finalTransform.mProp.getValueAtTime(time); propMatrix.clone(toWorldMat) } else { var transformMat = this._elem.finalTransform.mProp; transformMat.applyToMatrix(toWorldMat) } return toWorldMat } function toWorldVec(arr, time) { var toWorldMat = this.getMatrix(time); toWorldMat.props[12] = 0; toWorldMat.props[13] = 0; toWorldMat.props[14] = 0; return this.applyPoint(toWorldMat, arr) } function toWorld(arr, time) { var toWorldMat = this.getMatrix(time); return this.applyPoint(toWorldMat, arr) } function fromWorldVec(arr, time) { var toWorldMat = this.getMatrix(time); toWorldMat.props[12] = 0; toWorldMat.props[13] = 0; toWorldMat.props[14] = 0; return this.invertPoint(toWorldMat, arr) } function fromWorld(arr, time) { var toWorldMat = this.getMatrix(time); return this.invertPoint(toWorldMat, arr) } function applyPoint(matrix, arr) { if (this._elem.hierarchy && this._elem.hierarchy.length) { var i; var len = this._elem.hierarchy.length; for (i = 0; i < len; i += 1) { this._elem.hierarchy[i].finalTransform.mProp.applyToMatrix(matrix) } } return matrix.applyToPointArray(arr[0], arr[1], arr[2] || 0) } function invertPoint(matrix, arr) { if (this._elem.hierarchy && this._elem.hierarchy.length) { var i; var len = this._elem.hierarchy.length; for (i = 0; i < len; i += 1) { this._elem.hierarchy[i].finalTransform.mProp.applyToMatrix(matrix) } } return matrix.inversePoint(arr) } function fromComp(arr) { var toWorldMat = new Matrix(); toWorldMat.reset(); this._elem.finalTransform.mProp.applyToMatrix(toWorldMat); if (this._elem.hierarchy && this._elem.hierarchy.length) { var i; var len = this._elem.hierarchy.length; for (i = 0; i < len; i += 1) { this._elem.hierarchy[i].finalTransform.mProp.applyToMatrix(toWorldMat) } return toWorldMat.inversePoint(arr) } return toWorldMat.inversePoint(arr) } function sampleImage() { return [1, 1, 1, 1] } return function (elem) { var transformInterface; function _registerMaskInterface(maskManager) { _thisLayerFunction.mask = new MaskManagerInterface(maskManager, elem) } function _registerEffectsInterface(effects) { _thisLayerFunction.effect = effects } function _thisLayerFunction(name) { switch (name) { case 'ADBE Root Vectors Group': case 'Contents': case 2: return _thisLayerFunction.shapeInterface; case 1: case 6: case 'Transform': case 'transform': case 'ADBE Transform Group': return transformInterface; case 4: case 'ADBE Effect Parade': case 'effects': case 'Effects': return _thisLayerFunction.effect; case 'ADBE Text Properties': return _thisLayerFunction.textInterface; default: return null } } _thisLayerFunction.getMatrix = getMatrix; _thisLayerFunction.invertPoint = invertPoint; _thisLayerFunction.applyPoint = applyPoint; _thisLayerFunction.toWorld = toWorld; _thisLayerFunction.toWorldVec = toWorldVec; _thisLayerFunction.fromWorld = fromWorld; _thisLayerFunction.fromWorldVec = fromWorldVec; _thisLayerFunction.toComp = toWorld; _thisLayerFunction.fromComp = fromComp; _thisLayerFunction.sampleImage = sampleImage; _thisLayerFunction.sourceRectAtTime = elem.sourceRectAtTime.bind(elem); _thisLayerFunction._elem = elem; transformInterface = TransformExpressionInterface(elem.finalTransform.mProp); var anchorPointDescriptor = getDescriptor(transformInterface, 'anchorPoint'); Object.defineProperties(_thisLayerFunction, { hasParent: { get: function get() { return elem.hierarchy.length } }, parent: { get: function get() { return elem.hierarchy[0].layerInterface } }, rotation: getDescriptor(transformInterface, 'rotation'), scale: getDescriptor(transformInterface, 'scale'), position: getDescriptor(transformInterface, 'position'), opacity: getDescriptor(transformInterface, 'opacity'), anchorPoint: anchorPointDescriptor, anchor_point: anchorPointDescriptor, transform: { get: function get() { return transformInterface } }, active: { get: function get() { return elem.isInRange } } }); _thisLayerFunction.startTime = elem.data.st; _thisLayerFunction.index = elem.data.ind; _thisLayerFunction.source = elem.data.refId; _thisLayerFunction.height = elem.data.ty === 0 ? elem.data.h : 100; _thisLayerFunction.width = elem.data.ty === 0 ? elem.data.w : 100; _thisLayerFunction.inPoint = elem.data.ip / elem.comp.globalData.frameRate; _thisLayerFunction.outPoint = elem.data.op / elem.comp.globalData.frameRate; _thisLayerFunction._name = elem.data.nm; _thisLayerFunction.registerMaskInterface = _registerMaskInterface; _thisLayerFunction.registerEffectsInterface = _registerEffectsInterface; return _thisLayerFunction } }(); var propertyGroupFactory = function () { return function (interfaceFunction, parentPropertyGroup) { return function (val) { val = val === undefined ? 1 : val; if (val <= 0) { return interfaceFunction } return parentPropertyGroup(val - 1) } } }(); var PropertyInterface = function () { return function (propertyName, propertyGroup) { var interfaceFunction = { _name: propertyName }; function _propertyGroup(val) { val = val === undefined ? 1 : val; if (val <= 0) { return interfaceFunction } return propertyGroup(val - 1) } return _propertyGroup } }(); var EffectsExpressionInterface = function () { var ob = { createEffectsInterface: createEffectsInterface }; function createEffectsInterface(elem, propertyGroup) { if (elem.effectsManager) { var effectElements = []; var effectsData = elem.data.ef; var i; var len = elem.effectsManager.effectElements.length; for (i = 0; i < len; i += 1) { effectElements.push(createGroupInterface(effectsData[i], elem.effectsManager.effectElements[i], propertyGroup, elem)) } var effects = elem.data.ef || []; var groupInterface = function groupInterface(name) { i = 0; len = effects.length; while (i < len) { if (name === effects[i].nm || name === effects[i].mn || name === effects[i].ix) { return effectElements[i] } i += 1 } return null }; Object.defineProperty(groupInterface, 'numProperties', { get: function get() { return effects.length } }); return groupInterface } return null } function createGroupInterface(data, elements, propertyGroup, elem) { function groupInterface(name) { var effects = data.ef; var i = 0; var len = effects.length; while (i < len) { if (name === effects[i].nm || name === effects[i].mn || name === effects[i].ix) { if (effects[i].ty === 5) { return effectElements[i] } return effectElements[i]() } i += 1 } throw new Error(); } var _propertyGroup = propertyGroupFactory(groupInterface, propertyGroup); var effectElements = []; var i; var len = data.ef.length; for (i = 0; i < len; i += 1) { if (data.ef[i].ty === 5) { effectElements.push(createGroupInterface(data.ef[i], elements.effectElements[i], elements.effectElements[i].propertyGroup, elem)) } else { effectElements.push(createValueInterface(elements.effectElements[i], data.ef[i].ty, elem, _propertyGroup)) } } if (data.mn === 'ADBE Color Control') { Object.defineProperty(groupInterface, 'color', { get: function get() { return effectElements[0]() } }) } Object.defineProperties(groupInterface, { numProperties: { get: function get() { return data.np } }, _name: { value: data.nm }, propertyGroup: { value: _propertyGroup } }); groupInterface.enabled = data.en !== 0; groupInterface.active = groupInterface.enabled; return groupInterface } function createValueInterface(element, type, elem, propertyGroup) { var expressionProperty = ExpressionPropertyInterface(element.p); function interfaceFunction() { if (type === 10) { return elem.comp.compInterface(element.p.v) } return expressionProperty() } if (element.p.setGroupProperty) { element.p.setGroupProperty(PropertyInterface('', propertyGroup)) } return interfaceFunction } return ob }(); var CompExpressionInterface = function () { return function (comp) { function _thisLayerFunction(name) { var i = 0; var len = comp.layers.length; while (i < len) { if (comp.layers[i].nm === name || comp.layers[i].ind === name) { return comp.elements[i].layerInterface } i += 1 } return null } Object.defineProperty(_thisLayerFunction, '_name', { value: comp.data.nm }); _thisLayerFunction.layer = _thisLayerFunction; _thisLayerFunction.pixelAspect = 1; _thisLayerFunction.height = comp.data.h || comp.globalData.compSize.h; _thisLayerFunction.width = comp.data.w || comp.globalData.compSize.w; _thisLayerFunction.pixelAspect = 1; _thisLayerFunction.frameDuration = 1 / comp.globalData.frameRate; _thisLayerFunction.displayStartTime = 0; _thisLayerFunction.numLayers = comp.layers.length; return _thisLayerFunction } }(); var ShapePathInterface = function () { return function pathInterfaceFactory(shape, view, propertyGroup) { var prop = view.sh; function interfaceFunction(val) { if (val === 'Shape' || val === 'shape' || val === 'Path' || val === 'path' || val === 'ADBE Vector Shape' || val === 2) { return interfaceFunction.path } return null } var _propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup); prop.setGroupProperty(PropertyInterface('Path', _propertyGroup)); Object.defineProperties(interfaceFunction, { path: { get: function get() { if (prop.k) { prop.getValue() } return prop } }, shape: { get: function get() { if (prop.k) { prop.getValue() } return prop } }, _name: { value: shape.nm }, ix: { value: shape.ix }, propertyIndex: { value: shape.ix }, mn: { value: shape.mn }, propertyGroup: { value: propertyGroup } }); return interfaceFunction } }(); var ShapeExpressionInterface = function () { function iterateElements(shapes, view, propertyGroup) { var arr = []; var i; var len = shapes ? shapes.length : 0; for (i = 0; i < len; i += 1) { if (shapes[i].ty === 'gr') { arr.push(groupInterfaceFactory(shapes[i], view[i], propertyGroup)) } else if (shapes[i].ty === 'fl') { arr.push(fillInterfaceFactory(shapes[i], view[i], propertyGroup)) } else if (shapes[i].ty === 'st') { arr.push(strokeInterfaceFactory(shapes[i], view[i], propertyGroup)) } else if (shapes[i].ty === 'tm') { arr.push(trimInterfaceFactory(shapes[i], view[i], propertyGroup)) } else if (shapes[i].ty === 'tr') {} else if (shapes[i].ty === 'el') { arr.push(ellipseInterfaceFactory(shapes[i], view[i], propertyGroup)) } else if (shapes[i].ty === 'sr') { arr.push(starInterfaceFactory(shapes[i], view[i], propertyGroup)) } else if (shapes[i].ty === 'sh') { arr.push(ShapePathInterface(shapes[i], view[i], propertyGroup)) } else if (shapes[i].ty === 'rc') { arr.push(rectInterfaceFactory(shapes[i], view[i], propertyGroup)) } else if (shapes[i].ty === 'rd') { arr.push(roundedInterfaceFactory(shapes[i], view[i], propertyGroup)) } else if (shapes[i].ty === 'rp') { arr.push(repeaterInterfaceFactory(shapes[i], view[i], propertyGroup)) } else if (shapes[i].ty === 'gf') { arr.push(gradientFillInterfaceFactory(shapes[i], view[i], propertyGroup)) } else { arr.push(defaultInterfaceFactory(shapes[i], view[i], propertyGroup)) } } return arr } function contentsInterfaceFactory(shape, view, propertyGroup) { var interfaces; var interfaceFunction = function _interfaceFunction(value) { var i = 0; var len = interfaces.length; while (i < len) { if (interfaces[i]._name === value || interfaces[i].mn === value || interfaces[i].propertyIndex === value || interfaces[i].ix === value || interfaces[i].ind === value) { return interfaces[i] } i += 1 } if (typeof value === 'number') { return interfaces[value - 1] } return null }; interfaceFunction.propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup); interfaces = iterateElements(shape.it, view.it, interfaceFunction.propertyGroup); interfaceFunction.numProperties = interfaces.length; var transformInterface = transformInterfaceFactory(shape.it[shape.it.length - 1], view.it[view.it.length - 1], interfaceFunction.propertyGroup); interfaceFunction.transform = transformInterface; interfaceFunction.propertyIndex = shape.cix; interfaceFunction._name = shape.nm; return interfaceFunction } function groupInterfaceFactory(shape, view, propertyGroup) { var interfaceFunction = function _interfaceFunction(value) { switch (value) { case 'ADBE Vectors Group': case 'Contents': case 2: return interfaceFunction.content; default: return interfaceFunction.transform } }; interfaceFunction.propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup); var content = contentsInterfaceFactory(shape, view, interfaceFunction.propertyGroup); var transformInterface = transformInterfaceFactory(shape.it[shape.it.length - 1], view.it[view.it.length - 1], interfaceFunction.propertyGroup); interfaceFunction.content = content; interfaceFunction.transform = transformInterface; Object.defineProperty(interfaceFunction, '_name', { get: function get() { return shape.nm } }); interfaceFunction.numProperties = shape.np; interfaceFunction.propertyIndex = shape.ix; interfaceFunction.nm = shape.nm; interfaceFunction.mn = shape.mn; return interfaceFunction } function fillInterfaceFactory(shape, view, propertyGroup) { function interfaceFunction(val) { if (val === 'Color' || val === 'color') { return interfaceFunction.color } if (val === 'Opacity' || val === 'opacity') { return interfaceFunction.opacity } return null } Object.defineProperties(interfaceFunction, { color: { get: ExpressionPropertyInterface(view.c) }, opacity: { get: ExpressionPropertyInterface(view.o) }, _name: { value: shape.nm }, mn: { value: shape.mn } }); view.c.setGroupProperty(PropertyInterface('Color', propertyGroup)); view.o.setGroupProperty(PropertyInterface('Opacity', propertyGroup)); return interfaceFunction } function gradientFillInterfaceFactory(shape, view, propertyGroup) { function interfaceFunction(val) { if (val === 'Start Point' || val === 'start point') { return interfaceFunction.startPoint } if (val === 'End Point' || val === 'end point') { return interfaceFunction.endPoint } if (val === 'Opacity' || val === 'opacity') { return interfaceFunction.opacity } return null } Object.defineProperties(interfaceFunction, { startPoint: { get: ExpressionPropertyInterface(view.s) }, endPoint: { get: ExpressionPropertyInterface(view.e) }, opacity: { get: ExpressionPropertyInterface(view.o) }, type: { get: function get() { return 'a' } }, _name: { value: shape.nm }, mn: { value: shape.mn } }); view.s.setGroupProperty(PropertyInterface('Start Point', propertyGroup)); view.e.setGroupProperty(PropertyInterface('End Point', propertyGroup)); view.o.setGroupProperty(PropertyInterface('Opacity', propertyGroup)); return interfaceFunction } function defaultInterfaceFactory() { function interfaceFunction() { return null } return interfaceFunction } function strokeInterfaceFactory(shape, view, propertyGroup) { var _propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup); var _dashPropertyGroup = propertyGroupFactory(dashOb, _propertyGroup); function addPropertyToDashOb(i) { Object.defineProperty(dashOb, shape.d[i].nm, { get: ExpressionPropertyInterface(view.d.dataProps[i].p) }) } var i; var len = shape.d ? shape.d.length : 0; var dashOb = {}; for (i = 0; i < len; i += 1) { addPropertyToDashOb(i); view.d.dataProps[i].p.setGroupProperty(_dashPropertyGroup) } function interfaceFunction(val) { if (val === 'Color' || val === 'color') { return interfaceFunction.color } if (val === 'Opacity' || val === 'opacity') { return interfaceFunction.opacity } if (val === 'Stroke stroke width') { return interfaceFunction.strokeWidth } return null } Object.defineProperties(interfaceFunction, { color: { get: ExpressionPropertyInterface(view.c) }, opacity: { get: ExpressionPropertyInterface(view.o) }, strokeWidth: { get: ExpressionPropertyInterface(view.w) }, dash: { get: function get() { return dashOb } }, _name: { value: shape.nm }, mn: { value: shape.mn } }); view.c.setGroupProperty(PropertyInterface('Color', _propertyGroup)); view.o.setGroupProperty(PropertyInterface('Opacity', _propertyGroup)); view.w.setGroupProperty(PropertyInterface('Stroke Width', _propertyGroup)); return interfaceFunction } function trimInterfaceFactory(shape, view, propertyGroup) { function interfaceFunction(val) { if (val === shape.e.ix || val === 'End' || val === 'end') { return interfaceFunction.end } if (val === shape.s.ix) { return interfaceFunction.start } if (val === shape.o.ix) { return interfaceFunction.offset } return null } var _propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup); interfaceFunction.propertyIndex = shape.ix; view.s.setGroupProperty(PropertyInterface('Start', _propertyGroup)); view.e.setGroupProperty(PropertyInterface('End', _propertyGroup)); view.o.setGroupProperty(PropertyInterface('Offset', _propertyGroup)); interfaceFunction.propertyIndex = shape.ix; interfaceFunction.propertyGroup = propertyGroup; Object.defineProperties(interfaceFunction, { start: { get: ExpressionPropertyInterface(view.s) }, end: { get: ExpressionPropertyInterface(view.e) }, offset: { get: ExpressionPropertyInterface(view.o) }, _name: { value: shape.nm } }); interfaceFunction.mn = shape.mn; return interfaceFunction } function transformInterfaceFactory(shape, view, propertyGroup) { function interfaceFunction(value) { if (shape.a.ix === value || value === 'Anchor Point') { return interfaceFunction.anchorPoint } if (shape.o.ix === value || value === 'Opacity') { return interfaceFunction.opacity } if (shape.p.ix === value || value === 'Position') { return interfaceFunction.position } if (shape.r.ix === value || value === 'Rotation' || value === 'ADBE Vector Rotation') { return interfaceFunction.rotation } if (shape.s.ix === value || value === 'Scale') { return interfaceFunction.scale } if (shape.sk && shape.sk.ix === value || value === 'Skew') { return interfaceFunction.skew } if (shape.sa && shape.sa.ix === value || value === 'Skew Axis') { return interfaceFunction.skewAxis } return null } var _propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup); view.transform.mProps.o.setGroupProperty(PropertyInterface('Opacity', _propertyGroup)); view.transform.mProps.p.setGroupProperty(PropertyInterface('Position', _propertyGroup)); view.transform.mProps.a.setGroupProperty(PropertyInterface('Anchor Point', _propertyGroup)); view.transform.mProps.s.setGroupProperty(PropertyInterface('Scale', _propertyGroup)); view.transform.mProps.r.setGroupProperty(PropertyInterface('Rotation', _propertyGroup)); if (view.transform.mProps.sk) { view.transform.mProps.sk.setGroupProperty(PropertyInterface('Skew', _propertyGroup)); view.transform.mProps.sa.setGroupProperty(PropertyInterface('Skew Angle', _propertyGroup)) } view.transform.op.setGroupProperty(PropertyInterface('Opacity', _propertyGroup)); Object.defineProperties(interfaceFunction, { opacity: { get: ExpressionPropertyInterface(view.transform.mProps.o) }, position: { get: ExpressionPropertyInterface(view.transform.mProps.p) }, anchorPoint: { get: ExpressionPropertyInterface(view.transform.mProps.a) }, scale: { get: ExpressionPropertyInterface(view.transform.mProps.s) }, rotation: { get: ExpressionPropertyInterface(view.transform.mProps.r) }, skew: { get: ExpressionPropertyInterface(view.transform.mProps.sk) }, skewAxis: { get: ExpressionPropertyInterface(view.transform.mProps.sa) }, _name: { value: shape.nm } }); interfaceFunction.ty = 'tr'; interfaceFunction.mn = shape.mn; interfaceFunction.propertyGroup = propertyGroup; return interfaceFunction } function ellipseInterfaceFactory(shape, view, propertyGroup) { function interfaceFunction(value) { if (shape.p.ix === value) { return interfaceFunction.position } if (shape.s.ix === value) { return interfaceFunction.size } return null } var _propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup); interfaceFunction.propertyIndex = shape.ix; var prop = view.sh.ty === 'tm' ? view.sh.prop : view.sh; prop.s.setGroupProperty(PropertyInterface('Size', _propertyGroup)); prop.p.setGroupProperty(PropertyInterface('Position', _propertyGroup)); Object.defineProperties(interfaceFunction, { size: { get: ExpressionPropertyInterface(prop.s) }, position: { get: ExpressionPropertyInterface(prop.p) }, _name: { value: shape.nm } }); interfaceFunction.mn = shape.mn; return interfaceFunction } function starInterfaceFactory(shape, view, propertyGroup) { function interfaceFunction(value) { if (shape.p.ix === value) { return interfaceFunction.position } if (shape.r.ix === value) { return interfaceFunction.rotation } if (shape.pt.ix === value) { return interfaceFunction.points } if (shape.or.ix === value || value === 'ADBE Vector Star Outer Radius') { return interfaceFunction.outerRadius } if (shape.os.ix === value) { return interfaceFunction.outerRoundness } if (shape.ir && (shape.ir.ix === value || value === 'ADBE Vector Star Inner Radius')) { return interfaceFunction.innerRadius } if (shape.is && shape.is.ix === value) { return interfaceFunction.innerRoundness } return null } var _propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup); var prop = view.sh.ty === 'tm' ? view.sh.prop : view.sh; interfaceFunction.propertyIndex = shape.ix; prop.or.setGroupProperty(PropertyInterface('Outer Radius', _propertyGroup)); prop.os.setGroupProperty(PropertyInterface('Outer Roundness', _propertyGroup)); prop.pt.setGroupProperty(PropertyInterface('Points', _propertyGroup)); prop.p.setGroupProperty(PropertyInterface('Position', _propertyGroup)); prop.r.setGroupProperty(PropertyInterface('Rotation', _propertyGroup)); if (shape.ir) { prop.ir.setGroupProperty(PropertyInterface('Inner Radius', _propertyGroup)); prop.is.setGroupProperty(PropertyInterface('Inner Roundness', _propertyGroup)) } Object.defineProperties(interfaceFunction, { position: { get: ExpressionPropertyInterface(prop.p) }, rotation: { get: ExpressionPropertyInterface(prop.r) }, points: { get: ExpressionPropertyInterface(prop.pt) }, outerRadius: { get: ExpressionPropertyInterface(prop.or) }, outerRoundness: { get: ExpressionPropertyInterface(prop.os) }, innerRadius: { get: ExpressionPropertyInterface(prop.ir) }, innerRoundness: { get: ExpressionPropertyInterface(prop.is) }, _name: { value: shape.nm } }); interfaceFunction.mn = shape.mn; return interfaceFunction } function rectInterfaceFactory(shape, view, propertyGroup) { function interfaceFunction(value) { if (shape.p.ix === value) { return interfaceFunction.position } if (shape.r.ix === value) { return interfaceFunction.roundness } if (shape.s.ix === value || value === 'Size' || value === 'ADBE Vector Rect Size') { return interfaceFunction.size } return null } var _propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup); var prop = view.sh.ty === 'tm' ? view.sh.prop : view.sh; interfaceFunction.propertyIndex = shape.ix; prop.p.setGroupProperty(PropertyInterface('Position', _propertyGroup)); prop.s.setGroupProperty(PropertyInterface('Size', _propertyGroup)); prop.r.setGroupProperty(PropertyInterface('Rotation', _propertyGroup)); Object.defineProperties(interfaceFunction, { position: { get: ExpressionPropertyInterface(prop.p) }, roundness: { get: ExpressionPropertyInterface(prop.r) }, size: { get: ExpressionPropertyInterface(prop.s) }, _name: { value: shape.nm } }); interfaceFunction.mn = shape.mn; return interfaceFunction } function roundedInterfaceFactory(shape, view, propertyGroup) { function interfaceFunction(value) { if (shape.r.ix === value || value === 'Round Corners 1') { return interfaceFunction.radius } return null } var _propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup); var prop = view; interfaceFunction.propertyIndex = shape.ix; prop.rd.setGroupProperty(PropertyInterface('Radius', _propertyGroup)); Object.defineProperties(interfaceFunction, { radius: { get: ExpressionPropertyInterface(prop.rd) }, _name: { value: shape.nm } }); interfaceFunction.mn = shape.mn; return interfaceFunction } function repeaterInterfaceFactory(shape, view, propertyGroup) { function interfaceFunction(value) { if (shape.c.ix === value || value === 'Copies') { return interfaceFunction.copies } if (shape.o.ix === value || value === 'Offset') { return interfaceFunction.offset } return null } var _propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup); var prop = view; interfaceFunction.propertyIndex = shape.ix; prop.c.setGroupProperty(PropertyInterface('Copies', _propertyGroup)); prop.o.setGroupProperty(PropertyInterface('Offset', _propertyGroup)); Object.defineProperties(interfaceFunction, { copies: { get: ExpressionPropertyInterface(prop.c) }, offset: { get: ExpressionPropertyInterface(prop.o) }, _name: { value: shape.nm } }); interfaceFunction.mn = shape.mn; return interfaceFunction } return function (shapes, view, propertyGroup) { var interfaces; function _interfaceFunction(value) { if (typeof value === 'number') { value = value === undefined ? 1 : value; if (value === 0) { return propertyGroup } return interfaces[value - 1] } var i = 0; var len = interfaces.length; while (i < len) { if (interfaces[i]._name === value) { return interfaces[i] } i += 1 } return null } function parentGroupWrapper() { return propertyGroup } _interfaceFunction.propertyGroup = propertyGroupFactory(_interfaceFunction, parentGroupWrapper); interfaces = iterateElements(shapes, view, _interfaceFunction.propertyGroup); _interfaceFunction.numProperties = interfaces.length; _interfaceFunction._name = 'Contents'; return _interfaceFunction } }(); var TextExpressionInterface = function () { return function (elem) { var _prevValue; var _sourceText; function _thisLayerFunction(name) { switch (name) { case 'ADBE Text Document': return _thisLayerFunction.sourceText; default: return null } } Object.defineProperty(_thisLayerFunction, 'sourceText', { get: function get() { elem.textProperty.getValue(); var stringValue = elem.textProperty.currentData.t; if (stringValue !== _prevValue) { elem.textProperty.currentData.t = _prevValue; _sourceText = new String(stringValue); _sourceText.value = stringValue || new String(stringValue) } return _sourceText } }); return _thisLayerFunction } }(); var getBlendMode = function () { var blendModeEnums = { 0: 'source-over', 1: 'multiply', 2: 'screen', 3: 'overlay', 4: 'darken', 5: 'lighten', 6: 'color-dodge', 7: 'color-burn', 8: 'hard-light', 9: 'soft-light', 10: 'difference', 11: 'exclusion', 12: 'hue', 13: 'saturation', 14: 'color', 15: 'luminosity' }; return function (mode) { return blendModeEnums[mode] || '' } }(); function SliderEffect(data, elem, container) { this.p = PropertyFactory.getProp(elem, data.v, 0, 0, container) } function AngleEffect(data, elem, container) { this.p = PropertyFactory.getProp(elem, data.v, 0, 0, container) } function ColorEffect(data, elem, container) { this.p = PropertyFactory.getProp(elem, data.v, 1, 0, container) } function PointEffect(data, elem, container) { this.p = PropertyFactory.getProp(elem, data.v, 1, 0, container) } function LayerIndexEffect(data, elem, container) { this.p = PropertyFactory.getProp(elem, data.v, 0, 0, container) } function MaskIndexEffect(data, elem, container) { this.p = PropertyFactory.getProp(elem, data.v, 0, 0, container) } function CheckboxEffect(data, elem, container) { this.p = PropertyFactory.getProp(elem, data.v, 0, 0, container) } function NoValueEffect() { this.p = {} } function EffectsManager(data, element) { var effects = data.ef || []; this.effectElements = []; var i; var len = effects.length; var effectItem; for (i = 0; i < len; i += 1) { effectItem = new GroupEffect(effects[i], element); this.effectElements.push(effectItem) } } function GroupEffect(data, element) { this.init(data, element) } extendPrototype([DynamicPropertyContainer], GroupEffect); GroupEffect.prototype.getValue = GroupEffect.prototype.iterateDynamicProperties; GroupEffect.prototype.init = function (data, element) { this.data = data; this.effectElements = []; this.initDynamicPropertyContainer(element); var i; var len = this.data.ef.length; var eff; var effects = this.data.ef; for (i = 0; i < len; i += 1) { eff = null; switch (effects[i].ty) { case 0: eff = new SliderEffect(effects[i], element, this); break; case 1: eff = new AngleEffect(effects[i], element, this); break; case 2: eff = new ColorEffect(effects[i], element, this); break; case 3: eff = new PointEffect(effects[i], element, this); break; case 4: case 7: eff = new CheckboxEffect(effects[i], element, this); break; case 10: eff = new LayerIndexEffect(effects[i], element, this); break; case 11: eff = new MaskIndexEffect(effects[i], element, this); break; case 5: eff = new EffectsManager(effects[i], element, this); break; default: eff = new NoValueEffect(effects[i], element, this); break } if (eff) { this.effectElements.push(eff) } } }; function BaseElement() {} BaseElement.prototype = { checkMasks: function checkMasks() { if (!this.data.hasMask) { return false } var i = 0; var len = this.data.masksProperties.length; while (i < len) { if (this.data.masksProperties[i].mode !== 'n' && this.data.masksProperties[i].cl !== false) { return true } i += 1 } return false }, initExpressions: function initExpressions() { this.layerInterface = LayerExpressionInterface(this); if (this.data.hasMask && this.maskManager) { this.layerInterface.registerMaskInterface(this.maskManager) } var effectsInterface = EffectsExpressionInterface.createEffectsInterface(this, this.layerInterface); this.layerInterface.registerEffectsInterface(effectsInterface); if (this.data.ty === 0 || this.data.xt) { this.compInterface = CompExpressionInterface(this) } else if (this.data.ty === 4) { this.layerInterface.shapeInterface = ShapeExpressionInterface(this.shapesData, this.itemsData, this.layerInterface); this.layerInterface.content = this.layerInterface.shapeInterface } else if (this.data.ty === 5) { this.layerInterface.textInterface = TextExpressionInterface(this); this.layerInterface.text = this.layerInterface.textInterface } }, setBlendMode: function setBlendMode() { var blendModeValue = getBlendMode(this.data.bm); var elem = this.baseElement || this.layerElement; elem.style['mix-blend-mode'] = blendModeValue }, initBaseData: function initBaseData(data, globalData, comp) { this.globalData = globalData; this.comp = comp; this.data = data; this.layerId = createElementID(); if (!this.data.sr) { this.data.sr = 1 } this.effectsManager = new EffectsManager(this.data, this, this.dynamicProperties) }, getType: function getType() { return this.type }, sourceRectAtTime: function sourceRectAtTime() {} }; function FrameElement() {} FrameElement.prototype = { initFrame: function initFrame() { this._isFirstFrame = false; this.dynamicProperties = []; this._mdf = false }, prepareProperties: function prepareProperties(num, isVisible) { var i; var len = this.dynamicProperties.length; for (i = 0; i < len; i += 1) { if (isVisible || this._isParent && this.dynamicProperties[i].propType === 'transform') { this.dynamicProperties[i].getValue(); if (this.dynamicProperties[i]._mdf) { this.globalData._mdf = true; this._mdf = true } } } }, addDynamicProperty: function addDynamicProperty(prop) { if (this.dynamicProperties.indexOf(prop) === -1) { this.dynamicProperties.push(prop) } } }; function _typeof2ドル(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof2ドル = function _typeof(obj) { return typeof obj } } else { _typeof2ドル = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj } } return _typeof2ドル(obj) } var FootageInterface = function () { var outlineInterfaceFactory = function outlineInterfaceFactory(elem) { var currentPropertyName = ''; var currentProperty = elem.getFootageData(); function init() { currentPropertyName = ''; currentProperty = elem.getFootageData(); return searchProperty } function searchProperty(value) { if (currentProperty[value]) { currentPropertyName = value; currentProperty = currentProperty[value]; if (_typeof2ドル(currentProperty) === 'object') { return searchProperty } return currentProperty } var propertyNameIndex = value.indexOf(currentPropertyName); if (propertyNameIndex !== -1) { var index = parseInt(value.substr(propertyNameIndex + currentPropertyName.length), 10); currentProperty = currentProperty[index]; if (_typeof2ドル(currentProperty) === 'object') { return searchProperty } return currentProperty } return '' } return init }; var dataInterfaceFactory = function dataInterfaceFactory(elem) { function interfaceFunction(value) { if (value === 'Outline') { return interfaceFunction.outlineInterface() } return null } interfaceFunction._name = 'Outline'; interfaceFunction.outlineInterface = outlineInterfaceFactory(elem); return interfaceFunction }; return function (elem) { function _interfaceFunction(value) { if (value === 'Data') { return _interfaceFunction.dataInterface } return null } _interfaceFunction._name = 'Data'; _interfaceFunction.dataInterface = dataInterfaceFactory(elem); return _interfaceFunction } }(); function FootageElement(data, globalData, comp) { this.initFrame(); this.initRenderable(); this.assetData = globalData.getAssetData(data.refId); this.footageData = globalData.imageLoader.getAsset(this.assetData); this.initBaseData(data, globalData, comp) } FootageElement.prototype.prepareFrame = function () {}; extendPrototype([RenderableElement, BaseElement, FrameElement], FootageElement); FootageElement.prototype.getBaseElement = function () { return null }; FootageElement.prototype.renderFrame = function () {}; FootageElement.prototype.destroy = function () {}; FootageElement.prototype.initExpressions = function () { this.layerInterface = FootageInterface(this) }; FootageElement.prototype.getFootageData = function () { return this.footageData }; function AudioElement(data, globalData, comp) { this.initFrame(); this.initRenderable(); this.assetData = globalData.getAssetData(data.refId); this.initBaseData(data, globalData, comp); this._isPlaying = false; this._canPlay = false; var assetPath = this.globalData.getAssetsPath(this.assetData); this.audio = this.globalData.audioController.createAudio(assetPath); this._currentTime = 0; this.globalData.audioController.addAudio(this); this._volumeMultiplier = 1; this._volume = 1; this._previousVolume = null; this.tm = data.tm ? PropertyFactory.getProp(this, data.tm, 0, globalData.frameRate, this) : { _placeholder: true }; this.lv = PropertyFactory.getProp(this, data.au && data.au.lv ? data.au.lv : { k: [100] }, 1, 0.01, this) } AudioElement.prototype.prepareFrame = function (num) { this.prepareRenderableFrame(num, true); this.prepareProperties(num, true); if (!this.tm._placeholder) { var timeRemapped = this.tm.v; this._currentTime = timeRemapped } else { this._currentTime = num / this.data.sr } this._volume = this.lv.v[0]; var totalVolume = this._volume * this._volumeMultiplier; if (this._previousVolume !== totalVolume) { this._previousVolume = totalVolume; this.audio.volume(totalVolume) } }; extendPrototype([RenderableElement, BaseElement, FrameElement], AudioElement); AudioElement.prototype.renderFrame = function () { if (this.isInRange && this._canPlay) { if (!this._isPlaying) { this.audio.play(); this.audio.seek(this._currentTime / this.globalData.frameRate); this._isPlaying = true } else if (!this.audio.playing() || Math.abs(this._currentTime / this.globalData.frameRate - this.audio.seek())> 0.1) {
this.audio.seek(this._currentTime / this.globalData.frameRate)
}
}
};
AudioElement.prototype.show = function () {};
AudioElement.prototype.hide = function () {
this.audio.pause();
this._isPlaying = false
};
AudioElement.prototype.pause = function () {
this.audio.pause();
this._isPlaying = false;
this._canPlay = false
};
AudioElement.prototype.resume = function () {
this._canPlay = true
};
AudioElement.prototype.setRate = function (rateValue) {
this.audio.rate(rateValue)
};
AudioElement.prototype.volume = function (volumeValue) {
this._volumeMultiplier = volumeValue;
this._previousVolume = volumeValue * this._volume;
this.audio.volume(this._previousVolume)
};
AudioElement.prototype.getBaseElement = function () {
return null
};
AudioElement.prototype.destroy = function () {};
AudioElement.prototype.sourceRectAtTime = function () {};
AudioElement.prototype.initExpressions = function () {};
function BaseRenderer() {}
BaseRenderer.prototype.checkLayers = function (num) {
var i;
var len = this.layers.length;
var data;
this.completeLayers = true;
for (i = len - 1; i>= 0; i -= 1) {
if (!this.elements[i]) {
data = this.layers[i];
if (data.ip - data.st <= num - this.layers[i].st && data.op - data.st> num - this.layers[i].st) {
this.buildItem(i)
}
}
this.completeLayers = this.elements[i] ? this.completeLayers : false
}
this.checkPendingElements()
};
BaseRenderer.prototype.createItem = function (layer) {
switch (layer.ty) {
case 2:
return this.createImage(layer);
case 0:
return this.createComp(layer);
case 1:
return this.createSolid(layer);
case 3:
return this.createNull(layer);
case 4:
return this.createShape(layer);
case 5:
return this.createText(layer);
case 6:
return this.createAudio(layer);
case 13:
return this.createCamera(layer);
case 15:
return this.createFootage(layer);
default:
return this.createNull(layer)
}
};
BaseRenderer.prototype.createCamera = function () {
throw new Error('You\'re using a 3d camera. Try the html renderer.');
};
BaseRenderer.prototype.createAudio = function (data) {
return new AudioElement(data, this.globalData, this)
};
BaseRenderer.prototype.createFootage = function (data) {
return new FootageElement(data, this.globalData, this)
};
BaseRenderer.prototype.buildAllItems = function () {
var i;
var len = this.layers.length;
for (i = 0; i < len; i += 1) { this.buildItem(i) } this.checkPendingElements() }; BaseRenderer.prototype.includeLayers = function (newLayers) { this.completeLayers = false; var i; var len = newLayers.length; var j; var jLen = this.layers.length; for (i = 0; i < len; i += 1) { j = 0; while (j < jLen) { if (this.layers[j].id === newLayers[i].id) { this.layers[j] = newLayers[i]; break } j += 1 } } }; BaseRenderer.prototype.setProjectInterface = function (pInterface) { this.globalData.projectInterface = pInterface }; BaseRenderer.prototype.initItems = function () { if (!this.globalData.progressiveLoad) { this.buildAllItems() } }; BaseRenderer.prototype.buildElementParenting = function (element, parentName, hierarchy) { var elements = this.elements; var layers = this.layers; var i = 0; var len = layers.length; while (i < len) { if (layers[i].ind == parentName) { if (!elements[i] || elements[i] === true) { this.buildItem(i); this.addPendingElement(element) } else { hierarchy.push(elements[i]); elements[i].setAsParent(); if (layers[i].parent !== undefined) { this.buildElementParenting(element, layers[i].parent, hierarchy) } else { element.setHierarchy(hierarchy) } } } i += 1 } }; BaseRenderer.prototype.addPendingElement = function (element) { this.pendingElements.push(element) }; BaseRenderer.prototype.searchExtraCompositions = function (assets) { var i; var len = assets.length; for (i = 0; i < len; i += 1) { if (assets[i].xt) { var comp = this.createComp(assets[i]); comp.initExpressions(); this.globalData.projectInterface.registerComposition(comp) } } }; BaseRenderer.prototype.getElementByPath = function (path) { var pathValue = path.shift(); var element; if (typeof pathValue === 'number') { element = this.elements[pathValue] } else { var i; var len = this.elements.length; for (i = 0; i < len; i += 1) { if (this.elements[i].data.nm === pathValue) { element = this.elements[i]; break } } } if (path.length === 0) { return element } return element.getElementByPath(path) }; BaseRenderer.prototype.setupGlobalData = function (animData, fontsContainer) { this.globalData.fontManager = new FontManager(); this.globalData.fontManager.addChars(animData.chars); this.globalData.fontManager.addFonts(animData.fonts, fontsContainer); this.globalData.getAssetData = this.animationItem.getAssetData.bind(this.animationItem); this.globalData.getAssetsPath = this.animationItem.getAssetsPath.bind(this.animationItem); this.globalData.imageLoader = this.animationItem.imagePreloader; this.globalData.audioController = this.animationItem.audioController; this.globalData.frameId = 0; this.globalData.frameRate = animData.fr; this.globalData.nm = animData.nm; this.globalData.compSize = { w: animData.w, h: animData.h } }; function TransformElement() {} TransformElement.prototype = { initTransform: function initTransform() { this.finalTransform = { mProp: this.data.ks ? TransformPropertyFactory.getTransformProperty(this, this.data.ks, this) : { o: 0 }, _matMdf: false, _opMdf: false, mat: new Matrix() }; if (this.data.ao) { this.finalTransform.mProp.autoOriented = true } if (this.data.ty !== 11) {} }, renderTransform: function renderTransform() { this.finalTransform._opMdf = this.finalTransform.mProp.o._mdf || this._isFirstFrame; this.finalTransform._matMdf = this.finalTransform.mProp._mdf || this._isFirstFrame; if (this.hierarchy) { var mat; var finalMat = this.finalTransform.mat; var i = 0; var len = this.hierarchy.length; if (!this.finalTransform._matMdf) { while (i < len) { if (this.hierarchy[i].finalTransform.mProp._mdf) { this.finalTransform._matMdf = true; break } i += 1 } } if (this.finalTransform._matMdf) { mat = this.finalTransform.mProp.v.props; finalMat.cloneFromProps(mat); for (i = 0; i < len; i += 1) { mat = this.hierarchy[i].finalTransform.mProp.v.props; finalMat.transform(mat[0], mat[1], mat[2], mat[3], mat[4], mat[5], mat[6], mat[7], mat[8], mat[9], mat[10], mat[11], mat[12], mat[13], mat[14], mat[15]) } } } }, globalToLocal: function globalToLocal(pt) { var transforms = []; transforms.push(this.finalTransform); var flag = true; var comp = this.comp; while (flag) { if (comp.finalTransform) { if (comp.data.hasMask) { transforms.splice(0, 0, comp.finalTransform) } comp = comp.comp } else { flag = false } } var i; var len = transforms.length; var ptNew; for (i = 0; i < len; i += 1) { ptNew = transforms[i].mat.applyToPointArray(0, 0, 0); pt = [pt[0] - ptNew[0], pt[1] - ptNew[1], 0] } return pt }, mHelper: new Matrix() }; function MaskElement(data, element, globalData) { this.data = data; this.element = element; this.globalData = globalData; this.storedData = []; this.masksProperties = this.data.masksProperties || []; this.maskElement = null; var defs = this.globalData.defs; var i; var len = this.masksProperties ? this.masksProperties.length : 0; this.viewData = createSizedArray(len); this.solidPath = ''; var path; var properties = this.masksProperties; var count = 0; var currentMasks = []; var j; var jLen; var layerId = createElementID(); var rect; var expansor; var feMorph; var x; var maskType = 'clipPath'; var maskRef = 'clip-path'; for (i = 0; i < len; i += 1) { if (properties[i].mode !== 'a' && properties[i].mode !== 'n' || properties[i].inv || properties[i].o.k !== 100 || properties[i].o.x) { maskType = 'mask'; maskRef = 'mask' } if ((properties[i].mode === 's' || properties[i].mode === 'i') && count === 0) { rect = createNS('rect'); rect.setAttribute('fill', '#ffffff'); rect.setAttribute('height', this.element.comp.data.h || 0); currentMasks.push(rect) } else { rect = null } path = createNS('path'); if (properties[i].mode === 'n') { this.viewData[i] = { op: PropertyFactory.getProp(this.element, properties[i].o, 0, 0.01, this.element), prop: ShapePropertyFactory.getShapeProp(this.element, properties[i], 3), elem: path, lastPath: '' }; defs.appendChild(path) } else { count += 1; path.setAttribute('fill', properties[i].mode === 's' ? '#000000' : '#ffffff'); path.setAttribute('clip-rule', 'nonzero'); var filterID; if (properties[i].x.k !== 0) { maskType = 'mask'; maskRef = 'mask'; x = PropertyFactory.getProp(this.element, properties[i].x, 0, null, this.element); filterID = createElementID(); expansor = createNS('filter'); expansor.setAttribute('id', filterID); feMorph = createNS('feMorphology'); feMorph.setAttribute('operator', 'erode'); feMorph.setAttribute('in', 'SourceGraphic'); feMorph.setAttribute('radius', '0'); expansor.appendChild(feMorph); defs.appendChild(expansor); path.setAttribute('stroke', properties[i].mode === 's' ? '#000000' : '#ffffff') } else { feMorph = null; x = null } this.storedData[i] = { elem: path, x: x, expan: feMorph, lastPath: '', lastOperator: '', filterId: filterID, lastRadius: 0 }; if (properties[i].mode === 'i') { jLen = currentMasks.length; var g = createNS('g'); for (j = 0; j < jLen; j += 1) { g.appendChild(currentMasks[j]) } var mask = createNS('mask'); mask.setAttribute('mask-type', 'alpha'); mask.setAttribute('id', layerId + '_' + count); mask.appendChild(path); defs.appendChild(mask); g.setAttribute('mask', 'url(' + getLocationHref() + '#' + layerId + '_' + count + ')'); currentMasks.length = 0; currentMasks.push(g) } else { currentMasks.push(path) } if (properties[i].inv && !this.solidPath) { this.solidPath = this.createLayerSolidPath() } this.viewData[i] = { elem: path, lastPath: '', op: PropertyFactory.getProp(this.element, properties[i].o, 0, 0.01, this.element), prop: ShapePropertyFactory.getShapeProp(this.element, properties[i], 3), invRect: rect }; if (!this.viewData[i].prop.k) { this.drawPath(properties[i], this.viewData[i].prop.v, this.viewData[i]) } } } this.maskElement = createNS(maskType); len = currentMasks.length; for (i = 0; i < len; i += 1) { this.maskElement.appendChild(currentMasks[i]) } if (count> 0) {
this.maskElement.setAttribute('id', layerId);
this.element.maskedElement.setAttribute(maskRef, 'url(' + getLocationHref() + '#' + layerId + ')');
defs.appendChild(this.maskElement)
}
if (this.viewData.length) {
this.element.addRenderableComponent(this)
}
}
MaskElement.prototype.getMaskProperty = function (pos) {
return this.viewData[pos].prop
};
MaskElement.prototype.renderFrame = function (isFirstFrame) {
var finalMat = this.element.finalTransform.mat;
var i;
var len = this.masksProperties.length;
for (i = 0; i < len; i += 1) { if (this.viewData[i].prop._mdf || isFirstFrame) { this.drawPath(this.masksProperties[i], this.viewData[i].prop.v, this.viewData[i]) } if (this.viewData[i].op._mdf || isFirstFrame) { this.viewData[i].elem.setAttribute('fill-opacity', this.viewData[i].op.v) } if (this.masksProperties[i].mode !== 'n') { if (this.viewData[i].invRect && (this.element.finalTransform.mProp._mdf || isFirstFrame)) { this.viewData[i].invRect.setAttribute('transform', finalMat.getInverseMatrix().to2dCSS()) } if (this.storedData[i].x && (this.storedData[i].x._mdf || isFirstFrame)) { var feMorph = this.storedData[i].expan; if (this.storedData[i].x.v < 0) { if (this.storedData[i].lastOperator !== 'erode') { this.storedData[i].lastOperator = 'erode'; this.storedData[i].elem.setAttribute('filter', 'url(' + getLocationHref() + '#' + this.storedData[i].filterId + ')') } feMorph.setAttribute('radius', -this.storedData[i].x.v) } else { if (this.storedData[i].lastOperator !== 'dilate') { this.storedData[i].lastOperator = 'dilate'; this.storedData[i].elem.setAttribute('filter', null) } this.storedData[i].elem.setAttribute('stroke-M0,0 '; path += ' h' + this.globalData.compSize.w; path += ' v' + this.globalData.compSize.h; path += ' h-' + this.globalData.compSize.w; path += ' v-' + this.globalData.compSize.h + ' '; return path }; MaskElement.prototype.drawPath = function (pathData, pathNodes, viewData) { var pathString = ' M' + pathNodes.v[0][0] + ',' + pathNodes.v[0][1]; var i; var len; len = pathNodes._length; 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] } 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]
}
if (viewData.lastPath !== pathString) {
var pathShapeValue = '';
if (viewData.elem) {
if (pathNodes.c) {
pathShapeValue = pathData.inv ? this.solidPath + pathString : pathString
}
viewData.elem.setAttribute('d', pathShapeValue)
}
viewData.lastPath = pathString
}
};
MaskElement.prototype.destroy = function () {
this.element = null;
this.globalData = null;
this.maskElement = null;
this.data = null;
this.masksProperties = null
};
var filtersFactory = function () {
var ob = {};
ob.createFilter = createFilter;
ob.createAlphaToLuminanceFilter = createAlphaToLuminanceFilter;
function createFilter(filId, skipCoordinates) {
var fil = createNS('filter');
fil.setAttribute('id', filId);
if (skipCoordinates !== true) {
fil.setAttribute('filterUnits', 'objectBoundingBox');
fil.setAttribute('x', '0%');
fil.setAttribute('y', '0%');
fil.setAttribute('width', '100%');
fil.setAttribute('height', '100%')
}
return fil
}
function createAlphaToLuminanceFilter() {
var feColorMatrix = createNS('feColorMatrix');
feColorMatrix.setAttribute('type', 'matrix');
feColorMatrix.setAttribute('color-interpolation-filters', 'sRGB');
feColorMatrix.setAttribute('values', '0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 1');
return feColorMatrix
}
return ob
}();
var featureSupport = function () {
var ob = {
maskType: true
};
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
}
return ob
}();
var registeredEffects = {};
var idPrefix = 'filter_result_';
function SVGEffects(elem) {
var i;
var source = 'SourceGraphic';
var len = elem.data.ef ? elem.data.ef.length : 0;
var filId = createElementID();
var fil = filtersFactory.createFilter(filId, true);
var count = 0;
this.filters = [];
var filterManager;
for (i = 0; i < len; i += 1) { filterManager = null; var type = elem.data.ef[i].ty; if (registeredEffects[type]) { var Effect = registeredEffects[type].effect; filterManager = new Effect(fil, elem.effectsManager.effectElements[i], elem, idPrefix + count, source); source = idPrefix + count; if (registeredEffects[type].countsAsEffect) { count += 1 } } if (filterManager) { this.filters.push(filterManager) } } if (count) { elem.globalData.defs.appendChild(fil); elem.layerElement.setAttribute('filter', 'url(' + getLocationHref() + '#' + filId + ')') } if (this.filters.length) { elem.addRenderableComponent(this) } } SVGEffects.prototype.renderFrame = function (_isFirstFrame) { var i; var len = this.filters.length; for (i = 0; i < len; i += 1) { this.filters[i].renderFrame(_isFirstFrame) } }; function registerEffect(id, effect, countsAsEffect) { registeredEffects[id] = { effect: effect, countsAsEffect: countsAsEffect } } function SVGBaseElement() {} SVGBaseElement.prototype = { initRendererElement: function initRendererElement() { this.layerElement = createNS('g') }, createContainerElements: function createContainerElements() { this.matteElement = createNS('g'); this.transformedElement = this.layerElement; this.maskedElement = this.layerElement; this._sizeChanged = false; var layerElementParent = null; var filId; var fil; var gg; if (this.data.td) { if (this.data.td == 3 || this.data.td == 1) { var masker = createNS('mask'); masker.setAttribute('id', this.layerId); masker.setAttribute('mask-type', this.data.td == 3 ? 'luminance' : 'alpha'); masker.appendChild(this.layerElement); layerElementParent = masker; this.globalData.defs.appendChild(masker); if (!featureSupport.maskType && this.data.td == 1) { masker.setAttribute('mask-type', 'luminance'); filId = createElementID(); fil = filtersFactory.createFilter(filId); this.globalData.defs.appendChild(fil); fil.appendChild(filtersFactory.createAlphaToLuminanceFilter()); gg = createNS('g'); gg.appendChild(this.layerElement); layerElementParent = gg; masker.appendChild(gg); gg.setAttribute('filter', 'url(' + getLocationHref() + '#' + filId + ')') } } else if (this.data.td == 2) { var maskGroup = createNS('mask'); maskGroup.setAttribute('id', this.layerId); maskGroup.setAttribute('mask-type', 'alpha'); var maskGrouper = createNS('g'); maskGroup.appendChild(maskGrouper); filId = createElementID(); fil = filtersFactory.createFilter(filId); var feCTr = createNS('feComponentTransfer'); feCTr.setAttribute('in', 'SourceGraphic'); fil.appendChild(feCTr); var feFunc = createNS('feFuncA'); feFunc.setAttribute('type', 'table'); feFunc.setAttribute('tableValues', '1.0 0.0'); feCTr.appendChild(feFunc); this.globalData.defs.appendChild(fil); var alphaRect = createNS('rect'); alphaRect.setAttribute('height', this.comp.data.h); alphaRect.setAttribute('x', '0'); alphaRect.setAttribute('y', '0'); alphaRect.setAttribute('fill', '#ffffff'); alphaRect.setAttribute('opacity', '0'); maskGrouper.setAttribute('filter', 'url(' + getLocationHref() + '#' + filId + ')'); maskGrouper.appendChild(alphaRect); maskGrouper.appendChild(this.layerElement); layerElementParent = maskGrouper; if (!featureSupport.maskType) { maskGroup.setAttribute('mask-type', 'luminance'); fil.appendChild(filtersFactory.createAlphaToLuminanceFilter()); gg = createNS('g'); maskGrouper.appendChild(alphaRect); gg.appendChild(this.layerElement); layerElementParent = gg; maskGrouper.appendChild(gg) } this.globalData.defs.appendChild(maskGroup) } } else if (this.data.tt) { this.matteElement.appendChild(this.layerElement); layerElementParent = this.matteElement; this.baseElement = this.matteElement } else { this.baseElement = this.layerElement } if (this.data.ln) { this.layerElement.setAttribute('id', this.data.ln) } if (this.data.cl) { this.layerElement.setAttribute('class', this.data.cl) } if (this.data.ty === 0 && !this.data.hd) { var cp = createNS('clipPath'); var pt = createNS('path'); pt.setAttribute('d', 'M0,0 L' + this.data.w + ',0 L' + this.data.w + ',' + this.data.h + ' L0,' + this.data.h + 'z'); var clipId = createElementID(); cp.setAttribute('id', clipId); cp.appendChild(pt); this.globalData.defs.appendChild(cp); if (this.checkMasks()) { var cpGroup = createNS('g'); cpGroup.setAttribute('clip-path', 'url(' + getLocationHref() + '#' + clipId + ')'); cpGroup.appendChild(this.layerElement); this.transformedElement = cpGroup; if (layerElementParent) { layerElementParent.appendChild(this.transformedElement) } else { this.baseElement = this.transformedElement } } else { this.layerElement.setAttribute('clip-path', 'url(' + getLocationHref() + '#' + clipId + ')') } } if (this.data.bm !== 0) { this.setBlendMode() } }, renderElement: function renderElement() { if (this.finalTransform._matMdf) { this.transformedElement.setAttribute('transform', this.finalTransform.mat.to2dCSS()) } if (this.finalTransform._opMdf) { this.transformedElement.setAttribute('opacity', this.finalTransform.mProp.o.v) } }, destroyBaseElement: function destroyBaseElement() { this.layerElement = null; this.matteElement = null; this.maskManager.destroy() }, getBaseElement: function getBaseElement() { if (this.data.hd) { return null } return this.baseElement }, createRenderableComponents: function createRenderableComponents() { this.maskManager = new MaskElement(this.data, this, this.globalData); this.renderableEffectsManager = new SVGEffects(this) }, setMatte: function setMatte(id) { if (!this.matteElement) { return } this.matteElement.setAttribute('mask', 'url(' + getLocationHref() + '#' + id + ')') } }; function HierarchyElement() {} HierarchyElement.prototype = { initHierarchy: function initHierarchy() { this.hierarchy = []; this._isParent = false; this.checkParenting() }, setHierarchy: function setHierarchy(hierarchy) { this.hierarchy = hierarchy }, setAsParent: function setAsParent() { this._isParent = true }, checkParenting: function checkParenting() { if (this.data.parent !== undefined) { this.comp.buildElementParenting(this, this.data.parent, []) } } }; function RenderableDOMElement() {}(function () { var _prototype = { initElement: function initElement(data, globalData, comp) { this.initFrame(); this.initBaseData(data, globalData, comp); this.initTransform(data, globalData, comp); this.initHierarchy(); this.initRenderable(); this.initRendererElement(); this.createContainerElements(); this.createRenderableComponents(); this.createContent(); this.hide() }, hide: function hide() { if (!this.hidden && (!this.isInRange || this.isTransparent)) { var elem = this.baseElement || this.layerElement; elem.style.display = 'none'; this.hidden = true } }, show: function show() { if (this.isInRange && !this.isTransparent) { if (!this.data.hd) { var elem = this.baseElement || this.layerElement; elem.style.display = 'block' } this.hidden = false; this._isFirstFrame = true } }, renderFrame: function renderFrame() { if (this.data.hd || this.hidden) { return } this.renderTransform(); this.renderRenderable(); this.renderElement(); this.renderInnerContent(); if (this._isFirstFrame) { this._isFirstFrame = false } }, renderInnerContent: function renderInnerContent() {}, prepareFrame: function prepareFrame(num) { this._mdf = false; this.prepareRenderableFrame(num); this.prepareProperties(num, this.isInRange); this.checkTransparency() }, destroy: function destroy() { this.innerElem = null; this.destroyBaseElement() } }; extendPrototype([RenderableElement, createProxyFunction(_prototype)], RenderableDOMElement) })(); function IImageElement(data, globalData, comp) { this.assetData = globalData.getAssetData(data.refId); this.initElement(data, globalData, comp); this.sourceRect = { top: 0, left: 0, width: this.assetData.w, height: this.assetData.h } } extendPrototype([BaseElement, TransformElement, SVGBaseElement, HierarchyElement, FrameElement, RenderableDOMElement], IImageElement); IImageElement.prototype.createContent = function () { var assetPath = this.globalData.getAssetsPath(this.assetData); this.innerElem = createNS('image'); this.innerElem.setAttribute('width', this.assetData.w + 'px'); this.innerElem.setAttribute('height', this.assetData.h + 'px'); this.innerElem.setAttribute('preserveAspectRatio', this.assetData.pr || this.globalData.renderConfig.imagePreserveAspectRatio); this.innerElem.setAttributeNS('http://www.w3.org/1999/xlink', 'href', assetPath); this.layerElement.appendChild(this.innerElem) }; IImageElement.prototype.sourceRectAtTime = function () { return this.sourceRect }; function ProcessedElement(element, position) { this.elem = element; this.pos = position } function IShapeElement() {} IShapeElement.prototype = { addShapeToModifiers: function addShapeToModifiers(data) { var i; var len = this.shapeModifiers.length; for (i = 0; i < len; i += 1) { this.shapeModifiers[i].addShape(data) } }, isShapeInAnimatedModifiers: function isShapeInAnimatedModifiers(data) { var i = 0; var len = this.shapeModifiers.length; while (i < len) { if (this.shapeModifiers[i].isAnimatedWithShape(data)) { return true } } return false }, renderModifiers: function renderModifiers() { if (!this.shapeModifiers.length) { return } var i; var len = this.shapes.length; for (i = 0; i < len; i += 1) { this.shapes[i].sh.reset() } len = this.shapeModifiers.length; var shouldBreakProcess; for (i = len - 1; i>= 0; i -= 1) {
shouldBreakProcess = this.shapeModifiers[i].processShapes(this._isFirstFrame);
if (shouldBreakProcess) {
break
}
}
},
searchProcessedElement: function searchProcessedElement(elem) {
var elements = this.processedElements;
var i = 0;
var len = elements.length;
while (i < len) { if (elements[i].elem === elem) { return elements[i].pos } i += 1 } return 0 }, addProcessedElement: function addProcessedElement(elem, pos) { var elements = this.processedElements; var i = elements.length; while (i) { i -= 1; if (elements[i].elem === elem) { elements[i].pos = pos; return } } elements.push(new ProcessedElement(elem, pos)) }, prepareFrame: function prepareFrame(num) { this.prepareRenderableFrame(num); this.prepareProperties(num, this.isInRange) } }; var lineCapEnum = { 1: 'butt', 2: 'round', 3: 'square' }; var lineJoinEnum = { 1: 'miter', 2: 'round', 3: 'bevel' }; function SVGShapeData(transformers, level, shape) { this.caches = []; this.styles = []; this.transformers = transformers; this.lStr = ''; this.sh = shape; this.lvl = level; this._isAnimated = !!shape.k; var i = 0; var len = transformers.length; while (i < len) { if (transformers[i].mProps.dynamicProperties.length) { this._isAnimated = true; break } i += 1 } } SVGShapeData.prototype.setAsAnimated = function () { this._isAnimated = true }; function SVGStyleData(data, level) { this.data = data; this.type = data.ty; this.d = ''; this.lvl = level; this._mdf = false; this.closed = data.hd === true; this.pElem = createNS('path'); this.msElem = null } SVGStyleData.prototype.reset = function () { this.d = ''; this._mdf = false }; function DashProperty(elem, data, renderer, container) { this.elem = elem; this.frameId = -1; this.dataProps = createSizedArray(data.length); this.renderer = renderer; this.k = false; this.dashStr = ''; this.dashArray = createTypedArray('float32', data.length ? data.length - 1 : 0); this.dashoffset = createTypedArray('float32', 1); this.initDynamicPropertyContainer(container); var i; var len = data.length || 0; var prop; for (i = 0; i < len; i += 1) { prop = PropertyFactory.getProp(elem, data[i].v, 0, 0, this); this.k = prop.k || this.k; this.dataProps[i] = { n: data[i].n, p: prop } } if (!this.k) { this.getValue(true) } this._isAnimated = this.k } DashProperty.prototype.getValue = function (forceRender) { if (this.elem.globalData.frameId === this.frameId && !forceRender) { return } this.frameId = this.elem.globalData.frameId; this.iterateDynamicProperties(); this._mdf = this._mdf || forceRender; if (this._mdf) { var i = 0; var len = this.dataProps.length; if (this.renderer === 'svg') { this.dashStr = '' } for (i = 0; i < len; i += 1) { if (this.dataProps[i].n !== 'o') { if (this.renderer === 'svg') { this.dashStr += ' ' + this.dataProps[i].p.v } else { this.dashArray[i] = this.dataProps[i].p.v } } else { this.dashoffset[0] = this.dataProps[i].p.v } } } }; extendPrototype([DynamicPropertyContainer], DashProperty); function SVGStrokeStyleData(elem, data, styleOb) { this.initDynamicPropertyContainer(elem); this.getValue = this.iterateDynamicProperties; this.o = PropertyFactory.getProp(elem, data.o, 0, 0.01, this); this.w = PropertyFactory.getProp(elem, data.w, 0, null, this); this.d = new DashProperty(elem, data.d || {}, 'svg', this); this.c = PropertyFactory.getProp(elem, data.c, 1, 255, this); this.style = styleOb; this._isAnimated = !!this._isAnimated } extendPrototype([DynamicPropertyContainer], SVGStrokeStyleData); function SVGFillStyleData(elem, data, styleOb) { this.initDynamicPropertyContainer(elem); this.getValue = this.iterateDynamicProperties; this.o = PropertyFactory.getProp(elem, data.o, 0, 0.01, this); this.c = PropertyFactory.getProp(elem, data.c, 1, 255, this); this.style = styleOb } extendPrototype([DynamicPropertyContainer], SVGFillStyleData); function SVGNoStyleData(elem, data, styleOb) { this.initDynamicPropertyContainer(elem); this.getValue = this.iterateDynamicProperties; this.style = styleOb } extendPrototype([DynamicPropertyContainer], SVGNoStyleData); function GradientProperty(elem, data, container) { this.data = data; this.c = createTypedArray('uint8c', data.p * 4); var cLength = data.k.k[0].s ? data.k.k[0].s.length - data.p * 4 : data.k.k.length - data.p * 4; this.o = createTypedArray('float32', cLength); this._cmdf = false; this._omdf = false; this._collapsable = this.checkCollapsable(); this._hasOpacity = cLength; this.initDynamicPropertyContainer(container); this.prop = PropertyFactory.getProp(elem, data.k, 1, null, this); this.k = this.prop.k; this.getValue(true) } GradientProperty.prototype.comparePoints = function (values, points) { var i = 0; var len = this.o.length / 2; var diff; while (i < len) { diff = Math.abs(values[i * 4] - values[points * 4 + i * 2]); if (diff> 0.01) {
return false
}
i += 1
}
return true
};
GradientProperty.prototype.checkCollapsable = function () {
if (this.o.length / 2 !== this.c.length / 4) {
return false
}
if (this.data.k.k[0].s) {
var i = 0;
var len = this.data.k.k.length;
while (i < len) { if (!this.comparePoints(this.data.k.k[i].s, this.data.p)) { return false } i += 1 } } else if (!this.comparePoints(this.data.k.k, this.data.p)) { return false } return true }; GradientProperty.prototype.getValue = function (forceRender) { this.prop.getValue(); this._mdf = false; this._cmdf = false; this._omdf = false; if (this.prop._mdf || forceRender) { var i; var len = this.data.p * 4; var mult; var val; for (i = 0; i < len; i += 1) { mult = i % 4 === 0 ? 100 : 255; val = Math.round(this.prop.v[i] * mult); if (this.c[i] !== val) { this.c[i] = val; this._cmdf = !forceRender } } if (this.o.length) { len = this.prop.v.length; for (i = this.data.p * 4; i < len; i += 1) { mult = i % 2 === 0 ? 100 : 1; val = i % 2 === 0 ? Math.round(this.prop.v[i] * 100) : this.prop.v[i]; if (this.o[i - this.data.p * 4] !== val) { this.o[i - this.data.p * 4] = val; this._omdf = !forceRender } } } this._mdf = !forceRender } }; extendPrototype([DynamicPropertyContainer], GradientProperty); function SVGGradientFillStyleData(elem, data, styleOb) { this.initDynamicPropertyContainer(elem); this.getValue = this.iterateDynamicProperties; this.initGradientData(elem, data, styleOb) } SVGGradientFillStyleData.prototype.initGradientData = function (elem, data, styleOb) { this.o = PropertyFactory.getProp(elem, data.o, 0, 0.01, this); this.s = PropertyFactory.getProp(elem, data.s, 1, null, this); this.e = PropertyFactory.getProp(elem, data.e, 1, null, this); this.h = PropertyFactory.getProp(elem, data.h || { k: 0 }, 0, 0.01, this); this.a = PropertyFactory.getProp(elem, data.a || { k: 0 }, 0, degToRads, this); this.g = new GradientProperty(elem, data.g, this); this.style = styleOb; this.stops = []; this.setGradientData(styleOb.pElem, data); this.setGradientOpacity(data, styleOb); this._isAnimated = !!this._isAnimated }; SVGGradientFillStyleData.prototype.setGradientData = function (pathElement, data) { var gradientId = createElementID(); var gfill = createNS(data.t === 1 ? 'linearGradient' : 'radialGradient'); gfill.setAttribute('id', gradientId); gfill.setAttribute('spreadMethod', 'pad'); gfill.setAttribute('gradientUnits', 'userSpaceOnUse'); var stops = []; var stop; var j; var jLen; jLen = data.g.p * 4; for (j = 0; j < jLen; j += 4) { stop = createNS('stop'); gfill.appendChild(stop); stops.push(stop) } pathElement.setAttribute(data.ty === 'gf' ? 'fill' : 'stroke', 'url(' + getLocationHref() + '#' + gradientId + ')'); this.gf = gfill; this.cst = stops }; SVGGradientFillStyleData.prototype.setGradientOpacity = function (data, styleOb) { if (this.g._hasOpacity && !this.g._collapsable) { var stop; var j; var jLen; var mask = createNS('mask'); var maskElement = createNS('path'); mask.appendChild(maskElement); var opacityId = createElementID(); var maskId = createElementID(); mask.setAttribute('id', maskId); var opFill = createNS(data.t === 1 ? 'linearGradient' : 'radialGradient'); opFill.setAttribute('id', opacityId); opFill.setAttribute('spreadMethod', 'pad'); opFill.setAttribute('gradientUnits', 'userSpaceOnUse'); jLen = data.g.k.k[0].s ? data.g.k.k[0].s.length : data.g.k.k.length; var stops = this.stops; for (j = data.g.p * 4; j < jLen; j += 2) { stop = createNS('stop'); stop.setAttribute('stop-color', 'rgb(255,255,255)'); opFill.appendChild(stop); stops.push(stop) } maskElement.setAttribute(data.ty === 'gf' ? 'fill' : 'stroke', 'url(' + getLocationHref() + '#' + opacityId + ')'); if (data.ty === 'gs') { maskElement.setAttribute('stroke-linecap', lineCapEnum[data.lc || 2]); maskElement.setAttribute('stroke-linejoin', lineJoinEnum[data.lj || 2]); if (data.lj === 1) { maskElement.setAttribute('stroke-miterlimit', data.ml) } } this.of = opFill; this.ms = mask; this.ost = stops; this.maskId = maskId; styleOb.msElem = maskElement } }; extendPrototype([DynamicPropertyContainer], SVGGradientFillStyleData); function SVGGradientStrokeStyleData(elem, data, styleOb) { this.initDynamicPropertyContainer(elem); this.getValue = this.iterateDynamicProperties; this.w = PropertyFactory.getProp(elem, data.w, 0, null, this); this.d = new DashProperty(elem, data.d || {}, 'svg', this); this.initGradientData(elem, data, styleOb); this._isAnimated = !!this._isAnimated } extendPrototype([SVGGradientFillStyleData, DynamicPropertyContainer], SVGGradientStrokeStyleData); function ShapeGroupData() { this.it = []; this.prevViewData = []; this.gr = createNS('g') } function SVGTransformData(mProps, op, container) { this.transform = { mProps: mProps, op: op, container: container }; this.elements = []; this._isAnimated = this.transform.mProps.dynamicProperties.length || this.transform.op.effectsSequence.length } var buildShapeString = function buildShapeString(pathNodes, length, closed, mat) { if (length === 0) { return '' } var _o = pathNodes.o; var _i = pathNodes.i; var _v = pathNodes.v; var i; var shapeString = ' M' + mat.applyToPointStringified(_v[0][0], _v[0][1]); for (i = 1; i < length; i += 1) { shapeString += ' C' + mat.applyToPointStringified(_o[i - 1][0], _o[i - 1][1]) + ' ' + mat.applyToPointStringified(_i[i][0], _i[i][1]) + ' ' + mat.applyToPointStringified(_v[i][0], _v[i][1]) } if (closed && length) { shapeString += ' C' + mat.applyToPointStringified(_o[i - 1][0], _o[i - 1][1]) + ' ' + mat.applyToPointStringified(_i[0][0], _i[0][1]) + ' ' + mat.applyToPointStringified(_v[0][0], _v[0][1]); shapeString += 'z' } return shapeString }; var SVGElementsRenderer = function () { var _identityMatrix = new Matrix(); var _matrixHelper = new Matrix(); var ob = { createRenderFunction: createRenderFunction }; function createRenderFunction(data) { switch (data.ty) { case 'fl': return renderFill; case 'gf': return renderGradient; case 'gs': return renderGradientStroke; case 'st': return renderStroke; case 'sh': case 'el': case 'rc': case 'sr': return renderPath; case 'tr': return renderContentTransform; case 'no': return renderNoop; default: return null } } function renderContentTransform(styleData, itemData, isFirstFrame) { if (isFirstFrame || itemData.transform.op._mdf) { itemData.transform.container.setAttribute('opacity', itemData.transform.op.v) } if (isFirstFrame || itemData.transform.mProps._mdf) { itemData.transform.container.setAttribute('transform', itemData.transform.mProps.v.to2dCSS()) } } function renderNoop() {} function renderPath(styleData, itemData, isFirstFrame) { var j; var jLen; var pathStringTransformed; var redraw; var pathNodes; var l; var lLen = itemData.styles.length; var lvl = itemData.lvl; var paths; var mat; var props; var iterations; var k; for (l = 0; l < lLen; l += 1) { redraw = itemData.sh._mdf || isFirstFrame; if (itemData.styles[l].lvl < lvl) { mat = _matrixHelper.reset(); iterations = lvl - itemData.styles[l].lvl; k = itemData.transformers.length - 1; while (!redraw && iterations> 0) {
redraw = itemData.transformers[k].mProps._mdf || redraw;
iterations -= 1;
k -= 1
}
if (redraw) {
iterations = lvl - itemData.styles[l].lvl;
k = itemData.transformers.length - 1;
while (iterations> 0) {
props = itemData.transformers[k].mProps.v.props;
mat.transform(props[0], props[1], props[2], props[3], props[4], props[5], props[6], props[7], props[8], props[9], props[10], props[11], props[12], props[13], props[14], props[15]);
iterations -= 1;
k -= 1
}
}
} else {
mat = _identityMatrix
}
paths = itemData.sh.paths;
jLen = paths._length;
if (redraw) {
pathStringTransformed = '';
for (j = 0; j < jLen; j += 1) { pathNodes = paths.shapes[j]; if (pathNodes && pathNodes._length) { pathStringTransformed += buildShapeString(pathNodes, pathNodes._length, pathNodes.c, mat) } } itemData.caches[l] = pathStringTransformed } else { pathStringTransformed = itemData.caches[l] } itemData.styles[l].d += styleData.hd === true ? '' : pathStringTransformed; itemData.styles[l]._mdf = redraw || itemData.styles[l]._mdf } } function renderFill(styleData, itemData, isFirstFrame) { var styleElem = itemData.style; if (itemData.c._mdf || isFirstFrame) { styleElem.pElem.setAttribute('fill', 'rgb(' + bmFloor(itemData.c.v[0]) + ',' + bmFloor(itemData.c.v[1]) + ',' + bmFloor(itemData.c.v[2]) + ')') } if (itemData.o._mdf || isFirstFrame) { styleElem.pElem.setAttribute('fill-opacity', itemData.o.v) } } function renderGradientStroke(styleData, itemData, isFirstFrame) { renderGradient(styleData, itemData, isFirstFrame); renderStroke(styleData, itemData, isFirstFrame) } function renderGradient(styleData, itemData, isFirstFrame) { var gfill = itemData.gf; var hasOpacity = itemData.g._hasOpacity; var pt1 = itemData.s.v; var pt2 = itemData.e.v; if (itemData.o._mdf || isFirstFrame) { var attr = styleData.ty === 'gf' ? 'fill-opacity' : 'stroke-opacity'; itemData.style.pElem.setAttribute(attr, itemData.o.v) } if (itemData.s._mdf || isFirstFrame) { var attr1 = styleData.t === 1 ? 'x1' : 'cx'; var attr2 = attr1 === 'x1' ? 'y1' : 'cy'; gfill.setAttribute(attr1, pt1[0]); gfill.setAttribute(attr2, pt1[1]); if (hasOpacity && !itemData.g._collapsable) { itemData.of.setAttribute(attr1, pt1[0]); itemData.of.setAttribute(attr2, pt1[1]) } } var stops; var i; var len; var stop; if (itemData.g._cmdf || isFirstFrame) { stops = itemData.cst; var cValues = itemData.g.c; len = stops.length; for (i = 0; i < len; i += 1) { stop = stops[i]; stop.setAttribute('offset', cValues[i * 4] + '%'); stop.setAttribute('stop-color', 'rgb(' + cValues[i * 4 + 1] + ',' + cValues[i * 4 + 2] + ',' + cValues[i * 4 + 3] + ')') } } if (hasOpacity && (itemData.g._omdf || isFirstFrame)) { var oValues = itemData.g.o; if (itemData.g._collapsable) { stops = itemData.cst } else { stops = itemData.ost } len = stops.length; for (i = 0; i < len; i += 1) { stop = stops[i]; if (!itemData.g._collapsable) { stop.setAttribute('offset', oValues[i * 2] + '%') } stop.setAttribute('stop-opacity', oValues[i * 2 + 1]) } } if (styleData.t === 1) { if (itemData.e._mdf || isFirstFrame) { gfill.setAttribute('x2', pt2[0]); gfill.setAttribute('y2', pt2[1]); if (hasOpacity && !itemData.g._collapsable) { itemData.of.setAttribute('x2', pt2[0]); itemData.of.setAttribute('y2', pt2[1]) } } } else { var rad; if (itemData.s._mdf || itemData.e._mdf || isFirstFrame) { rad = Math.sqrt(Math.pow(pt1[0] - pt2[0], 2) + Math.pow(pt1[1] - pt2[1], 2)); gfill.setAttribute('r', rad); if (hasOpacity && !itemData.g._collapsable) { itemData.of.setAttribute('r', rad) } } if (itemData.e._mdf || itemData.h._mdf || itemData.a._mdf || isFirstFrame) { if (!rad) { rad = Math.sqrt(Math.pow(pt1[0] - pt2[0], 2) + Math.pow(pt1[1] - pt2[1], 2)) } var ang = Math.atan2(pt2[1] - pt1[1], pt2[0] - pt1[0]); var percent = itemData.h.v; if (percent>= 1) {
percent = 0.99
} else if (percent <= -1) { percent = -0.99 } var dist = rad * percent; var x = Math.cos(ang + itemData.a.v) * dist + pt1[0]; var y = Math.sin(ang + itemData.a.v) * dist + pt1[1]; gfill.setAttribute('fx', x); gfill.setAttribute('fy', y); if (hasOpacity && !itemData.g._collapsable) { itemData.of.setAttribute('fx', x); itemData.of.setAttribute('fy', y) } } } } function renderStroke(styleData, itemData, isFirstFrame) { var styleElem = itemData.style; var d = itemData.d; if (d && (d._mdf || isFirstFrame) && d.dashStr) { styleElem.pElem.setAttribute('stroke-dasharray', d.dashStr); styleElem.pElem.setAttribute('stroke-dashoffset', d.dashoffset[0]) } if (itemData.c && (itemData.c._mdf || isFirstFrame)) { styleElem.pElem.setAttribute('stroke', 'rgb(' + bmFloor(itemData.c.v[0]) + ',' + bmFloor(itemData.c.v[1]) + ',' + bmFloor(itemData.c.v[2]) + ')') } if (itemData.o._mdf || isFirstFrame) { styleElem.pElem.setAttribute('stroke-opacity', itemData.o.v) } if (itemData.w._mdf || isFirstFrame) { styleElem.pElem.setAttribute('stroke-stroke-width', itemData.w.v) } } } return ob }(); function SVGShapeElement(data, globalData, comp) { this.shapes = []; this.shapesData = data.shapes; this.stylesList = []; this.shapeModifiers = []; this.itemsData = []; this.processedElements = []; this.animatedContents = []; this.initElement(data, globalData, comp); this.prevViewData = [] } extendPrototype([BaseElement, TransformElement, SVGBaseElement, IShapeElement, HierarchyElement, FrameElement, RenderableDOMElement], SVGShapeElement); SVGShapeElement.prototype.initSecondaryElement = function () {}; SVGShapeElement.prototype.identityMatrix = new Matrix(); SVGShapeElement.prototype.buildExpressionInterface = function () {}; SVGShapeElement.prototype.createContent = function () { this.searchShapes(this.shapesData, this.itemsData, this.prevViewData, this.layerElement, 0, [], true); this.filterUniqueShapes() }; SVGShapeElement.prototype.filterUniqueShapes = function () { var i; var len = this.shapes.length; var shape; var j; var jLen = this.stylesList.length; var style; var tempShapes = []; var areAnimated = false; for (j = 0; j < jLen; j += 1) { style = this.stylesList[j]; areAnimated = false; tempShapes.length = 0; for (i = 0; i < len; i += 1) { shape = this.shapes[i]; if (shape.styles.indexOf(style) !== -1) { tempShapes.push(shape); areAnimated = shape._isAnimated || areAnimated } } if (tempShapes.length> 1 && areAnimated) {
this.setShapesAsAnimated(tempShapes)
}
}
};
SVGShapeElement.prototype.setShapesAsAnimated = function (shapes) {
var i;
var len = shapes.length;
for (i = 0; i < len; i += 1) { shapes[i].setAsAnimated() } }; SVGShapeElement.prototype.createStyleElement = function (data, level) { var elementData; var styleOb = new SVGStyleData(data, level); var pathElement = styleOb.pElem; if (data.ty === 'st') { elementData = new SVGStrokeStyleData(this, data, styleOb) } else if (data.ty === 'fl') { elementData = new SVGFillStyleData(this, data, styleOb) } else if (data.ty === 'gf' || data.ty === 'gs') { var GradientConstructor = data.ty === 'gf' ? SVGGradientFillStyleData : SVGGradientStrokeStyleData; elementData = new GradientConstructor(this, data, styleOb); this.globalData.defs.appendChild(elementData.gf); if (elementData.maskId) { this.globalData.defs.appendChild(elementData.ms); this.globalData.defs.appendChild(elementData.of); pathElement.setAttribute('mask', 'url(' + getLocationHref() + '#' + elementData.maskId + ')') } } else if (data.ty === 'no') { elementData = new SVGNoStyleData(this, data, styleOb) } if (data.ty === 'st' || data.ty === 'gs') { pathElement.setAttribute('stroke-linecap', lineCapEnum[data.lc || 2]); pathElement.setAttribute('stroke-linejoin', lineJoinEnum[data.lj || 2]); pathElement.setAttribute('fill-opacity', '0'); if (data.lj === 1) { pathElement.setAttribute('stroke-miterlimit', data.ml) } } if (data.r === 2) { pathElement.setAttribute('fill-rule', 'evenodd') } if (data.ln) { pathElement.setAttribute('id', data.ln) } if (data.cl) { pathElement.setAttribute('class', data.cl) } if (data.bm) { pathElement.style['mix-blend-mode'] = getBlendMode(data.bm) } this.stylesList.push(styleOb); this.addToAnimatedContents(data, elementData); return elementData }; SVGShapeElement.prototype.createGroupElement = function (data) { var elementData = new ShapeGroupData(); if (data.ln) { elementData.gr.setAttribute('id', data.ln) } if (data.cl) { elementData.gr.setAttribute('class', data.cl) } if (data.bm) { elementData.gr.style['mix-blend-mode'] = getBlendMode(data.bm) } return elementData }; SVGShapeElement.prototype.createTransformElement = function (data, container) { var transformProperty = TransformPropertyFactory.getTransformProperty(this, data, this); var elementData = new SVGTransformData(transformProperty, transformProperty.o, container); this.addToAnimatedContents(data, elementData); return elementData }; SVGShapeElement.prototype.createShapeElement = function (data, ownTransformers, level) { var ty = 4; if (data.ty === 'rc') { ty = 5 } else if (data.ty === 'el') { ty = 6 } else if (data.ty === 'sr') { ty = 7 } var shapeProperty = ShapePropertyFactory.getShapeProp(this, data, ty, this); var elementData = new SVGShapeData(ownTransformers, level, shapeProperty); this.shapes.push(elementData); this.addShapeToModifiers(elementData); this.addToAnimatedContents(data, elementData); return elementData }; SVGShapeElement.prototype.addToAnimatedContents = function (data, element) { var i = 0; var len = this.animatedContents.length; while (i < len) { if (this.animatedContents[i].element === element) { return } i += 1 } this.animatedContents.push({ fn: SVGElementsRenderer.createRenderFunction(data), element: element, data: data }) }; SVGShapeElement.prototype.setElementStyles = function (elementData) { var arr = elementData.styles; var j; var jLen = this.stylesList.length; for (j = 0; j < jLen; j += 1) { if (!this.stylesList[j].closed) { arr.push(this.stylesList[j]) } } }; SVGShapeElement.prototype.reloadShapes = function () { this._isFirstFrame = true; var i; var len = this.itemsData.length; for (i = 0; i < len; i += 1) { this.prevViewData[i] = this.itemsData[i] } this.searchShapes(this.shapesData, this.itemsData, this.prevViewData, this.layerElement, 0, [], true); this.filterUniqueShapes(); len = this.dynamicProperties.length; for (i = 0; i < len; i += 1) { this.dynamicProperties[i].getValue() } this.renderModifiers() }; SVGShapeElement.prototype.searchShapes = function (arr, itemsData, prevViewData, container, level, transformers, render) { var ownTransformers = [].concat(transformers); var i; var len = arr.length - 1; var j; var jLen; var ownStyles = []; var ownModifiers = []; var currentTransform; var modifier; var processedPos; for (i = len; i>= 0; i -= 1) {
processedPos = this.searchProcessedElement(arr[i]);
if (!processedPos) {
arr[i]._render = render
} else {
itemsData[i] = prevViewData[processedPos - 1]
}
if (arr[i].ty === 'fl' || arr[i].ty === 'st' || arr[i].ty === 'gf' || arr[i].ty === 'gs' || arr[i].ty === 'no') {
if (!processedPos) {
itemsData[i] = this.createStyleElement(arr[i], level)
} else {
itemsData[i].style.closed = false
}
if (arr[i]._render) {
if (itemsData[i].style.pElem.parentNode !== container) {
container.appendChild(itemsData[i].style.pElem)
}
}
ownStyles.push(itemsData[i].style)
} else if (arr[i].ty === 'gr') {
if (!processedPos) {
itemsData[i] = this.createGroupElement(arr[i])
} else {
jLen = itemsData[i].it.length;
for (j = 0; j < jLen; j += 1) { itemsData[i].prevViewData[j] = itemsData[i].it[j] } } this.searchShapes(arr[i].it, itemsData[i].it, itemsData[i].prevViewData, itemsData[i].gr, level + 1, ownTransformers, render); if (arr[i]._render) { if (itemsData[i].gr.parentNode !== container) { container.appendChild(itemsData[i].gr) } } } else if (arr[i].ty === 'tr') { if (!processedPos) { itemsData[i] = this.createTransformElement(arr[i], container) } currentTransform = itemsData[i].transform; ownTransformers.push(currentTransform) } else if (arr[i].ty === 'sh' || arr[i].ty === 'rc' || arr[i].ty === 'el' || arr[i].ty === 'sr') { if (!processedPos) { itemsData[i] = this.createShapeElement(arr[i], ownTransformers, level) } this.setElementStyles(itemsData[i]) } else if (arr[i].ty === 'tm' || arr[i].ty === 'rd' || arr[i].ty === 'ms' || arr[i].ty === 'pb') { if (!processedPos) { modifier = ShapeModifiers.getModifier(arr[i].ty); modifier.init(this, arr[i]); itemsData[i] = modifier; this.shapeModifiers.push(modifier) } else { modifier = itemsData[i]; modifier.closed = false } ownModifiers.push(modifier) } else if (arr[i].ty === 'rp') { if (!processedPos) { modifier = ShapeModifiers.getModifier(arr[i].ty); itemsData[i] = modifier; modifier.init(this, arr, i, itemsData); this.shapeModifiers.push(modifier); render = false } else { modifier = itemsData[i]; modifier.closed = true } ownModifiers.push(modifier) } this.addProcessedElement(arr[i], i + 1) } len = ownStyles.length; for (i = 0; i < len; i += 1) { ownStyles[i].closed = true } len = ownModifiers.length; for (i = 0; i < len; i += 1) { ownModifiers[i].closed = true } }; SVGShapeElement.prototype.renderInnerContent = function () { this.renderModifiers(); var i; var len = this.stylesList.length; for (i = 0; i < len; i += 1) { this.stylesList[i].reset() } this.renderShape(); for (i = 0; i < len; i += 1) { if (this.stylesList[i]._mdf || this._isFirstFrame) { if (this.stylesList[i].msElem) { this.stylesList[i].msElem.setAttribute('d', this.stylesList[i].d); this.stylesList[i].d = 'M0 0' + this.stylesList[i].d } this.stylesList[i].pElem.setAttribute('d', this.stylesList[i].d || 'M0 0') } } }; SVGShapeElement.prototype.renderShape = function () { var i; var len = this.animatedContents.length; var animatedContent; for (i = 0; i < len; i += 1) { animatedContent = this.animatedContents[i]; if ((this._isFirstFrame || animatedContent.element._isAnimated) && animatedContent.data !== true) { animatedContent.fn(animatedContent.data, animatedContent.element, this._isFirstFrame) } } }; SVGShapeElement.prototype.destroy = function () { this.destroyBaseElement(); this.shapesData = null; this.itemsData = null }; function LetterProps(o, sw, sc, fc, m, p) { this.o = o; this.sw = sw; this.sc = sc; this.fc = fc; this.m = m; this.p = p; this._mdf = { o: true, sw: !!sw, sc: !!sc, fc: !!fc, m: true, p: true } } LetterProps.prototype.update = function (o, sw, sc, fc, m, p) { this._mdf.o = false; this._mdf.sw = false; this._mdf.sc = false; this._mdf.fc = false; this._mdf.m = false; this._mdf.p = false; var updated = false; if (this.o !== o) { this.o = o; this._mdf.o = true; updated = true } if (this.sw !== sw) { this.sw = sw; this._mdf.sw = true; updated = true } if (this.sc !== sc) { this.sc = sc; this._mdf.sc = true; updated = true } if (this.fc !== fc) { this.fc = fc; this._mdf.fc = true; updated = true } if (this.m !== m) { this.m = m; this._mdf.m = true; updated = true } if (p.length && (this.p[0] !== p[0] || this.p[1] !== p[1] || this.p[4] !== p[4] || this.p[5] !== p[5] || this.p[12] !== p[12] || this.p[13] !== p[13])) { this.p = p; this._mdf.p = true; updated = true } return updated }; function TextProperty(elem, data) { this._frameId = initialDefaultFrame; this.pv = ''; this.v = ''; this.kf = false; this._isFirstFrame = true; this._mdf = false; this.data = data; this.elem = elem; this.comp = this.elem.comp; this.keysIndex = 0; this.canResize = false; this.minimumFontSize = 1; this.effectsSequence = []; this.currentData = { ascent: 0, boxWidth: this.defaultBoxWidth, f: '', fStyle: '', fWeight: '', fc: '', j: '', justifyOffset: '', l: [], lh: 0, lineWidths: [], ls: '', of: '', s: '', sc: '', sw: 0, t: 0, tr: 0, sz: 0, ps: null, fillColorAnim: false, strokeColorAnim: false, strokeWidthAnim: false, yOffset: 0, finalSize: 0, finalText: [], finalLineHeight: 0, __complete: false }; this.copyData(this.currentData, this.data.d.k[0].s); if (!this.searchProperty()) { this.completeTextData(this.currentData) } } TextProperty.prototype.defaultBoxWidth = [0, 0]; TextProperty.prototype.copyData = function (obj, data) { for (var s in data) { if (Object.prototype.hasOwnProperty.call(data, s)) { obj[s] = data[s] } } return obj }; TextProperty.prototype.setCurrentData = function (data) { if (!data.__complete) { this.completeTextData(data) } this.currentData = data; this.currentData.boxWidth = this.currentData.boxWidth || this.defaultBoxWidth; this._mdf = true }; TextProperty.prototype.searchProperty = function () { return this.searchKeyframes() }; TextProperty.prototype.searchKeyframes = function () { this.kf = this.data.d.k.length> 1;
if (this.kf) {
this.addEffect(this.getKeyframeValue.bind(this))
}
return this.kf
};
TextProperty.prototype.addEffect = function (effectFunction) {
this.effectsSequence.push(effectFunction);
this.elem.addDynamicProperty(this)
};
TextProperty.prototype.getValue = function (_finalValue) {
if ((this.elem.globalData.frameId === this.frameId || !this.effectsSequence.length) && !_finalValue) {
return
}
this.currentData.t = this.data.d.k[this.keysIndex].s.t;
var currentValue = this.currentData;
var currentIndex = this.keysIndex;
if (this.lock) {
this.setCurrentData(this.currentData);
return
}
this.lock = true;
this._mdf = false;
var i;
var len = this.effectsSequence.length;
var finalValue = _finalValue || this.data.d.k[this.keysIndex].s;
for (i = 0; i < len; i += 1) { if (currentIndex !== this.keysIndex) { finalValue = this.effectsSequence[i](finalValue, finalValue.t) } else { finalValue = this.effectsSequence[i](this.currentData, finalValue.t) } } if (currentValue !== finalValue) { this.setCurrentData(finalValue) } this.v = this.currentData; this.pv = this.v; this.lock = false; this.frameId = this.elem.globalData.frameId }; TextProperty.prototype.getKeyframeValue = function () { var textKeys = this.data.d.k; var frameNum = this.elem.comp.renderedFrame; var i = 0; var len = textKeys.length; while (i <= len - 1) { if (i === len - 1 || textKeys[i + 1].t> frameNum) {
break
}
i += 1
}
if (this.keysIndex !== i) {
this.keysIndex = i
}
return this.data.d.k[this.keysIndex].s
};
TextProperty.prototype.buildFinalText = function (text) {
var charactersArray = [];
var i = 0;
var len = text.length;
var charCode;
var secondCharCode;
var shouldCombine = false;
while (i < len) { charCode = text.charCodeAt(i); if (FontManager.isCombinedCharacter(charCode)) { charactersArray[charactersArray.length - 1] += text.charAt(i) } else if (charCode>= 0xD800 && charCode <= 0xDBFF) { secondCharCode = text.charCodeAt(i + 1); if (secondCharCode>= 0xDC00 && secondCharCode <= 0xDFFF) { if (shouldCombine || FontManager.isModifier(charCode, secondCharCode)) { charactersArray[charactersArray.length - 1] += text.substr(i, 2); shouldCombine = false } else { charactersArray.push(text.substr(i, 2)) } i += 1 } else { charactersArray.push(text.charAt(i)) } } else if (charCode> 0xDBFF) {
secondCharCode = text.charCodeAt(i + 1);
if (FontManager.isZeroWidthJoiner(charCode, secondCharCode)) {
shouldCombine = true;
charactersArray[charactersArray.length - 1] += text.substr(i, 2);
i += 1
} else {
charactersArray.push(text.charAt(i))
}
} else if (FontManager.isZeroWidthJoiner(charCode)) {
charactersArray[charactersArray.length - 1] += text.charAt(i);
shouldCombine = true
} else {
charactersArray.push(text.charAt(i))
}
i += 1
}
return charactersArray
};
TextProperty.prototype.completeTextData = function (documentData) {
documentData.__complete = true;
var fontManager = this.elem.globalData.fontManager;
var data = this.data;
var letters = [];
var i;
var len;
var newLineFlag;
var index = 0;
var val;
var anchorGrouping = data.m.g;
var currentSize = 0;
var currentPos = 0;
var currentLine = 0;
var lineWidths = [];
var lineWidth = 0;
var maxLineWidth = 0;
var j;
var jLen;
var fontData = fontManager.getFontByName(documentData.f);
var charData;
var cLength = 0;
var fontProps = getFontProperties(fontData);
documentData.fWeight = fontProps.weight;
documentData.fStyle = fontProps.style;
documentData.finalSize = documentData.s;
documentData.finalText = this.buildFinalText(documentData.t);
len = documentData.finalText.length;
documentData.finalLineHeight = documentData.lh;
var trackingOffset = documentData.tr / 1000 * documentData.finalSize;
var charCode;
if (documentData.sz) {
var flag = true;
var boxWidth = documentData.sz[0];
var boxHeight = documentData.sz[1];
var currentHeight;
var finalText;
while (flag) {
finalText = this.buildFinalText(documentData.t);
currentHeight = 0;
lineWidth = 0;
len = finalText.length;
trackingOffset = documentData.tr / 1000 * documentData.finalSize;
var lastSpaceIndex = -1;
for (i = 0; i < len; i += 1) { charCode = finalText[i].charCodeAt(0); newLineFlag = false; if (finalText[i] === ' ') { lastSpaceIndex = i } else if (charCode === 13 || charCode === 3) { lineWidth = 0; newLineFlag = true; currentHeight += documentData.finalLineHeight || documentData.finalSize * 1.2 } if (fontManager.chars) { charData = fontManager.getCharData(finalText[i], fontData.fStyle, fontData.fFamily); cLength = newLineFlag ? 0 : charData.w * documentData.finalSize / 100 } else { cLength = fontManager.measureText(finalText[i], documentData.f, documentData.finalSize) } if (lineWidth + cLength> boxWidth && finalText[i] !== ' ') {
if (lastSpaceIndex === -1) {
len += 1
} else {
i = lastSpaceIndex
}
currentHeight += documentData.finalLineHeight || documentData.finalSize * 1.2;
finalText.splice(i, lastSpaceIndex === i ? 1 : 0, '\r');
lastSpaceIndex = -1;
lineWidth = 0
} else {
lineWidth += cLength;
lineWidth += trackingOffset
}
}
currentHeight += fontData.ascent * documentData.finalSize / 100;
if (this.canResize && documentData.finalSize> this.minimumFontSize && boxHeight < currentHeight) { documentData.finalSize -= 1; documentData.finalLineHeight = documentData.finalSize * documentData.lh / documentData.s } else { documentData.finalText = finalText; len = documentData.finalText.length; flag = false } } } lineWidth = -trackingOffset; cLength = 0; var uncollapsedSpaces = 0; var currentChar; for (i = 0; i < len; i += 1) { newLineFlag = false; currentChar = documentData.finalText[i]; charCode = currentChar.charCodeAt(0); if (charCode === 13 || charCode === 3) { uncollapsedSpaces = 0; lineWidths.push(lineWidth); maxLineWidth = lineWidth> maxLineWidth ? lineWidth : maxLineWidth;
lineWidth = -2 * trackingOffset;
val = '';
newLineFlag = true;
currentLine += 1
} else {
val = currentChar
}
if (fontManager.chars) {
charData = fontManager.getCharData(currentChar, fontData.fStyle, fontManager.getFontByName(documentData.f).fFamily);
cLength = newLineFlag ? 0 : charData.w * documentData.finalSize / 100
} else {
cLength = fontManager.measureText(val, documentData.f, documentData.finalSize)
}
if (currentChar === ' ') {
uncollapsedSpaces += cLength + trackingOffset
} else {
lineWidth += cLength + trackingOffset + uncollapsedSpaces;
uncollapsedSpaces = 0
}
letters.push({
l: cLength,
an: cLength,
add: currentSize,
n: newLineFlag,
anIndexes: [],
val: val,
line: currentLine,
animatorJustifyOffset: 0
});
if (anchorGrouping == 2) {
currentSize += cLength;
if (val === '' || val === ' ' || i === len - 1) {
if (val === '' || val === ' ') {
currentSize -= cLength
}
while (currentPos <= i) { letters[currentPos].an = currentSize; letters[currentPos].ind = index; letters[currentPos].extra = cLength; currentPos += 1 } index += 1; currentSize = 0 } } else if (anchorGrouping == 3) { currentSize += cLength; if (val === '' || i === len - 1) { if (val === '') { currentSize -= cLength } while (currentPos <= i) { letters[currentPos].an = currentSize; letters[currentPos].ind = index; letters[currentPos].extra = cLength; currentPos += 1 } currentSize = 0; index += 1 } } else { letters[index].ind = index; letters[index].extra = 0; index += 1 } } documentData.l = letters; maxLineWidth = lineWidth> maxLineWidth ? lineWidth : maxLineWidth;
lineWidths.push(lineWidth);
if (documentData.sz) {
documentData.boxWidth = documentData.sz[0];
documentData.justifyOffset = 0
} else {
documentData.boxWidth = maxLineWidth;
switch (documentData.j) {
case 1:
documentData.justifyOffset = -documentData.boxWidth;
break;
case 2:
documentData.justifyOffset = -documentData.boxWidth / 2;
break;
default:
documentData.justifyOffset = 0
}
}
documentData.lineWidths = lineWidths;
var animators = data.a;
var animatorData;
var letterData;
jLen = animators.length;
var based;
var ind;
var indexes = [];
for (j = 0; j < jLen; j += 1) { animatorData = animators[j]; if (animatorData.a.sc) { documentData.strokeColorAnim = true } if (animatorData.a.sw) { documentData.strokeWidthAnim = true } if (animatorData.a.fc || animatorData.a.fh || animatorData.a.fs || animatorData.a.fb) { documentData.fillColorAnim = true } ind = 0; based = animatorData.s.b; for (i = 0; i < len; i += 1) { letterData = letters[i]; letterData.anIndexes[j] = ind; if (based == 1 && letterData.val !== '' || based == 2 && letterData.val !== '' && letterData.val !== ' ' || based == 3 && (letterData.n || letterData.val == ' ' || i == len - 1) || based == 4 && (letterData.n || i == len - 1)) { if (animatorData.s.rn === 1) { indexes.push(ind) } ind += 1 } } data.a[j].s.totalChars = ind; var currentInd = -1; var newInd; if (animatorData.s.rn === 1) { for (i = 0; i < len; i += 1) { letterData = letters[i]; if (currentInd != letterData.anIndexes[j]) { currentInd = letterData.anIndexes[j]; newInd = indexes.splice(Math.floor(Math.random() * indexes.length), 1)[0] } letterData.anIndexes[j] = newInd } } } documentData.yOffset = documentData.finalLineHeight || documentData.finalSize * 1.2; documentData.ls = documentData.ls || 0; documentData.ascent = fontData.ascent * documentData.finalSize / 100 }; TextProperty.prototype.updateDocumentData = function (newData, index) { index = index === undefined ? this.keysIndex : index; var dData = this.copyData({}, this.data.d.k[index].s); dData = this.copyData(dData, newData); this.data.d.k[index].s = dData; this.recalculate(index); this.elem.addDynamicProperty(this) }; TextProperty.prototype.recalculate = function (index) { var dData = this.data.d.k[index].s; dData.__complete = false; this.keysIndex = 0; this._isFirstFrame = true; this.getValue(dData) }; TextProperty.prototype.canResizeFont = function (_canResize) { this.canResize = _canResize; this.recalculate(this.keysIndex); this.elem.addDynamicProperty(this) }; TextProperty.prototype.setMinimumFontSize = function (_fontValue) { this.minimumFontSize = Math.floor(_fontValue) || 1; this.recalculate(this.keysIndex); this.elem.addDynamicProperty(this) }; var TextSelectorProp = function () { var max = Math.max; var min = Math.min; var floor = Math.floor; function TextSelectorPropFactory(elem, data) { this._currentTextLength = -1; this.k = false; this.data = data; this.elem = elem; this.comp = elem.comp; this.finalS = 0; this.finalE = 0; this.initDynamicPropertyContainer(elem); this.s = PropertyFactory.getProp(elem, data.s || { k: 0 }, 0, 0, this); if ('e' in data) { this.e = PropertyFactory.getProp(elem, data.e, 0, 0, this) } else { this.e = { v: 100 } } this.o = PropertyFactory.getProp(elem, data.o || { k: 0 }, 0, 0, this); this.xe = PropertyFactory.getProp(elem, data.xe || { k: 0 }, 0, 0, this); this.ne = PropertyFactory.getProp(elem, data.ne || { k: 0 }, 0, 0, this); this.sm = PropertyFactory.getProp(elem, data.sm || { k: 100 }, 0, 0, this); this.a = PropertyFactory.getProp(elem, data.a, 0, 0.01, this); if (!this.dynamicProperties.length) { this.getValue() } } TextSelectorPropFactory.prototype = { getMult: function getMult(ind) { if (this._currentTextLength !== this.elem.textProperty.currentData.l.length) { this.getValue() } var x1 = 0; var y1 = 0; var x2 = 1; var y2 = 1; if (this.ne.v> 0) {
x1 = this.ne.v / 100.0
} else {
y1 = -this.ne.v / 100.0
}
if (this.xe.v> 0) {
x2 = 1.0 - this.xe.v / 100.0
} else {
y2 = 1.0 + this.xe.v / 100.0
}
var easer = BezierFactory.getBezierEasing(x1, y1, x2, y2).get;
var mult = 0;
var s = this.finalS;
var e = this.finalE;
var type = this.data.sh;
if (type === 2) {
if (e === s) {
mult = ind>= e ? 1 : 0
} else {
mult = max(0, min(0.5 / (e - s) + (ind - s) / (e - s), 1))
}
mult = easer(mult)
} else if (type === 3) {
if (e === s) {
mult = ind>= e ? 0 : 1
} else {
mult = 1 - max(0, min(0.5 / (e - s) + (ind - s) / (e - s), 1))
}
mult = easer(mult)
} else if (type === 4) {
if (e === s) {
mult = 0
} else {
mult = max(0, min(0.5 / (e - s) + (ind - s) / (e - s), 1));
if (mult < 0.5) { mult *= 2 } else { mult = 1 - 2 * (mult - 0.5) } } mult = easer(mult) } else if (type === 5) { if (e === s) { mult = 0 } else { var tot = e - s; ind = min(max(0, ind + 0.5 - s), e - s); var x = -tot / 2 + ind; var a = tot / 2; mult = Math.sqrt(1 - x * x / (a * a)) } mult = easer(mult) } else if (type === 6) { if (e === s) { mult = 0 } else { ind = min(max(0, ind + 0.5 - s), e - s); mult = (1 + Math.cos(Math.PI + Math.PI * 2 * ind / (e - s))) / 2 } mult = easer(mult) } else { if (ind>= floor(s)) {
if (ind - s < 0) { mult = max(0, min(min(e, 1) - (s - ind), 1)) } else { mult = max(0, min(e - ind, 1)) } } mult = easer(mult) } if (this.sm.v !== 100) { var smoothness = this.sm.v * 0.01; if (smoothness === 0) { smoothness = 0.00000001 } var threshold = 0.5 - smoothness * 0.5; if (mult < threshold) { mult = 0 } else { mult = (mult - threshold) / smoothness; if (mult> 1) {
mult = 1
}
}
}
return mult * this.a.v
},
getValue: function getValue(newCharsFlag) {
this.iterateDynamicProperties();
this._mdf = newCharsFlag || this._mdf;
this._currentTextLength = this.elem.textProperty.currentData.l.length || 0;
if (newCharsFlag && this.data.r === 2) {
this.e.v = this._currentTextLength
}
var divisor = this.data.r === 2 ? 1 : 100 / this.data.totalChars;
var o = this.o.v / divisor;
var s = this.s.v / divisor + o;
var e = this.e.v / divisor + o;
if (s> e) {
var _s = s;
s = e;
e = _s
}
this.finalS = s;
this.finalE = e
}
};
extendPrototype([DynamicPropertyContainer], TextSelectorPropFactory);
function getTextSelectorProp(elem, data, arr) {
return new TextSelectorPropFactory(elem, data, arr)
}
return {
getTextSelectorProp: getTextSelectorProp
}
}();
function TextAnimatorDataProperty(elem, animatorProps, container) {
var defaultData = {
propType: false
};
var getProp = PropertyFactory.getProp;
var textAnimatorAnimatables = animatorProps.a;
this.a = {
r: textAnimatorAnimatables.r ? getProp(elem, textAnimatorAnimatables.r, 0, degToRads, container) : defaultData,
rx: textAnimatorAnimatables.rx ? getProp(elem, textAnimatorAnimatables.rx, 0, degToRads, container) : defaultData,
ry: textAnimatorAnimatables.ry ? getProp(elem, textAnimatorAnimatables.ry, 0, degToRads, container) : defaultData,
sk: textAnimatorAnimatables.sk ? getProp(elem, textAnimatorAnimatables.sk, 0, degToRads, container) : defaultData,
sa: textAnimatorAnimatables.sa ? getProp(elem, textAnimatorAnimatables.sa, 0, degToRads, container) : defaultData,
s: textAnimatorAnimatables.s ? getProp(elem, textAnimatorAnimatables.s, 1, 0.01, container) : defaultData,
a: textAnimatorAnimatables.a ? getProp(elem, textAnimatorAnimatables.a, 1, 0, container) : defaultData,
o: textAnimatorAnimatables.o ? getProp(elem, textAnimatorAnimatables.o, 0, 0.01, container) : defaultData,
p: textAnimatorAnimatables.p ? getProp(elem, textAnimatorAnimatables.p, 1, 0, container) : defaultData,
sw: textAnimatorAnimatables.sw ? getProp(elem, textAnimatorAnimatables.sw, 0, 0, container) : defaultData,
sc: textAnimatorAnimatables.sc ? getProp(elem, textAnimatorAnimatables.sc, 1, 0, container) : defaultData,
fc: textAnimatorAnimatables.fc ? getProp(elem, textAnimatorAnimatables.fc, 1, 0, container) : defaultData,
fh: textAnimatorAnimatables.fh ? getProp(elem, textAnimatorAnimatables.fh, 0, 0, container) : defaultData,
fs: textAnimatorAnimatables.fs ? getProp(elem, textAnimatorAnimatables.fs, 0, 0.01, container) : defaultData,
fb: textAnimatorAnimatables.fb ? getProp(elem, textAnimatorAnimatables.fb, 0, 0.01, container) : defaultData,
t: textAnimatorAnimatables.t ? getProp(elem, textAnimatorAnimatables.t, 0, 0, container) : defaultData
};
this.s = TextSelectorProp.getTextSelectorProp(elem, animatorProps.s, container);
this.s.t = animatorProps.s.t
}
function TextAnimatorProperty(textData, renderType, elem) {
this._isFirstFrame = true;
this._hasMaskedPath = false;
this._frameId = -1;
this._textData = textData;
this._renderType = renderType;
this._elem = elem;
this._animatorsData = createSizedArray(this._textData.a.length);
this._pathData = {};
this._moreOptions = {
alignment: {}
};
this.renderedLetters = [];
this.lettersChangedFlag = false;
this.initDynamicPropertyContainer(elem)
}
TextAnimatorProperty.prototype.searchProperties = function () {
var i;
var len = this._textData.a.length;
var animatorProps;
var getProp = PropertyFactory.getProp;
for (i = 0; i < len; i += 1) { animatorProps = this._textData.a[i]; this._animatorsData[i] = new TextAnimatorDataProperty(this._elem, animatorProps, this) } if (this._textData.p && 'm' in this._textData.p) { this._pathData = { a: getProp(this._elem, this._textData.p.a, 0, 0, this), f: getProp(this._elem, this._textData.p.f, 0, 0, this), l: getProp(this._elem, this._textData.p.l, 0, 0, this), r: getProp(this._elem, this._textData.p.r, 0, 0, this), p: getProp(this._elem, this._textData.p.p, 0, 0, this), m: this._elem.maskManager.getMaskProperty(this._textData.p.m) }; this._hasMaskedPath = true } else { this._hasMaskedPath = false } this._moreOptions.alignment = getProp(this._elem, this._textData.m.a, 1, 0, this) }; TextAnimatorProperty.prototype.getMeasures = function (documentData, lettersChangedFlag) { this.lettersChangedFlag = lettersChangedFlag; if (!this._mdf && !this._isFirstFrame && !lettersChangedFlag && (!this._hasMaskedPath || !this._pathData.m._mdf)) { return } this._isFirstFrame = false; var alignment = this._moreOptions.alignment.v; var animators = this._animatorsData; var textData = this._textData; var matrixHelper = this.mHelper; var renderType = this._renderType; var renderedLettersCount = this.renderedLetters.length; var xPos; var yPos; var i; var len; var letters = documentData.l; var pathInfo; var currentLength; var currentPoint; var segmentLength; var flag; var pointInd; var segmentInd; var prevPoint; var points; var segments; var partialLength; var totalLength; var perc; var tanAngle; var mask; if (this._hasMaskedPath) { mask = this._pathData.m; if (!this._pathData.n || this._pathData._mdf) { var paths = mask.v; if (this._pathData.r.v) { paths = paths.reverse() } pathInfo = { tLength: 0, segments: [] }; len = paths._length - 1; var bezierData; totalLength = 0; for (i = 0; i < len; i += 1) { bezierData = bez.buildBezierData(paths.v[i], paths.v[i + 1], [paths.o[i][0] - paths.v[i][0], paths.o[i][1] - paths.v[i][1]], [paths.i[i + 1][0] - paths.v[i + 1][0], paths.i[i + 1][1] - paths.v[i + 1][1]]); pathInfo.tLength += bezierData.segmentLength; pathInfo.segments.push(bezierData); totalLength += bezierData.segmentLength } i = len; if (mask.v.c) { bezierData = bez.buildBezierData(paths.v[i], paths.v[0], [paths.o[i][0] - paths.v[i][0], paths.o[i][1] - paths.v[i][1]], [paths.i[0][0] - paths.v[0][0], paths.i[0][1] - paths.v[0][1]]); pathInfo.tLength += bezierData.segmentLength; pathInfo.segments.push(bezierData); totalLength += bezierData.segmentLength } this._pathData.pi = pathInfo } pathInfo = this._pathData.pi; currentLength = this._pathData.f.v; segmentInd = 0; pointInd = 1; segmentLength = 0; flag = true; segments = pathInfo.segments; if (currentLength < 0 && mask.v.c) { if (pathInfo.tLength < Math.abs(currentLength)) { currentLength = -Math.abs(currentLength) % pathInfo.tLength } segmentInd = segments.length - 1; points = segments[segmentInd].points; pointInd = points.length - 1; while (currentLength < 0) { currentLength += points[pointInd].partialLength; pointInd -= 1; if (pointInd < 0) { segmentInd -= 1; points = segments[segmentInd].points; pointInd = points.length - 1 } } } points = segments[segmentInd].points; prevPoint = points[pointInd - 1]; currentPoint = points[pointInd]; partialLength = currentPoint.partialLength } len = letters.length; xPos = 0; yPos = 0; var yOff = documentData.finalSize * 1.2 * 0.714; var firstLine = true; var animatorProps; var animatorSelector; var j; var jLen; var letterValue; jLen = animators.length; var mult; var ind = -1; var offf; var xPathPos; var yPathPos; var initPathPos = currentLength; var initSegmentInd = segmentInd; var initPointInd = pointInd; var currentLine = -1; var elemOpacity; var sc; var sw; var fc; var k; var letterSw; var letterSc; var letterFc; var letterM = ''; var letterP = this.defaultPropsArray; var letterO; if (documentData.j === 2 || documentData.j === 1) { var animatorJustifyOffset = 0; var animatorFirstCharOffset = 0; var justifyOffsetMult = documentData.j === 2 ? -0.5 : -1; var lastIndex = 0; var isNewLine = true; for (i = 0; i < len; i += 1) { if (letters[i].n) { if (animatorJustifyOffset) { animatorJustifyOffset += animatorFirstCharOffset } while (lastIndex < i) { letters[lastIndex].animatorJustifyOffset = animatorJustifyOffset; lastIndex += 1 } animatorJustifyOffset = 0; isNewLine = true } else { for (j = 0; j < jLen; j += 1) { animatorProps = animators[j].a; if (animatorProps.t.propType) { if (isNewLine && documentData.j === 2) { animatorFirstCharOffset += animatorProps.t.v * justifyOffsetMult } animatorSelector = animators[j].s; mult = animatorSelector.getMult(letters[i].anIndexes[j], textData.a[j].s.totalChars); if (mult.length) { animatorJustifyOffset += animatorProps.t.v * mult[0] * justifyOffsetMult } else { animatorJustifyOffset += animatorProps.t.v * mult * justifyOffsetMult } } } isNewLine = false } } if (animatorJustifyOffset) { animatorJustifyOffset += animatorFirstCharOffset } while (lastIndex < i) { letters[lastIndex].animatorJustifyOffset = animatorJustifyOffset; lastIndex += 1 } } for (i = 0; i < len; i += 1) { matrixHelper.reset(); elemOpacity = 1; if (letters[i].n) { xPos = 0; yPos += documentData.yOffset; yPos += firstLine ? 1 : 0; currentLength = initPathPos; firstLine = false; if (this._hasMaskedPath) { segmentInd = initSegmentInd; pointInd = initPointInd; points = segments[segmentInd].points; prevPoint = points[pointInd - 1]; currentPoint = points[pointInd]; partialLength = currentPoint.partialLength; segmentLength = 0 } letterM = ''; letterFc = ''; letterSw = ''; letterO = ''; letterP = this.defaultPropsArray } else { if (this._hasMaskedPath) { if (currentLine !== letters[i].line) { switch (documentData.j) { case 1: currentLength += totalLength - documentData.lineWidths[letters[i].line]; break; case 2: currentLength += (totalLength - documentData.lineWidths[letters[i].line]) / 2; break; default: break } currentLine = letters[i].line } if (ind !== letters[i].ind) { if (letters[ind]) { currentLength += letters[ind].extra } currentLength += letters[i].an / 2; ind = letters[i].ind } currentLength += alignment[0] * letters[i].an * 0.005; var animatorOffset = 0; for (j = 0; j < jLen; j += 1) { animatorProps = animators[j].a; if (animatorProps.p.propType) { animatorSelector = animators[j].s; mult = animatorSelector.getMult(letters[i].anIndexes[j], textData.a[j].s.totalChars); if (mult.length) { animatorOffset += animatorProps.p.v[0] * mult[0] } else { animatorOffset += animatorProps.p.v[0] * mult } } if (animatorProps.a.propType) { animatorSelector = animators[j].s; mult = animatorSelector.getMult(letters[i].anIndexes[j], textData.a[j].s.totalChars); if (mult.length) { animatorOffset += animatorProps.a.v[0] * mult[0] } else { animatorOffset += animatorProps.a.v[0] * mult } } } flag = true; if (this._pathData.a.v) { currentLength = letters[0].an * 0.5 + (totalLength - this._pathData.f.v - letters[0].an * 0.5 - letters[letters.length - 1].an * 0.5) * ind / (len - 1); currentLength += this._pathData.f.v } while (flag) { if (segmentLength + partialLength>= currentLength + animatorOffset || !points) {
perc = (currentLength + animatorOffset - segmentLength) / currentPoint.partialLength;
xPathPos = prevPoint.point[0] + (currentPoint.point[0] - prevPoint.point[0]) * perc;
yPathPos = prevPoint.point[1] + (currentPoint.point[1] - prevPoint.point[1]) * perc;
matrixHelper.translate(-alignment[0] * letters[i].an * 0.005, -(alignment[1] * yOff) * 0.01);
flag = false
} else if (points) {
segmentLength += currentPoint.partialLength;
pointInd += 1;
if (pointInd>= points.length) {
pointInd = 0;
segmentInd += 1;
if (!segments[segmentInd]) {
if (mask.v.c) {
pointInd = 0;
segmentInd = 0;
points = segments[segmentInd].points
} else {
segmentLength -= currentPoint.partialLength;
points = null
}
} else {
points = segments[segmentInd].points
}
}
if (points) {
prevPoint = currentPoint;
currentPoint = points[pointInd];
partialLength = currentPoint.partialLength
}
}
}
offf = letters[i].an / 2 - letters[i].add;
matrixHelper.translate(-offf, 0, 0)
} else {
offf = letters[i].an / 2 - letters[i].add;
matrixHelper.translate(-offf, 0, 0);
matrixHelper.translate(-alignment[0] * letters[i].an * 0.005, -alignment[1] * yOff * 0.01, 0)
}
for (j = 0; j < jLen; j += 1) { animatorProps = animators[j].a; if (animatorProps.t.propType) { animatorSelector = animators[j].s; mult = animatorSelector.getMult(letters[i].anIndexes[j], textData.a[j].s.totalChars); if (xPos !== 0 || documentData.j !== 0) { if (this._hasMaskedPath) { if (mult.length) { currentLength += animatorProps.t.v * mult[0] } else { currentLength += animatorProps.t.v * mult } } else if (mult.length) { xPos += animatorProps.t.v * mult[0] } else { xPos += animatorProps.t.v * mult } } } } if (documentData.strokeWidthAnim) { sw = documentData.sw || 0 } if (documentData.strokeColorAnim) { if (documentData.sc) { sc = [documentData.sc[0], documentData.sc[1], documentData.sc[2]] } else { sc = [0, 0, 0] } } if (documentData.fillColorAnim && documentData.fc) { fc = [documentData.fc[0], documentData.fc[1], documentData.fc[2]] } for (j = 0; j < jLen; j += 1) { animatorProps = animators[j].a; if (animatorProps.a.propType) { animatorSelector = animators[j].s; mult = animatorSelector.getMult(letters[i].anIndexes[j], textData.a[j].s.totalChars); if (mult.length) { matrixHelper.translate(-animatorProps.a.v[0] * mult[0], -animatorProps.a.v[1] * mult[1], animatorProps.a.v[2] * mult[2]) } else { matrixHelper.translate(-animatorProps.a.v[0] * mult, -animatorProps.a.v[1] * mult, animatorProps.a.v[2] * mult) } } } for (j = 0; j < jLen; j += 1) { animatorProps = animators[j].a; if (animatorProps.s.propType) { animatorSelector = animators[j].s; mult = animatorSelector.getMult(letters[i].anIndexes[j], textData.a[j].s.totalChars); if (mult.length) { matrixHelper.scale(1 + (animatorProps.s.v[0] - 1) * mult[0], 1 + (animatorProps.s.v[1] - 1) * mult[1], 1) } else { matrixHelper.scale(1 + (animatorProps.s.v[0] - 1) * mult, 1 + (animatorProps.s.v[1] - 1) * mult, 1) } } } for (j = 0; j < jLen; j += 1) { animatorProps = animators[j].a; animatorSelector = animators[j].s; mult = animatorSelector.getMult(letters[i].anIndexes[j], textData.a[j].s.totalChars); if (animatorProps.sk.propType) { if (mult.length) { matrixHelper.skewFromAxis(-animatorProps.sk.v * mult[0], animatorProps.sa.v * mult[1]) } else { matrixHelper.skewFromAxis(-animatorProps.sk.v * mult, animatorProps.sa.v * mult) } } if (animatorProps.r.propType) { if (mult.length) { matrixHelper.rotateZ(-animatorProps.r.v * mult[2]) } else { matrixHelper.rotateZ(-animatorProps.r.v * mult) } } if (animatorProps.ry.propType) { if (mult.length) { matrixHelper.rotateY(animatorProps.ry.v * mult[1]) } else { matrixHelper.rotateY(animatorProps.ry.v * mult) } } if (animatorProps.rx.propType) { if (mult.length) { matrixHelper.rotateX(animatorProps.rx.v * mult[0]) } else { matrixHelper.rotateX(animatorProps.rx.v * mult) } } if (animatorProps.o.propType) { if (mult.length) { elemOpacity += (animatorProps.o.v * mult[0] - elemOpacity) * mult[0] } else { elemOpacity += (animatorProps.o.v * mult - elemOpacity) * mult } } if (documentData.strokeWidthAnim && animatorProps.sw.propType) { if (mult.length) { sw += animatorProps.sw.v * mult[0] } else { sw += animatorProps.sw.v * mult } } if (documentData.strokeColorAnim && animatorProps.sc.propType) { for (k = 0; k < 3; k += 1) { if (mult.length) { sc[k] += (animatorProps.sc.v[k] - sc[k]) * mult[0] } else { sc[k] += (animatorProps.sc.v[k] - sc[k]) * mult } } } if (documentData.fillColorAnim && documentData.fc) { if (animatorProps.fc.propType) { for (k = 0; k < 3; k += 1) { if (mult.length) { fc[k] += (animatorProps.fc.v[k] - fc[k]) * mult[0] } else { fc[k] += (animatorProps.fc.v[k] - fc[k]) * mult } } } if (animatorProps.fh.propType) { if (mult.length) { fc = addHueToRGB(fc, animatorProps.fh.v * mult[0]) } else { fc = addHueToRGB(fc, animatorProps.fh.v * mult) } } if (animatorProps.fs.propType) { if (mult.length) { fc = addSaturationToRGB(fc, animatorProps.fs.v * mult[0]) } else { fc = addSaturationToRGB(fc, animatorProps.fs.v * mult) } } if (animatorProps.fb.propType) { if (mult.length) { fc = addBrightnessToRGB(fc, animatorProps.fb.v * mult[0]) } else { fc = addBrightnessToRGB(fc, animatorProps.fb.v * mult) } } } } for (j = 0; j < jLen; j += 1) { animatorProps = animators[j].a; if (animatorProps.p.propType) { animatorSelector = animators[j].s; mult = animatorSelector.getMult(letters[i].anIndexes[j], textData.a[j].s.totalChars); if (this._hasMaskedPath) { if (mult.length) { matrixHelper.translate(0, animatorProps.p.v[1] * mult[0], -animatorProps.p.v[2] * mult[1]) } else { matrixHelper.translate(0, animatorProps.p.v[1] * mult, -animatorProps.p.v[2] * mult) } } else if (mult.length) { matrixHelper.translate(animatorProps.p.v[0] * mult[0], animatorProps.p.v[1] * mult[1], -animatorProps.p.v[2] * mult[2]) } else { matrixHelper.translate(animatorProps.p.v[0] * mult, animatorProps.p.v[1] * mult, -animatorProps.p.v[2] * mult) } } } if (documentData.strokeWidthAnim) { letterSw = sw < 0 ? 0 : sw } if (documentData.strokeColorAnim) { letterSc = 'rgb(' + Math.round(sc[0] * 255) + ',' + Math.round(sc[1] * 255) + ',' + Math.round(sc[2] * 255) + ')' } if (documentData.fillColorAnim && documentData.fc) { letterFc = 'rgb(' + Math.round(fc[0] * 255) + ',' + Math.round(fc[1] * 255) + ',' + Math.round(fc[2] * 255) + ')' } if (this._hasMaskedPath) { matrixHelper.translate(0, -documentData.ls); matrixHelper.translate(0, alignment[1] * yOff * 0.01 + yPos, 0); if (this._pathData.p.v) { tanAngle = (currentPoint.point[1] - prevPoint.point[1]) / (currentPoint.point[0] - prevPoint.point[0]); var rot = Math.atan(tanAngle) * 180 / Math.PI; if (currentPoint.point[0] < prevPoint.point[0]) { rot += 180 } matrixHelper.rotate(-rot * Math.PI / 180) } matrixHelper.translate(xPathPos, yPathPos, 0); currentLength -= alignment[0] * letters[i].an * 0.005; if (letters[i + 1] && ind !== letters[i + 1].ind) { currentLength += letters[i].an / 2; currentLength += documentData.tr * 0.001 * documentData.finalSize } } else { matrixHelper.translate(xPos, yPos, 0); if (documentData.ps) { matrixHelper.translate(documentData.ps[0], documentData.ps[1] + documentData.ascent, 0) } switch (documentData.j) { case 1: matrixHelper.translate(letters[i].animatorJustifyOffset + documentData.justifyOffset + (documentData.boxWidth - documentData.lineWidths[letters[i].line]), 0, 0); break; case 2: matrixHelper.translate(letters[i].animatorJustifyOffset + documentData.justifyOffset + (documentData.boxWidth - documentData.lineWidths[letters[i].line]) / 2, 0, 0); break; default: break } matrixHelper.translate(0, -documentData.ls); matrixHelper.translate(offf, 0, 0); matrixHelper.translate(alignment[0] * letters[i].an * 0.005, alignment[1] * yOff * 0.01, 0); xPos += letters[i].l + documentData.tr * 0.001 * documentData.finalSize } if (renderType === 'html') { letterM = matrixHelper.toCSS() } else if (renderType === 'svg') { letterM = matrixHelper.to2dCSS() } else { letterP = [matrixHelper.props[0], matrixHelper.props[1], matrixHelper.props[2], matrixHelper.props[3], matrixHelper.props[4], matrixHelper.props[5], matrixHelper.props[6], matrixHelper.props[7], matrixHelper.props[8], matrixHelper.props[9], matrixHelper.props[10], matrixHelper.props[11], matrixHelper.props[12], matrixHelper.props[13], matrixHelper.props[14], matrixHelper.props[15]] } letterO = elemOpacity } if (renderedLettersCount <= i) { letterValue = new LetterProps(letterO, letterSw, letterSc, letterFc, letterM, letterP); this.renderedLetters.push(letterValue); renderedLettersCount += 1; this.lettersChangedFlag = true } else { letterValue = this.renderedLetters[i]; this.lettersChangedFlag = letterValue.update(letterO, letterSw, letterSc, letterFc, letterM, letterP) || this.lettersChangedFlag } } }; TextAnimatorProperty.prototype.getValue = function () { if (this._elem.globalData.frameId === this._frameId) { return } this._frameId = this._elem.globalData.frameId; this.iterateDynamicProperties() }; TextAnimatorProperty.prototype.mHelper = new Matrix(); TextAnimatorProperty.prototype.defaultPropsArray = []; extendPrototype([DynamicPropertyContainer], TextAnimatorProperty); function ITextElement() {} ITextElement.prototype.initElement = function (data, globalData, comp) { this.lettersChangedFlag = true; this.initFrame(); this.initBaseData(data, globalData, comp); this.textProperty = new TextProperty(this, data.t, this.dynamicProperties); this.textAnimator = new TextAnimatorProperty(data.t, this.renderType, this); this.initTransform(data, globalData, comp); this.initHierarchy(); this.initRenderable(); this.initRendererElement(); this.createContainerElements(); this.createRenderableComponents(); this.createContent(); this.hide(); this.textAnimator.searchProperties(this.dynamicProperties) }; ITextElement.prototype.prepareFrame = function (num) { this._mdf = false; this.prepareRenderableFrame(num); this.prepareProperties(num, this.isInRange); if (this.textProperty._mdf || this.textProperty._isFirstFrame) { this.buildNewText(); this.textProperty._isFirstFrame = false; this.textProperty._mdf = false } }; ITextElement.prototype.createPathShape = function (matrixHelper, shapes) { var j; var jLen = shapes.length; var pathNodes; var shapeStr = ''; for (j = 0; j < jLen; j += 1) { if (shapes[j].ty === 'sh') { pathNodes = shapes[j].ks.k; shapeStr += buildShapeString(pathNodes, pathNodes.i.length, true, matrixHelper) } } return shapeStr }; ITextElement.prototype.updateDocumentData = function (newData, index) { this.textProperty.updateDocumentData(newData, index) }; ITextElement.prototype.canResizeFont = function (_canResize) { this.textProperty.canResizeFont(_canResize) }; ITextElement.prototype.setMinimumFontSize = function (_fontSize) { this.textProperty.setMinimumFontSize(_fontSize) }; ITextElement.prototype.applyTextPropertiesToMatrix = function (documentData, matrixHelper, lineNumber, xPos, yPos) { if (documentData.ps) { matrixHelper.translate(documentData.ps[0], documentData.ps[1] + documentData.ascent, 0) } matrixHelper.translate(0, -documentData.ls, 0); switch (documentData.j) { case 1: matrixHelper.translate(documentData.justifyOffset + (documentData.boxWidth - documentData.lineWidths[lineNumber]), 0, 0); break; case 2: matrixHelper.translate(documentData.justifyOffset + (documentData.boxWidth - documentData.lineWidths[lineNumber]) / 2, 0, 0); break; default: break } matrixHelper.translate(xPos, yPos, 0) }; ITextElement.prototype.buildColor = function (colorData) { return 'rgb(' + Math.round(colorData[0] * 255) + ',' + Math.round(colorData[1] * 255) + ',' + Math.round(colorData[2] * 255) + ')' }; ITextElement.prototype.emptyProp = new LetterProps(); ITextElement.prototype.destroy = function () {}; var emptyShapeData = { shapes: [] }; function SVGTextLottieElement(data, globalData, comp) { this.textSpans = []; this.renderType = 'svg'; this.initElement(data, globalData, comp) } extendPrototype([BaseElement, TransformElement, SVGBaseElement, HierarchyElement, FrameElement, RenderableDOMElement, ITextElement], SVGTextLottieElement); SVGTextLottieElement.prototype.createContent = function () { if (this.data.singleShape && !this.globalData.fontManager.chars) { this.textContainer = createNS('text') } }; SVGTextLottieElement.prototype.buildTextContents = function (textArray) { var i = 0; var len = textArray.length; var textContents = []; var currentTextContent = ''; while (i < len) { if (textArray[i] === String.fromCharCode(13) || textArray[i] === String.fromCharCode(3)) { textContents.push(currentTextContent); currentTextContent = '' } else { currentTextContent += textArray[i] } i += 1 } textContents.push(currentTextContent); return textContents }; SVGTextLottieElement.prototype.buildShapeData = function (data, scale) { if (data.shapes && data.shapes.length) { var shape = data.shapes[0]; if (shape.it) { var shapeItem = shape.it[shape.it.length - 1]; if (shapeItem.s) { shapeItem.s.k[0] = scale; shapeItem.s.k[1] = scale } } } return data }; SVGTextLottieElement.prototype.buildNewText = function () { this.addDynamicProperty(this); var i; var len; var documentData = this.textProperty.currentData; this.renderedLetters = createSizedArray(documentData ? documentData.l.length : 0); if (documentData.fc) { this.layerElement.setAttribute('fill', this.buildColor(documentData.fc)) } else { this.layerElement.setAttribute('fill', 'rgba(0,0,0,0)') } if (documentData.sc) { this.layerElement.setAttribute('stroke', this.buildColor(documentData.sc)); this.layerElement.setAttribute('stroke-font-size', documentData.finalSize); var fontData = this.globalData.fontManager.getFontByName(documentData.f); if (fontData.fClass) { this.layerElement.setAttribute('class', fontData.fClass) } else { this.layerElement.setAttribute('font-family', fontData.fFamily); var fWeight = documentData.fWeight; var fStyle = documentData.fStyle; this.layerElement.setAttribute('font-style', fStyle); this.layerElement.setAttribute('font-weight', fWeight) } this.layerElement.setAttribute('aria-label', documentData.t); var letters = documentData.l || []; var usesGlyphs = !!this.globalData.fontManager.chars; len = letters.length; var tSpan; var matrixHelper = this.mHelper; var shapeStr = ''; var singleShape = this.data.singleShape; var xPos = 0; var yPos = 0; var firstLine = true; var trackingOffset = documentData.tr * 0.001 * documentData.finalSize; if (singleShape && !usesGlyphs && !documentData.sz) { var tElement = this.textContainer; var justify = 'start'; switch (documentData.j) { case 1: justify = 'end'; break; case 2: justify = 'middle'; break; default: justify = 'start'; break } tElement.setAttribute('text-anchor', justify); tElement.setAttribute('letter-spacing', trackingOffset); var textContent = this.buildTextContents(documentData.finalText); len = textContent.length; yPos = documentData.ps ? documentData.ps[1] + documentData.ascent : 0; for (i = 0; i < len; i += 1) { tSpan = this.textSpans[i].span || createNS('tspan'); tSpan.textContent = textContent[i]; tSpan.setAttribute('x', 0); tSpan.setAttribute('y', yPos); tSpan.style.display = 'inherit'; tElement.appendChild(tSpan); if (!this.textSpans[i]) { this.textSpans[i] = { span: null, glyph: null } } this.textSpans[i].span = tSpan; yPos += documentData.finalLineHeight } this.layerElement.appendChild(tElement) } else { var cachedSpansLength = this.textSpans.length; var charData; for (i = 0; i < len; i += 1) { if (!this.textSpans[i]) { this.textSpans[i] = { span: null, childSpan: null, glyph: null } } if (!usesGlyphs || !singleShape || i === 0) { tSpan = cachedSpansLength> i ? this.textSpans[i].span : createNS(usesGlyphs ? 'g' : 'text');
if (cachedSpansLength <= i) { tSpan.setAttribute('stroke-linecap', 'butt'); tSpan.setAttribute('stroke-linejoin', 'round'); tSpan.setAttribute('stroke-miterlimit', '4'); this.textSpans[i].span = tSpan; if (usesGlyphs) { var childSpan = createNS('g'); tSpan.appendChild(childSpan); this.textSpans[i].childSpan = childSpan } this.textSpans[i].span = tSpan; this.layerElement.appendChild(tSpan) } tSpan.style.display = 'inherit' } matrixHelper.reset(); if (singleShape) { if (letters[i].n) { xPos = -trackingOffset; yPos += documentData.yOffset; yPos += firstLine ? 1 : 0; firstLine = false } this.applyTextPropertiesToMatrix(documentData, matrixHelper, letters[i].line, xPos, yPos); xPos += letters[i].l || 0; xPos += trackingOffset } if (usesGlyphs) { charData = this.globalData.fontManager.getCharData(documentData.finalText[i], fontData.fStyle, this.globalData.fontManager.getFontByName(documentData.f).fFamily); var glyphElement; if (charData.t === 1) { glyphElement = new SVGCompElement(charData.data, this.globalData, this) } else { var data = emptyShapeData; if (charData.data && charData.data.shapes) { data = this.buildShapeData(charData.data, documentData.finalSize) } glyphElement = new SVGShapeElement(data, this.globalData, this) } if (this.textSpans[i].glyph) { var glyph = this.textSpans[i].glyph; this.textSpans[i].childSpan.removeChild(glyph.layerElement); glyph.destroy() } this.textSpans[i].glyph = glyphElement; glyphElement._debug = true; glyphElement.prepareFrame(0); glyphElement.renderFrame(); this.textSpans[i].childSpan.appendChild(glyphElement.layerElement); if (charData.t === 1) { this.textSpans[i].childSpan.setAttribute('transform', 'scale(' + documentData.finalSize / 100 + ',' + documentData.finalSize / 100 + ')') } } else { if (singleShape) { tSpan.setAttribute('transform', 'translate(' + matrixHelper.props[12] + ',' + matrixHelper.props[13] + ')') } tSpan.textContent = letters[i].val; tSpan.setAttributeNS('http://www.w3.org/XML/1998/namespace', 'xml:space', 'preserve') } } if (singleShape && tSpan) { tSpan.setAttribute('d', shapeStr) } } while (i < this.textSpans.length) { this.textSpans[i].span.style.display = 'none'; i += 1 } this._sizeChanged = true }; SVGTextLottieElement.prototype.sourceRectAtTime = function () { this.prepareFrame(this.comp.renderedFrame - this.data.st); this.renderInnerContent(); if (this._sizeChanged) { this._sizeChanged = false; var textBox = this.layerElement.getBBox(); this.bbox = { top: textBox.y, left: textBox.x, width: textBox.width, height: textBox.height } } return this.bbox }; SVGTextLottieElement.prototype.getValue = function () { var i; var len = this.textSpans.length; var glyphElement; this.renderedFrame = this.comp.renderedFrame; for (i = 0; i < len; i += 1) { glyphElement = this.textSpans[i].glyph; if (glyphElement) { glyphElement.prepareFrame(this.comp.renderedFrame - this.data.st); if (glyphElement._mdf) { this._mdf = true } } } }; SVGTextLottieElement.prototype.renderInnerContent = function () { if (!this.data.singleShape || this._mdf) { this.textAnimator.getMeasures(this.textProperty.currentData, this.lettersChangedFlag); if (this.lettersChangedFlag || this.textAnimator.lettersChangedFlag) { this._sizeChanged = true; var i; var len; var renderedLetters = this.textAnimator.renderedLetters; var letters = this.textProperty.currentData.l; len = letters.length; var renderedLetter; var textSpan; var glyphElement; for (i = 0; i < len; i += 1) { if (!letters[i].n) { renderedLetter = renderedLetters[i]; textSpan = this.textSpans[i].span; glyphElement = this.textSpans[i].glyph; if (glyphElement) { glyphElement.renderFrame() } if (renderedLetter._mdf.m) { textSpan.setAttribute('transform', renderedLetter.m) } if (renderedLetter._mdf.o) { textSpan.setAttribute('opacity', renderedLetter.o) } if (renderedLetter._mdf.sw) { textSpan.setAttribute('stroke-stroke', renderedLetter.sc) } if (renderedLetter._mdf.fc) { textSpan.setAttribute('fill', renderedLetter.fc) } } } } } }; function ISolidElement(data, globalData, comp) { this.initElement(data, globalData, comp) } extendPrototype([IImageElement], ISolidElement); ISolidElement.prototype.createContent = function () { var rect = createNS('rect'); rect.setAttribute('width', this.data.sw); rect.setAttribute('height', this.data.sh); rect.setAttribute('fill', this.data.sc); this.layerElement.appendChild(rect) }; function NullElement(data, globalData, comp) { this.initFrame(); this.initBaseData(data, globalData, comp); this.initFrame(); this.initTransform(data, globalData, comp); this.initHierarchy() } NullElement.prototype.prepareFrame = function (num) { this.prepareProperties(num, true) }; NullElement.prototype.renderFrame = function () {}; NullElement.prototype.getBaseElement = function () { return null }; NullElement.prototype.destroy = function () {}; NullElement.prototype.sourceRectAtTime = function () {}; NullElement.prototype.hide = function () {}; extendPrototype([BaseElement, TransformElement, HierarchyElement, FrameElement], NullElement); function SVGRendererBase() {} extendPrototype([BaseRenderer], SVGRendererBase); SVGRendererBase.prototype.createNull = function (data) { return new NullElement(data, this.globalData, this) }; SVGRendererBase.prototype.createShape = function (data) { return new SVGShapeElement(data, this.globalData, this) }; SVGRendererBase.prototype.createText = function (data) { return new SVGTextLottieElement(data, this.globalData, this) }; SVGRendererBase.prototype.createImage = function (data) { return new IImageElement(data, this.globalData, this) }; SVGRendererBase.prototype.createSolid = function (data) { return new ISolidElement(data, this.globalData, this) }; SVGRendererBase.prototype.configAnimation = function (animData) { this.svgElement.setAttribute('xmlns', 'http://www.w3.org/2000/svg'); if (this.renderConfig.viewBoxSize) { this.svgElement.setAttribute('viewBox', this.renderConfig.viewBoxSize) } else { this.svgElement.setAttribute('viewBox', '0 0 ' + animData.w + ' ' + animData.h) } if (!this.renderConfig.viewBoxOnly) { this.svgElement.setAttribute('width', animData.w); this.svgElement.setAttribute('height', animData.h); this.svgElement.style.width = '100%'; this.svgElement.style.height = '100%'; this.svgElement.style.transform = 'translate3d(0,0,0)'; this.svgElement.style.contentVisibility = this.renderConfig.contentVisibility } if (this.renderConfig.width) { this.svgElement.setAttribute('width', this.renderConfig.width) } if (this.renderConfig.height) { this.svgElement.setAttribute('height', this.renderConfig.height) } if (this.renderConfig.className) { this.svgElement.setAttribute('class', this.renderConfig.className) } if (this.renderConfig.id) { this.svgElement.setAttribute('id', this.renderConfig.id) } if (this.renderConfig.focusable !== undefined) { this.svgElement.setAttribute('focusable', this.renderConfig.focusable) } this.svgElement.setAttribute('preserveAspectRatio', this.renderConfig.preserveAspectRatio); this.animationItem.wrapper.appendChild(this.svgElement); var defs = this.globalData.defs; this.setupGlobalData(animData, defs); this.globalData.progressiveLoad = this.renderConfig.progressiveLoad; this.data = animData; var maskElement = createNS('clipPath'); var rect = createNS('rect'); rect.setAttribute('width', animData.w); rect.setAttribute('height', animData.h); rect.setAttribute('x', 0); rect.setAttribute('y', 0); var maskId = createElementID(); maskElement.setAttribute('id', maskId); maskElement.appendChild(rect); this.layerElement.setAttribute('clip-path', 'url(' + getLocationHref() + '#' + maskId + ')'); defs.appendChild(maskElement); this.layers = animData.layers; this.elements = createSizedArray(animData.layers.length) }; SVGRendererBase.prototype.destroy = function () { if (this.animationItem.wrapper) { this.animationItem.wrapper.innerText = '' } this.layerElement = null; this.globalData.defs = null; var i; var len = this.layers ? this.layers.length : 0; for (i = 0; i < len; i += 1) { if (this.elements[i]) { this.elements[i].destroy() } } this.elements.length = 0; this.destroyed = true; this.animationItem = null }; SVGRendererBase.prototype.updateContainerSize = function () {}; SVGRendererBase.prototype.buildItem = function (pos) { var elements = this.elements; if (elements[pos] || this.layers[pos].ty === 99) { return } elements[pos] = true; var element = this.createItem(this.layers[pos]); elements[pos] = element; if (getExpressionsPlugin()) { if (this.layers[pos].ty === 0) { this.globalData.projectInterface.registerComposition(element) } element.initExpressions() } this.appendElementInPos(element, pos); if (this.layers[pos].tt) { if (!this.elements[pos - 1] || this.elements[pos - 1] === true) { this.buildItem(pos - 1); this.addPendingElement(element) } else { element.setMatte(elements[pos - 1].layerId) } } }; SVGRendererBase.prototype.checkPendingElements = function () { while (this.pendingElements.length) { var element = this.pendingElements.pop(); element.checkParenting(); if (element.data.tt) { var i = 0; var len = this.elements.length; while (i < len) { if (this.elements[i] === element) { element.setMatte(this.elements[i - 1].layerId); break } i += 1 } } } }; SVGRendererBase.prototype.renderFrame = function (num) { if (this.renderedFrame === num || this.destroyed) { return } if (num === null) { num = this.renderedFrame } else { this.renderedFrame = num } this.globalData.frameNum = num; this.globalData.frameId += 1; this.globalData.projectInterface.currentFrame = num; this.globalData._mdf = false; var i; var len = this.layers.length; if (!this.completeLayers) { this.checkLayers(num) } for (i = len - 1; i>= 0; i -= 1) {
if (this.completeLayers || this.elements[i]) {
this.elements[i].prepareFrame(num - this.layers[i].st)
}
}
if (this.globalData._mdf) {
for (i = 0; i < len; i += 1) { if (this.completeLayers || this.elements[i]) { this.elements[i].renderFrame() } } } }; SVGRendererBase.prototype.appendElementInPos = function (element, pos) { var newElement = element.getBaseElement(); if (!newElement) { return } var i = 0; var nextElement; while (i < pos) { if (this.elements[i] && this.elements[i] !== true && this.elements[i].getBaseElement()) { nextElement = this.elements[i].getBaseElement() } i += 1 } if (nextElement) { this.layerElement.insertBefore(newElement, nextElement) } else { this.layerElement.appendChild(newElement) } }; SVGRendererBase.prototype.hide = function () { this.layerElement.style.display = 'none' }; SVGRendererBase.prototype.show = function () { this.layerElement.style.display = 'block' }; function ICompElement() {} extendPrototype([BaseElement, TransformElement, HierarchyElement, FrameElement, RenderableDOMElement], ICompElement); ICompElement.prototype.initElement = function (data, globalData, comp) { this.initFrame(); this.initBaseData(data, globalData, comp); this.initTransform(data, globalData, comp); this.initRenderable(); this.initHierarchy(); this.initRendererElement(); this.createContainerElements(); this.createRenderableComponents(); if (this.data.xt || !globalData.progressiveLoad) { this.buildAllItems() } this.hide() }; ICompElement.prototype.prepareFrame = function (num) { this._mdf = false; this.prepareRenderableFrame(num); this.prepareProperties(num, this.isInRange); if (!this.isInRange && !this.data.xt) { return } if (!this.tm._placeholder) { var timeRemapped = this.tm.v; if (timeRemapped === this.data.op) { timeRemapped = this.data.op - 1 } this.renderedFrame = timeRemapped } else { this.renderedFrame = num / this.data.sr } var i; var len = this.elements.length; if (!this.completeLayers) { this.checkLayers(this.renderedFrame) } for (i = len - 1; i>= 0; i -= 1) {
if (this.completeLayers || this.elements[i]) {
this.elements[i].prepareFrame(this.renderedFrame - this.layers[i].st);
if (this.elements[i]._mdf) {
this._mdf = true
}
}
}
};
ICompElement.prototype.renderInnerContent = function () {
var i;
var len = this.layers.length;
for (i = 0; i < len; i += 1) { if (this.completeLayers || this.elements[i]) { this.elements[i].renderFrame() } } }; ICompElement.prototype.setElements = function (elems) { this.elements = elems }; ICompElement.prototype.getElements = function () { return this.elements }; ICompElement.prototype.destroyElements = function () { var i; var len = this.layers.length; for (i = 0; i < len; i += 1) { if (this.elements[i]) { this.elements[i].destroy() } } }; ICompElement.prototype.destroy = function () { this.destroyElements(); this.destroyBaseElement() }; function SVGCompElement(data, globalData, comp) { this.layers = data.layers; this.supports3d = true; this.completeLayers = false; this.pendingElements = []; this.elements = this.layers ? createSizedArray(this.layers.length) : []; this.initElement(data, globalData, comp); this.tm = data.tm ? PropertyFactory.getProp(this, data.tm, 0, globalData.frameRate, this) : { _placeholder: true } } extendPrototype([SVGRendererBase, ICompElement, SVGBaseElement], SVGCompElement); SVGCompElement.prototype.createComp = function (data) { return new SVGCompElement(data, this.globalData, this) }; function SVGRenderer(animationItem, config) { this.animationItem = animationItem; this.layers = null; this.renderedFrame = -1; this.svgElement = createNS('svg'); var ariaLabel = ''; if (config && config.title) { var titleElement = createNS('title'); var titleId = createElementID(); titleElement.setAttribute('id', titleId); titleElement.textContent = config.title; this.svgElement.appendChild(titleElement); ariaLabel += titleId } if (config && config.description) { var descElement = createNS('desc'); var descId = createElementID(); descElement.setAttribute('id', descId); descElement.textContent = config.description; this.svgElement.appendChild(descElement); ariaLabel += ' ' + descId } if (ariaLabel) { this.svgElement.setAttribute('aria-labelledby', ariaLabel) } var defs = createNS('defs'); this.svgElement.appendChild(defs); var maskElement = createNS('g'); this.svgElement.appendChild(maskElement); this.layerElement = maskElement; this.renderConfig = { preserveAspectRatio: config && config.preserveAspectRatio || 'xMidYMid meet', imagePreserveAspectRatio: config && config.imagePreserveAspectRatio || 'xMidYMid slice', contentVisibility: config && config.contentVisibility || 'visible', progressiveLoad: config && config.progressiveLoad || false, hideOnTransparent: !(config && config.hideOnTransparent === false), viewBoxOnly: config && config.viewBoxOnly || false, viewBoxSize: config && config.viewBoxSize || false, className: config && config.className || '', id: config && config.id || '', focusable: config && config.focusable, filterSize: { width: config && config.filterSize && config.filterSize.width || '100%', height: config && config.filterSize && config.filterSize.height || '100%', x: config && config.filterSize && config.filterSize.x || '0%', y: config && config.filterSize && config.filterSize.y || '0%' }, width: config && config.width, height: config && config.height }; this.globalData = { _mdf: false, frameNum: -1, defs: defs, renderConfig: this.renderConfig }; this.elements = []; this.pendingElements = []; this.destroyed = false; this.rendererType = 'svg' } extendPrototype([SVGRendererBase], SVGRenderer); SVGRenderer.prototype.createComp = function (data) { return new SVGCompElement(data, this.globalData, this) }; function CVContextData() { this.saved = []; this.cArrPos = 0; this.cTr = new Matrix(); this.cO = 1; var i; var len = 15; this.savedOp = createTypedArray('float32', len); for (i = 0; i < len; i += 1) { this.saved[i] = createTypedArray('float32', 16) } this._length = len } CVContextData.prototype.duplicate = function () { var newLength = this._length * 2; var currentSavedOp = this.savedOp; this.savedOp = createTypedArray('float32', newLength); this.savedOp.set(currentSavedOp); var i = 0; for (i = this._length; i < newLength; i += 1) { this.saved[i] = createTypedArray('float32', 16) } this._length = newLength }; CVContextData.prototype.reset = function () { this.cArrPos = 0; this.cTr.reset(); this.cO = 1 }; function ShapeTransformManager() { this.sequences = {}; this.sequenceList = []; this.transform_key_count = 0 } ShapeTransformManager.prototype = { addTransformSequence: function addTransformSequence(transforms) { var i; var len = transforms.length; var key = '_'; for (i = 0; i < len; i += 1) { key += transforms[i].transform.key + '_' } var sequence = this.sequences[key]; if (!sequence) { sequence = { transforms: [].concat(transforms), finalTransform: new Matrix(), _mdf: false }; this.sequences[key] = sequence; this.sequenceList.push(sequence) } return sequence }, processSequence: function processSequence(sequence, isFirstFrame) { var i = 0; var len = sequence.transforms.length; var _mdf = isFirstFrame; while (i < len && !isFirstFrame) { if (sequence.transforms[i].transform.mProps._mdf) { _mdf = true; break } i += 1 } if (_mdf) { var props; sequence.finalTransform.reset(); for (i = len - 1; i>= 0; i -= 1) {
props = sequence.transforms[i].transform.mProps.v.props;
sequence.finalTransform.transform(props[0], props[1], props[2], props[3], props[4], props[5], props[6], props[7], props[8], props[9], props[10], props[11], props[12], props[13], props[14], props[15])
}
}
sequence._mdf = _mdf
},
processSequences: function processSequences(isFirstFrame) {
var i;
var len = this.sequenceList.length;
for (i = 0; i < len; i += 1) { this.processSequence(this.sequenceList[i], isFirstFrame) } }, getNewKey: function getNewKey() { this.transform_key_count += 1; return '_' + this.transform_key_count } }; function CVEffects() {} CVEffects.prototype.renderFrame = function () {}; function CVMaskElement(data, element) { this.data = data; this.element = element; this.masksProperties = this.data.masksProperties || []; this.viewData = createSizedArray(this.masksProperties.length); var i; var len = this.masksProperties.length; var hasMasks = false; for (i = 0; i < len; i += 1) { if (this.masksProperties[i].mode !== 'n') { hasMasks = true } this.viewData[i] = ShapePropertyFactory.getShapeProp(this.element, this.masksProperties[i], 3) } this.hasMasks = hasMasks; if (hasMasks) { this.element.addRenderableComponent(this) } } CVMaskElement.prototype.renderFrame = function () { if (!this.hasMasks) { return } var transform = this.element.finalTransform.mat; var ctx = this.element.canvasContext; var i; var len = this.masksProperties.length; var pt; var pts; var data; ctx.beginPath(); for (i = 0; i < len; i += 1) { if (this.masksProperties[i].mode !== 'n') { if (this.masksProperties[i].inv) { ctx.moveTo(0, 0); ctx.lineTo(this.element.globalData.compSize.w, 0); ctx.lineTo(this.element.globalData.compSize.w, this.element.globalData.compSize.h); ctx.lineTo(0, this.element.globalData.compSize.h); ctx.lineTo(0, 0) } data = this.viewData[i].v; pt = transform.applyToPointArray(data.v[0][0], data.v[0][1], 0); ctx.moveTo(pt[0], pt[1]); var j; var jLen = data._length; for (j = 1; j < jLen; j += 1) { pts = transform.applyToTriplePoints(data.o[j - 1], data.i[j], data.v[j]); ctx.bezierCurveTo(pts[0], pts[1], pts[2], pts[3], pts[4], pts[5]) } pts = transform.applyToTriplePoints(data.o[j - 1], data.i[0], data.v[0]); ctx.bezierCurveTo(pts[0], pts[1], pts[2], pts[3], pts[4], pts[5]) } } this.element.globalData.renderer.save(true); ctx.clip() }; CVMaskElement.prototype.getMaskProperty = MaskElement.prototype.getMaskProperty; CVMaskElement.prototype.destroy = function () { this.element = null }; function CVBaseElement() {} CVBaseElement.prototype = { createElements: function createElements() {}, initRendererElement: function initRendererElement() {}, createContainerElements: function createContainerElements() { this.canvasContext = this.globalData.canvasContext; this.renderableEffectsManager = new CVEffects(this) }, createContent: function createContent() {}, setBlendMode: function setBlendMode() { var globalData = this.globalData; if (globalData.blendMode !== this.data.bm) { globalData.blendMode = this.data.bm; var blendModeValue = getBlendMode(this.data.bm); globalData.canvasContext.globalCompositeOperation = blendModeValue } }, createRenderableComponents: function createRenderableComponents() { this.maskManager = new CVMaskElement(this.data, this) }, hideElement: function hideElement() { if (!this.hidden && (!this.isInRange || this.isTransparent)) { this.hidden = true } }, showElement: function showElement() { if (this.isInRange && !this.isTransparent) { this.hidden = false; this._isFirstFrame = true; this.maskManager._isFirstFrame = true } }, renderFrame: function renderFrame() { if (this.hidden || this.data.hd) { return } this.renderTransform(); this.renderRenderable(); this.setBlendMode(); var forceRealStack = this.data.ty === 0; this.globalData.renderer.save(forceRealStack); this.globalData.renderer.ctxTransform(this.finalTransform.mat.props); this.globalData.renderer.ctxOpacity(this.finalTransform.mProp.o.v); this.renderInnerContent(); this.globalData.renderer.restore(forceRealStack); if (this.maskManager.hasMasks) { this.globalData.renderer.restore(true) } if (this._isFirstFrame) { this._isFirstFrame = false } }, destroy: function destroy() { this.canvasContext = null; this.data = null; this.globalData = null; this.maskManager.destroy() }, mHelper: new Matrix() }; CVBaseElement.prototype.hide = CVBaseElement.prototype.hideElement; CVBaseElement.prototype.show = CVBaseElement.prototype.showElement; function CVShapeData(element, data, styles, transformsManager) { this.styledShapes = []; this.tr = [0, 0, 0, 0, 0, 0]; var ty = 4; if (data.ty === 'rc') { ty = 5 } else if (data.ty === 'el') { ty = 6 } else if (data.ty === 'sr') { ty = 7 } this.sh = ShapePropertyFactory.getShapeProp(element, data, ty, element); var i; var len = styles.length; var styledShape; for (i = 0; i < len; i += 1) { if (!styles[i].closed) { styledShape = { transforms: transformsManager.addTransformSequence(styles[i].transforms), trNodes: [] }; this.styledShapes.push(styledShape); styles[i].elements.push(styledShape) } } } CVShapeData.prototype.setAsAnimated = SVGShapeData.prototype.setAsAnimated; function CVShapeElement(data, globalData, comp) { this.shapes = []; this.shapesData = data.shapes; this.stylesList = []; this.itemsData = []; this.prevViewData = []; this.shapeModifiers = []; this.processedElements = []; this.transformsManager = new ShapeTransformManager(); this.initElement(data, globalData, comp) } extendPrototype([BaseElement, TransformElement, CVBaseElement, IShapeElement, HierarchyElement, FrameElement, RenderableElement], CVShapeElement); CVShapeElement.prototype.initElement = RenderableDOMElement.prototype.initElement; CVShapeElement.prototype.transformHelper = { opacity: 1, _opMdf: false }; CVShapeElement.prototype.dashResetter = []; CVShapeElement.prototype.createContent = function () { this.searchShapes(this.shapesData, this.itemsData, this.prevViewData, true, []) }; CVShapeElement.prototype.createStyleElement = function (data, transforms) { var styleElem = { data: data, type: data.ty, preTransforms: this.transformsManager.addTransformSequence(transforms), transforms: [], elements: [], closed: data.hd === true }; var elementData = {}; if (data.ty === 'fl' || data.ty === 'st') { elementData.c = PropertyFactory.getProp(this, data.c, 1, 255, this); if (!elementData.c.k) { styleElem.co = 'rgb(' + bmFloor(elementData.c.v[0]) + ',' + bmFloor(elementData.c.v[1]) + ',' + bmFloor(elementData.c.v[2]) + ')' } } else if (data.ty === 'gf' || data.ty === 'gs') { elementData.s = PropertyFactory.getProp(this, data.s, 1, null, this); elementData.e = PropertyFactory.getProp(this, data.e, 1, null, this); elementData.h = PropertyFactory.getProp(this, data.h || { k: 0 }, 0, 0.01, this); elementData.a = PropertyFactory.getProp(this, data.a || { k: 0 }, 0, degToRads, this); elementData.g = new GradientProperty(this, data.g, this) } elementData.o = PropertyFactory.getProp(this, data.o, 0, 0.01, this); if (data.ty === 'st' || data.ty === 'gs') { styleElem.lc = lineCapEnum[data.lc || 2]; styleElem.lj = lineJoinEnum[data.lj || 2]; if (data.lj == 1) { styleElem.ml = data.ml } elementData.w = PropertyFactory.getProp(this, data.w, 0, null, this); if (!elementData.w.k) { styleElem.wi = elementData.w.v } if (data.d) { var d = new DashProperty(this, data.d, 'canvas', this); elementData.d = d; if (!elementData.d.k) { styleElem.da = elementData.d.dashArray; styleElem["do"] = elementData.d.dashoffset[0] } } } else { styleElem.r = data.r === 2 ? 'evenodd' : 'nonzero' } this.stylesList.push(styleElem); elementData.style = styleElem; return elementData }; CVShapeElement.prototype.createGroupElement = function () { var elementData = { it: [], prevViewData: [] }; return elementData }; CVShapeElement.prototype.createTransformElement = function (data) { var elementData = { transform: { opacity: 1, _opMdf: false, key: this.transformsManager.getNewKey(), op: PropertyFactory.getProp(this, data.o, 0, 0.01, this), mProps: TransformPropertyFactory.getTransformProperty(this, data, this) } }; return elementData }; CVShapeElement.prototype.createShapeElement = function (data) { var elementData = new CVShapeData(this, data, this.stylesList, this.transformsManager); this.shapes.push(elementData); this.addShapeToModifiers(elementData); return elementData }; CVShapeElement.prototype.reloadShapes = function () { this._isFirstFrame = true; var i; var len = this.itemsData.length; for (i = 0; i < len; i += 1) { this.prevViewData[i] = this.itemsData[i] } this.searchShapes(this.shapesData, this.itemsData, this.prevViewData, true, []); len = this.dynamicProperties.length; for (i = 0; i < len; i += 1) { this.dynamicProperties[i].getValue() } this.renderModifiers(); this.transformsManager.processSequences(this._isFirstFrame) }; CVShapeElement.prototype.addTransformToStyleList = function (transform) { var i; var len = this.stylesList.length; for (i = 0; i < len; i += 1) { if (!this.stylesList[i].closed) { this.stylesList[i].transforms.push(transform) } } }; CVShapeElement.prototype.removeTransformFromStyleList = function () { var i; var len = this.stylesList.length; for (i = 0; i < len; i += 1) { if (!this.stylesList[i].closed) { this.stylesList[i].transforms.pop() } } }; CVShapeElement.prototype.closeStyles = function (styles) { var i; var len = styles.length; for (i = 0; i < len; i += 1) { styles[i].closed = true } }; CVShapeElement.prototype.searchShapes = function (arr, itemsData, prevViewData, shouldRender, transforms) { var i; var len = arr.length - 1; var j; var jLen; var ownStyles = []; var ownModifiers = []; var processedPos; var modifier; var currentTransform; var ownTransforms = [].concat(transforms); for (i = len; i>= 0; i -= 1) {
processedPos = this.searchProcessedElement(arr[i]);
if (!processedPos) {
arr[i]._shouldRender = shouldRender
} else {
itemsData[i] = prevViewData[processedPos - 1]
}
if (arr[i].ty === 'fl' || arr[i].ty === 'st' || arr[i].ty === 'gf' || arr[i].ty === 'gs') {
if (!processedPos) {
itemsData[i] = this.createStyleElement(arr[i], ownTransforms)
} else {
itemsData[i].style.closed = false
}
ownStyles.push(itemsData[i].style)
} else if (arr[i].ty === 'gr') {
if (!processedPos) {
itemsData[i] = this.createGroupElement(arr[i])
} else {
jLen = itemsData[i].it.length;
for (j = 0; j < jLen; j += 1) { itemsData[i].prevViewData[j] = itemsData[i].it[j] } } this.searchShapes(arr[i].it, itemsData[i].it, itemsData[i].prevViewData, shouldRender, ownTransforms) } else if (arr[i].ty === 'tr') { if (!processedPos) { currentTransform = this.createTransformElement(arr[i]); itemsData[i] = currentTransform } ownTransforms.push(itemsData[i]); this.addTransformToStyleList(itemsData[i]) } else if (arr[i].ty === 'sh' || arr[i].ty === 'rc' || arr[i].ty === 'el' || arr[i].ty === 'sr') { if (!processedPos) { itemsData[i] = this.createShapeElement(arr[i]) } } else if (arr[i].ty === 'tm' || arr[i].ty === 'rd' || arr[i].ty === 'pb') { if (!processedPos) { modifier = ShapeModifiers.getModifier(arr[i].ty); modifier.init(this, arr[i]); itemsData[i] = modifier; this.shapeModifiers.push(modifier) } else { modifier = itemsData[i]; modifier.closed = false } ownModifiers.push(modifier) } else if (arr[i].ty === 'rp') { if (!processedPos) { modifier = ShapeModifiers.getModifier(arr[i].ty); itemsData[i] = modifier; modifier.init(this, arr, i, itemsData); this.shapeModifiers.push(modifier); shouldRender = false } else { modifier = itemsData[i]; modifier.closed = true } ownModifiers.push(modifier) } this.addProcessedElement(arr[i], i + 1) } this.removeTransformFromStyleList(); this.closeStyles(ownStyles); len = ownModifiers.length; for (i = 0; i < len; i += 1) { ownModifiers[i].closed = true } }; CVShapeElement.prototype.renderInnerContent = function () { this.transformHelper.opacity = 1; this.transformHelper._opMdf = false; this.renderModifiers(); this.transformsManager.processSequences(this._isFirstFrame); this.renderShape(this.transformHelper, this.shapesData, this.itemsData, true) }; CVShapeElement.prototype.renderShapeTransform = function (parentTransform, groupTransform) { if (parentTransform._opMdf || groupTransform.op._mdf || this._isFirstFrame) { groupTransform.opacity = parentTransform.opacity; groupTransform.opacity *= groupTransform.op.v; groupTransform._opMdf = true } }; CVShapeElement.prototype.drawLayer = function () { var i; var len = this.stylesList.length; var j; var jLen; var k; var kLen; var elems; var nodes; var renderer = this.globalData.renderer; var ctx = this.globalData.canvasContext; var type; var currentStyle; for (i = 0; i < len; i += 1) { currentStyle = this.stylesList[i]; type = currentStyle.type; if (!((type === 'st' || type === 'gs') && currentStyle.wi === 0 || !currentStyle.data._shouldRender || currentStyle.coOp === 0 || this.globalData.currentGlobalAlpha === 0)) { renderer.save(); elems = currentStyle.elements; if (type === 'st' || type === 'gs') { ctx.strokeStyle = type === 'st' ? currentStyle.co : currentStyle.grd; ctx.lineWidth = currentStyle.wi; ctx.lineCap = currentStyle.lc; ctx.lineJoin = currentStyle.lj; ctx.miterLimit = currentStyle.ml || 0 } else { ctx.fillStyle = type === 'fl' ? currentStyle.co : currentStyle.grd } renderer.ctxOpacity(currentStyle.coOp); if (type !== 'st' && type !== 'gs') { ctx.beginPath() } renderer.ctxTransform(currentStyle.preTransforms.finalTransform.props); jLen = elems.length; for (j = 0; j < jLen; j += 1) { if (type === 'st' || type === 'gs') { ctx.beginPath(); if (currentStyle.da) { ctx.setLineDash(currentStyle.da); ctx.lineDashOffset = currentStyle["do"] } } nodes = elems[j].trNodes; kLen = nodes.length; for (k = 0; k < kLen; k += 1) { if (nodes[k].t === 'm') { ctx.moveTo(nodes[k].p[0], nodes[k].p[1]) } else if (nodes[k].t === 'c') { ctx.bezierCurveTo(nodes[k].pts[0], nodes[k].pts[1], nodes[k].pts[2], nodes[k].pts[3], nodes[k].pts[4], nodes[k].pts[5]) } else { ctx.closePath() } } if (type === 'st' || type === 'gs') { ctx.stroke(); if (currentStyle.da) { ctx.setLineDash(this.dashResetter) } } } if (type !== 'st' && type !== 'gs') { ctx.fill(currentStyle.r) } renderer.restore() } } }; CVShapeElement.prototype.renderShape = function (parentTransform, items, data, isMain) { var i; var len = items.length - 1; var groupTransform; groupTransform = parentTransform; for (i = len; i>= 0; i -= 1) {
if (items[i].ty === 'tr') {
groupTransform = data[i].transform;
this.renderShapeTransform(parentTransform, groupTransform)
} else if (items[i].ty === 'sh' || items[i].ty === 'el' || items[i].ty === 'rc' || items[i].ty === 'sr') {
this.renderPath(items[i], data[i])
} else if (items[i].ty === 'fl') {
this.renderFill(items[i], data[i], groupTransform)
} else if (items[i].ty === 'st') {
this.renderStroke(items[i], data[i], groupTransform)
} else if (items[i].ty === 'gf' || items[i].ty === 'gs') {
this.renderGradientFill(items[i], data[i], groupTransform)
} else if (items[i].ty === 'gr') {
this.renderShape(groupTransform, items[i].it, data[i].it)
} else if (items[i].ty === 'tm') {}
}
if (isMain) {
this.drawLayer()
}
};
CVShapeElement.prototype.renderStyledShape = function (styledShape, shape) {
if (this._isFirstFrame || shape._mdf || styledShape.transforms._mdf) {
var shapeNodes = styledShape.trNodes;
var paths = shape.paths;
var i;
var len;
var j;
var jLen = paths._length;
shapeNodes.length = 0;
var groupTransformMat = styledShape.transforms.finalTransform;
for (j = 0; j < jLen; j += 1) { var pathNodes = paths.shapes[j]; if (pathNodes && pathNodes.v) { len = pathNodes._length; for (i = 1; i < len; i += 1) { if (i === 1) { shapeNodes.push({ t: 'm', p: groupTransformMat.applyToPointArray(pathNodes.v[0][0], pathNodes.v[0][1], 0) }) } shapeNodes.push({ t: 'c', pts: groupTransformMat.applyToTriplePoints(pathNodes.o[i - 1], pathNodes.i[i], pathNodes.v[i]) }) } if (len === 1) { shapeNodes.push({ t: 'm', p: groupTransformMat.applyToPointArray(pathNodes.v[0][0], pathNodes.v[0][1], 0) }) } if (pathNodes.c && len) { shapeNodes.push({ t: 'c', pts: groupTransformMat.applyToTriplePoints(pathNodes.o[i - 1], pathNodes.i[0], pathNodes.v[0]) }); shapeNodes.push({ t: 'z' }) } } } styledShape.trNodes = shapeNodes } }; CVShapeElement.prototype.renderPath = function (pathData, itemData) { if (pathData.hd !== true && pathData._shouldRender) { var i; var len = itemData.styledShapes.length; for (i = 0; i < len; i += 1) { this.renderStyledShape(itemData.styledShapes[i], itemData.sh) } } }; CVShapeElement.prototype.renderFill = function (styleData, itemData, groupTransform) { var styleElem = itemData.style; if (itemData.c._mdf || this._isFirstFrame) { styleElem.co = 'rgb(' + bmFloor(itemData.c.v[0]) + ',' + bmFloor(itemData.c.v[1]) + ',' + bmFloor(itemData.c.v[2]) + ')' } if (itemData.o._mdf || groupTransform._opMdf || this._isFirstFrame) { styleElem.coOp = itemData.o.v * groupTransform.opacity } }; CVShapeElement.prototype.renderGradientFill = function (styleData, itemData, groupTransform) { var styleElem = itemData.style; var grd; if (!styleElem.grd || itemData.g._mdf || itemData.s._mdf || itemData.e._mdf || styleData.t !== 1 && (itemData.h._mdf || itemData.a._mdf)) { var ctx = this.globalData.canvasContext; var pt1 = itemData.s.v; var pt2 = itemData.e.v; if (styleData.t === 1) { grd = ctx.createLinearGradient(pt1[0], pt1[1], pt2[0], pt2[1]) } else { var rad = Math.sqrt(Math.pow(pt1[0] - pt2[0], 2) + Math.pow(pt1[1] - pt2[1], 2)); var ang = Math.atan2(pt2[1] - pt1[1], pt2[0] - pt1[0]); var percent = itemData.h.v; if (percent>= 1) {
percent = 0.99
} else if (percent <= -1) { percent = -0.99 } var dist = rad * percent; var x = Math.cos(ang + itemData.a.v) * dist + pt1[0]; var y = Math.sin(ang + itemData.a.v) * dist + pt1[1]; grd = ctx.createRadialGradient(x, y, 0, pt1[0], pt1[1], rad) } var i; var len = styleData.g.p; var cValues = itemData.g.c; var opacity = 1; for (i = 0; i < len; i += 1) { if (itemData.g._hasOpacity && itemData.g._collapsable) { opacity = itemData.g.o[i * 2 + 1] } grd.addColorStop(cValues[i * 4] / 100, 'rgba(' + cValues[i * 4 + 1] + ',' + cValues[i * 4 + 2] + ',' + cValues[i * 4 + 3] + ',' + opacity + ')') } styleElem.grd = grd } styleElem.coOp = itemData.o.v * groupTransform.opacity }; CVShapeElement.prototype.renderStroke = function (styleData, itemData, groupTransform) { var styleElem = itemData.style; var d = itemData.d; if (d && (d._mdf || this._isFirstFrame)) { styleElem.da = d.dashArray; styleElem["do"] = d.dashoffset[0] } if (itemData.c._mdf || this._isFirstFrame) { styleElem.co = 'rgb(' + bmFloor(itemData.c.v[0]) + ',' + bmFloor(itemData.c.v[1]) + ',' + bmFloor(itemData.c.v[2]) + ')' } if (itemData.o._mdf || groupTransform._opMdf || this._isFirstFrame) { styleElem.coOp = itemData.o.v * groupTransform.opacity } if (itemData.w._mdf || this._isFirstFrame) { styleElem.wi = itemData.w.v } }; CVShapeElement.prototype.destroy = function () { this.shapesData = null; this.globalData = null; this.canvasContext = null; this.stylesList.length = 0; this.itemsData.length = 0 }; function CVTextElement(data, globalData, comp) { this.textSpans = []; this.yOffset = 0; this.fillColorAnim = false; this.strokeColorAnim = false; this.strokeWidthAnim = false; this.stroke = false; this.fill = false; this.justifyOffset = 0; this.currentRender = null; this.renderType = 'canvas'; this.values = { fill: 'rgba(0,0,0,0)', stroke: 'rgba(0,0,0,0)', sWidth: 0, fValue: '' }; this.initElement(data, globalData, comp) } extendPrototype([BaseElement, TransformElement, CVBaseElement, HierarchyElement, FrameElement, RenderableElement, ITextElement], CVTextElement); CVTextElement.prototype.tHelper = createTag('canvas').getContext('2d'); CVTextElement.prototype.buildNewText = function () { var documentData = this.textProperty.currentData; this.renderedLetters = createSizedArray(documentData.l ? documentData.l.length : 0); var hasFill = false; if (documentData.fc) { hasFill = true; this.values.fill = this.buildColor(documentData.fc) } else { this.values.fill = 'rgba(0,0,0,0)' } this.fill = hasFill; var hasStroke = false; if (documentData.sc) { hasStroke = true; this.values.stroke = this.buildColor(documentData.sc); this.values.sWidth = documentData.sw } var fontData = this.globalData.fontManager.getFontByName(documentData.f); var i; var len; var letters = documentData.l; var matrixHelper = this.mHelper; this.stroke = hasStroke; this.values.fValue = documentData.finalSize + 'px ' + this.globalData.fontManager.getFontByName(documentData.f).fFamily; len = documentData.finalText.length; var charData; var shapeData; var k; var kLen; var shapes; var j; var jLen; var pathNodes; var commands; var pathArr; var singleShape = this.data.singleShape; var trackingOffset = documentData.tr * 0.001 * documentData.finalSize; var xPos = 0; var yPos = 0; var firstLine = true; var cnt = 0; for (i = 0; i < len; i += 1) { charData = this.globalData.fontManager.getCharData(documentData.finalText[i], fontData.fStyle, this.globalData.fontManager.getFontByName(documentData.f).fFamily); shapeData = charData && charData.data || {}; matrixHelper.reset(); if (singleShape && letters[i].n) { xPos = -trackingOffset; yPos += documentData.yOffset; yPos += firstLine ? 1 : 0; firstLine = false } shapes = shapeData.shapes ? shapeData.shapes[0].it : []; jLen = shapes.length; matrixHelper.scale(documentData.finalSize / 100, documentData.finalSize / 100); if (singleShape) { this.applyTextPropertiesToMatrix(documentData, matrixHelper, letters[i].line, xPos, yPos) } commands = createSizedArray(jLen - 1); var commandsCounter = 0; for (j = 0; j < jLen; j += 1) { if (shapes[j].ty === 'sh') { kLen = shapes[j].ks.k.i.length; pathNodes = shapes[j].ks.k; pathArr = []; for (k = 1; k < kLen; k += 1) { if (k === 1) { pathArr.push(matrixHelper.applyToX(pathNodes.v[0][0], pathNodes.v[0][1], 0), matrixHelper.applyToY(pathNodes.v[0][0], pathNodes.v[0][1], 0)) } pathArr.push(matrixHelper.applyToX(pathNodes.o[k - 1][0], pathNodes.o[k - 1][1], 0), matrixHelper.applyToY(pathNodes.o[k - 1][0], pathNodes.o[k - 1][1], 0), matrixHelper.applyToX(pathNodes.i[k][0], pathNodes.i[k][1], 0), matrixHelper.applyToY(pathNodes.i[k][0], pathNodes.i[k][1], 0), matrixHelper.applyToX(pathNodes.v[k][0], pathNodes.v[k][1], 0), matrixHelper.applyToY(pathNodes.v[k][0], pathNodes.v[k][1], 0)) } pathArr.push(matrixHelper.applyToX(pathNodes.o[k - 1][0], pathNodes.o[k - 1][1], 0), matrixHelper.applyToY(pathNodes.o[k - 1][0], pathNodes.o[k - 1][1], 0), matrixHelper.applyToX(pathNodes.i[0][0], pathNodes.i[0][1], 0), matrixHelper.applyToY(pathNodes.i[0][0], pathNodes.i[0][1], 0), matrixHelper.applyToX(pathNodes.v[0][0], pathNodes.v[0][1], 0), matrixHelper.applyToY(pathNodes.v[0][0], pathNodes.v[0][1], 0)); commands[commandsCounter] = pathArr; commandsCounter += 1 } } if (singleShape) { xPos += letters[i].l; xPos += trackingOffset } if (this.textSpans[cnt]) { this.textSpans[cnt].elem = commands } else { this.textSpans[cnt] = { elem: commands } } cnt += 1 } }; CVTextElement.prototype.renderInnerContent = function () { var ctx = this.canvasContext; ctx.font = this.values.fValue; ctx.lineCap = 'butt'; ctx.lineJoin = 'miter'; ctx.miterLimit = 4; if (!this.data.singleShape) { this.textAnimator.getMeasures(this.textProperty.currentData, this.lettersChangedFlag) } var i; var len; var j; var jLen; var k; var kLen; var renderedLetters = this.textAnimator.renderedLetters; var letters = this.textProperty.currentData.l; len = letters.length; var renderedLetter; var lastFill = null; var lastStroke = null; var lastStrokeW = null; var commands; var pathArr; for (i = 0; i < len; i += 1) { if (!letters[i].n) { renderedLetter = renderedLetters[i]; if (renderedLetter) { this.globalData.renderer.save(); this.globalData.renderer.ctxTransform(renderedLetter.p); this.globalData.renderer.ctxOpacity(renderedLetter.o) } if (this.fill) { if (renderedLetter && renderedLetter.fc) { if (lastFill !== renderedLetter.fc) { lastFill = renderedLetter.fc; ctx.fillStyle = renderedLetter.fc } } else if (lastFill !== this.values.fill) { lastFill = this.values.fill; ctx.fillStyle = this.values.fill } commands = this.textSpans[i].elem; jLen = commands.length; this.globalData.canvasContext.beginPath(); for (j = 0; j < jLen; j += 1) { pathArr = commands[j]; kLen = pathArr.length; this.globalData.canvasContext.moveTo(pathArr[0], pathArr[1]); for (k = 2; k < kLen; k += 6) { this.globalData.canvasContext.bezierCurveTo(pathArr[k], pathArr[k + 1], pathArr[k + 2], pathArr[k + 3], pathArr[k + 4], pathArr[k + 5]) } } this.globalData.canvasContext.closePath(); this.globalData.canvasContext.fill() } if (this.stroke) { if (renderedLetter && renderedLetter.sw) { if (lastStrokeW !== renderedLetter.sw) { lastStrokeW = renderedLetter.sw; ctx.lineWidth = renderedLetter.sw } } else if (lastStrokeW !== this.values.sWidth) { lastStrokeW = this.values.sWidth; ctx.lineWidth = this.values.sWidth } if (renderedLetter && renderedLetter.sc) { if (lastStroke !== renderedLetter.sc) { lastStroke = renderedLetter.sc; ctx.strokeStyle = renderedLetter.sc } } else if (lastStroke !== this.values.stroke) { lastStroke = this.values.stroke; ctx.strokeStyle = this.values.stroke } commands = this.textSpans[i].elem; jLen = commands.length; this.globalData.canvasContext.beginPath(); for (j = 0; j < jLen; j += 1) { pathArr = commands[j]; kLen = pathArr.length; this.globalData.canvasContext.moveTo(pathArr[0], pathArr[1]); for (k = 2; k < kLen; k += 6) { this.globalData.canvasContext.bezierCurveTo(pathArr[k], pathArr[k + 1], pathArr[k + 2], pathArr[k + 3], pathArr[k + 4], pathArr[k + 5]) } } this.globalData.canvasContext.closePath(); this.globalData.canvasContext.stroke() } if (renderedLetter) { this.globalData.renderer.restore() } } } }; function CVImageElement(data, globalData, comp) { this.assetData = globalData.getAssetData(data.refId); this.img = globalData.imageLoader.getAsset(this.assetData); this.initElement(data, globalData, comp) } extendPrototype([BaseElement, TransformElement, CVBaseElement, HierarchyElement, FrameElement, RenderableElement], CVImageElement); CVImageElement.prototype.initElement = SVGShapeElement.prototype.initElement; CVImageElement.prototype.prepareFrame = IImageElement.prototype.prepareFrame; CVImageElement.prototype.createContent = function () { if (this.img.width && (this.assetData.w !== this.img.width || this.assetData.h !== this.img.height)) { var canvas = createTag('canvas'); canvas.width = this.assetData.w; canvas.height = this.assetData.h; var ctx = canvas.getContext('2d'); var imgW = this.img.width; var imgH = this.img.height; var imgRel = imgW / imgH; var canvasRel = this.assetData.w / this.assetData.h; var widthCrop; var heightCrop; var par = this.assetData.pr || this.globalData.renderConfig.imagePreserveAspectRatio; if (imgRel> canvasRel && par === 'xMidYMid slice' || imgRel < canvasRel && par !== 'xMidYMid slice') { heightCrop = imgH; widthCrop = heightCrop * canvasRel } else { widthCrop = imgW; heightCrop = widthCrop / canvasRel } ctx.drawImage(this.img, (imgW - widthCrop) / 2, (imgH - heightCrop) / 2, widthCrop, heightCrop, 0, 0, this.assetData.w, this.assetData.h); this.img = canvas } }; CVImageElement.prototype.renderInnerContent = function () { this.canvasContext.drawImage(this.img, 0, 0) }; CVImageElement.prototype.destroy = function () { this.img = null }; function CVSolidElement(data, globalData, comp) { this.initElement(data, globalData, comp) } extendPrototype([BaseElement, TransformElement, CVBaseElement, HierarchyElement, FrameElement, RenderableElement], CVSolidElement); CVSolidElement.prototype.initElement = SVGShapeElement.prototype.initElement; CVSolidElement.prototype.prepareFrame = IImageElement.prototype.prepareFrame; CVSolidElement.prototype.renderInnerContent = function () { var ctx = this.canvasContext; ctx.fillStyle = this.data.sc; ctx.fillRect(0, 0, this.data.sw, this.data.sh) }; function CanvasRendererBase(animationItem, config) { this.animationItem = animationItem; this.renderConfig = { clearCanvas: config && config.clearCanvas !== undefined ? config.clearCanvas : true, context: config && config.context || null, progressiveLoad: config && config.progressiveLoad || false, preserveAspectRatio: config && config.preserveAspectRatio || 'xMidYMid meet', imagePreserveAspectRatio: config && config.imagePreserveAspectRatio || 'xMidYMid slice', contentVisibility: config && config.contentVisibility || 'visible', className: config && config.className || '', id: config && config.id || '' }; this.renderConfig.dpr = config && config.dpr || 1; if (this.animationItem.wrapper) { this.renderConfig.dpr = config && config.dpr || window.devicePixelRatio || 1 } this.renderedFrame = -1; this.globalData = { frameNum: -1, _mdf: false, renderConfig: this.renderConfig, currentGlobalAlpha: -1 }; this.contextData = new CVContextData(); this.elements = []; this.pendingElements = []; this.transformMat = new Matrix(); this.completeLayers = false; this.rendererType = 'canvas' } extendPrototype([BaseRenderer], CanvasRendererBase); CanvasRendererBase.prototype.createShape = function (data) { return new CVShapeElement(data, this.globalData, this) }; CanvasRendererBase.prototype.createText = function (data) { return new CVTextElement(data, this.globalData, this) }; CanvasRendererBase.prototype.createImage = function (data) { return new CVImageElement(data, this.globalData, this) }; CanvasRendererBase.prototype.createSolid = function (data) { return new CVSolidElement(data, this.globalData, this) }; CanvasRendererBase.prototype.createNull = SVGRenderer.prototype.createNull; CanvasRendererBase.prototype.ctxTransform = function (props) { if (props[0] === 1 && props[1] === 0 && props[4] === 0 && props[5] === 1 && props[12] === 0 && props[13] === 0) { return } if (!this.renderConfig.clearCanvas) { this.canvasContext.transform(props[0], props[1], props[4], props[5], props[12], props[13]); return } this.transformMat.cloneFromProps(props); var cProps = this.contextData.cTr.props; this.transformMat.transform(cProps[0], cProps[1], cProps[2], cProps[3], cProps[4], cProps[5], cProps[6], cProps[7], cProps[8], cProps[9], cProps[10], cProps[11], cProps[12], cProps[13], cProps[14], cProps[15]); this.contextData.cTr.cloneFromProps(this.transformMat.props); var trProps = this.contextData.cTr.props; this.canvasContext.setTransform(trProps[0], trProps[1], trProps[4], trProps[5], trProps[12], trProps[13]) }; CanvasRendererBase.prototype.ctxOpacity = function (op) { if (!this.renderConfig.clearCanvas) { this.canvasContext.globalAlpha *= op < 0 ? 0 : op; this.globalData.currentGlobalAlpha = this.contextData.cO; return } this.contextData.cO *= op < 0 ? 0 : op; if (this.globalData.currentGlobalAlpha !== this.contextData.cO) { this.canvasContext.globalAlpha = this.contextData.cO; this.globalData.currentGlobalAlpha = this.contextData.cO } }; CanvasRendererBase.prototype.reset = function () { if (!this.renderConfig.clearCanvas) { this.canvasContext.restore(); return } this.contextData.reset() }; CanvasRendererBase.prototype.save = function (actionFlag) { if (!this.renderConfig.clearCanvas) { this.canvasContext.save(); return } if (actionFlag) { this.canvasContext.save() } var props = this.contextData.cTr.props; if (this.contextData._length <= this.contextData.cArrPos) { this.contextData.duplicate() } var i; var arr = this.contextData.saved[this.contextData.cArrPos]; for (i = 0; i < 16; i += 1) { arr[i] = props[i] } this.contextData.savedOp[this.contextData.cArrPos] = this.contextData.cO; this.contextData.cArrPos += 1 }; CanvasRendererBase.prototype.restore = function (actionFlag) { if (!this.renderConfig.clearCanvas) { this.canvasContext.restore(); return } if (actionFlag) { this.canvasContext.restore(); this.globalData.blendMode = 'source-over' } this.contextData.cArrPos -= 1; var popped = this.contextData.saved[this.contextData.cArrPos]; var i; var arr = this.contextData.cTr.props; for (i = 0; i < 16; i += 1) { arr[i] = popped[i] } this.canvasContext.setTransform(popped[0], popped[1], popped[4], popped[5], popped[12], popped[13]); popped = this.contextData.savedOp[this.contextData.cArrPos]; this.contextData.cO = popped; if (this.globalData.currentGlobalAlpha !== popped) { this.canvasContext.globalAlpha = popped; this.globalData.currentGlobalAlpha = popped } }; CanvasRendererBase.prototype.configAnimation = function (animData) { if (this.animationItem.wrapper) { this.animationItem.container = createTag('canvas'); var containerStyle = this.animationItem.container.style; containerStyle.width = '100%'; containerStyle.height = '100%'; var origin = '0px 0px 0px'; containerStyle.transformOrigin = origin; containerStyle.mozTransformOrigin = origin; containerStyle.webkitTransformOrigin = origin; containerStyle['-webkit-transform'] = origin; containerStyle.contentVisibility = this.renderConfig.contentVisibility; this.animationItem.wrapper.appendChild(this.animationItem.container); this.canvasContext = this.animationItem.container.getContext('2d'); if (this.renderConfig.className) { this.animationItem.container.setAttribute('class', this.renderConfig.className) } if (this.renderConfig.id) { this.animationItem.container.setAttribute('id', this.renderConfig.id) } } else { this.canvasContext = this.renderConfig.context } this.data = animData; this.layers = animData.layers; this.transformCanvas = { w: animData.w, h: animData.h, sx: 0, sy: 0, tx: 0, ty: 0 }; this.setupGlobalData(animData, document.body); this.globalData.canvasContext = this.canvasContext; this.globalData.renderer = this; this.globalData.isDashed = false; this.globalData.progressiveLoad = this.renderConfig.progressiveLoad; this.globalData.transformCanvas = this.transformCanvas; this.elements = createSizedArray(animData.layers.length); this.updateContainerSize() }; CanvasRendererBase.prototype.updateContainerSize = function () { this.reset(); var elementWidth; var elementHeight; if (this.animationItem.wrapper && this.animationItem.container) { elementWidth = this.animationItem.wrapper.offsetWidth; elementHeight = this.animationItem.wrapper.offsetHeight; this.animationItem.container.setAttribute('height', elementHeight * this.renderConfig.dpr) } else { elementWidth = this.canvasContext.canvas.width * this.renderConfig.dpr; elementHeight = this.canvasContext.canvas.height * this.renderConfig.dpr } var elementRel; var animationRel; if (this.renderConfig.preserveAspectRatio.indexOf('meet') !== -1 || this.renderConfig.preserveAspectRatio.indexOf('slice') !== -1) { var par = this.renderConfig.preserveAspectRatio.split(' '); var fillType = par[1] || 'meet'; var pos = par[0] || 'xMidYMid'; var xPos = pos.substr(0, 4); var yPos = pos.substr(4); elementRel = elementWidth / elementHeight; animationRel = this.transformCanvas.w / this.transformCanvas.h; if (animationRel> elementRel && fillType === 'meet' || animationRel < elementRel && fillType === 'slice') { this.transformCanvas.sx = elementWidth / (this.transformCanvas.w / this.renderConfig.dpr); this.transformCanvas.sy = elementWidth / (this.transformCanvas.w / this.renderConfig.dpr) } else { this.transformCanvas.sx = elementHeight / (this.transformCanvas.h / this.renderConfig.dpr); this.transformCanvas.sy = elementHeight / (this.transformCanvas.h / this.renderConfig.dpr) } if (xPos === 'xMid' && (animationRel < elementRel && fillType === 'meet' || animationRel> elementRel && fillType === 'slice')) {
this.transformCanvas.tx = (elementWidth - this.transformCanvas.w * (elementHeight / this.transformCanvas.h)) / 2 * this.renderConfig.dpr
} else if (xPos === 'xMax' && (animationRel < elementRel && fillType === 'meet' || animationRel> elementRel && fillType === 'slice')) {
this.transformCanvas.tx = (elementWidth - this.transformCanvas.w * (elementHeight / this.transformCanvas.h)) * this.renderConfig.dpr
} else {
this.transformCanvas.tx = 0
}
if (yPos === 'YMid' && (animationRel> elementRel && fillType === 'meet' || animationRel < elementRel && fillType === 'slice')) { this.transformCanvas.ty = (elementHeight - this.transformCanvas.h * (elementWidth / this.transformCanvas.w)) / 2 * this.renderConfig.dpr } else if (yPos === 'YMax' && (animationRel> elementRel && fillType === 'meet' || animationRel < elementRel && fillType === 'slice')) { this.transformCanvas.ty = (elementHeight - this.transformCanvas.h * (elementWidth / this.transformCanvas.w)) * this.renderConfig.dpr } else { this.transformCanvas.ty = 0 } } else if (this.renderConfig.preserveAspectRatio === 'none') { this.transformCanvas.sx = elementWidth / (this.transformCanvas.w / this.renderConfig.dpr); this.transformCanvas.sy = elementHeight / (this.transformCanvas.h / this.renderConfig.dpr); this.transformCanvas.tx = 0; this.transformCanvas.ty = 0 } else { this.transformCanvas.sx = this.renderConfig.dpr; this.transformCanvas.sy = this.renderConfig.dpr; this.transformCanvas.tx = 0; this.transformCanvas.ty = 0 } this.transformCanvas.props = [this.transformCanvas.sx, 0, 0, 0, 0, this.transformCanvas.sy, 0, 0, 0, 0, 1, 0, this.transformCanvas.tx, this.transformCanvas.ty, 0, 1]; this.ctxTransform(this.transformCanvas.props); this.canvasContext.beginPath(); this.canvasContext.rect(0, 0, this.transformCanvas.w, this.transformCanvas.h); this.canvasContext.closePath(); this.canvasContext.clip(); this.renderFrame(this.renderedFrame, true) }; CanvasRendererBase.prototype.destroy = function () { if (this.renderConfig.clearCanvas && this.animationItem.wrapper) { this.animationItem.wrapper.innerText = '' } var i; var len = this.layers ? this.layers.length : 0; for (i = len - 1; i>= 0; i -= 1) {
if (this.elements[i]) {
this.elements[i].destroy()
}
}
this.elements.length = 0;
this.globalData.canvasContext = null;
this.animationItem.container = null;
this.destroyed = true
};
CanvasRendererBase.prototype.renderFrame = function (num, forceRender) {
if (this.renderedFrame === num && this.renderConfig.clearCanvas === true && !forceRender || this.destroyed || num === -1) {
return
}
this.renderedFrame = num;
this.globalData.frameNum = num - this.animationItem._isFirstFrame;
this.globalData.frameId += 1;
this.globalData._mdf = !this.renderConfig.clearCanvas || forceRender;
this.globalData.projectInterface.currentFrame = num;
var i;
var len = this.layers.length;
if (!this.completeLayers) {
this.checkLayers(num)
}
for (i = 0; i < len; i += 1) { if (this.completeLayers || this.elements[i]) { this.elements[i].prepareFrame(num - this.layers[i].st) } } if (this.globalData._mdf) { if (this.renderConfig.clearCanvas === true) { this.canvasContext.clearRect(0, 0, this.transformCanvas.w, this.transformCanvas.h) } else { this.save() } for (i = len - 1; i>= 0; i -= 1) {
if (this.completeLayers || this.elements[i]) {
this.elements[i].renderFrame()
}
}
if (this.renderConfig.clearCanvas !== true) {
this.restore()
}
}
};
CanvasRendererBase.prototype.buildItem = function (pos) {
var elements = this.elements;
if (elements[pos] || this.layers[pos].ty === 99) {
return
}
var element = this.createItem(this.layers[pos], this, this.globalData);
elements[pos] = element;
element.initExpressions()
};
CanvasRendererBase.prototype.checkPendingElements = function () {
while (this.pendingElements.length) {
var element = this.pendingElements.pop();
element.checkParenting()
}
};
CanvasRendererBase.prototype.hide = function () {
this.animationItem.container.style.display = 'none'
};
CanvasRendererBase.prototype.show = function () {
this.animationItem.container.style.display = 'block'
};
function CVCompElement(data, globalData, comp) {
this.completeLayers = false;
this.layers = data.layers;
this.pendingElements = [];
this.elements = createSizedArray(this.layers.length);
this.initElement(data, globalData, comp);
this.tm = data.tm ? PropertyFactory.getProp(this, data.tm, 0, globalData.frameRate, this) : {
_placeholder: true
}
}
extendPrototype([CanvasRendererBase, ICompElement, CVBaseElement], CVCompElement);
CVCompElement.prototype.renderInnerContent = function () {
var ctx = this.canvasContext;
ctx.beginPath();
ctx.moveTo(0, 0);
ctx.lineTo(this.data.w, 0);
ctx.lineTo(this.data.w, this.data.h);
ctx.lineTo(0, this.data.h);
ctx.lineTo(0, 0);
ctx.clip();
var i;
var len = this.layers.length;
for (i = len - 1; i>= 0; i -= 1) {
if (this.completeLayers || this.elements[i]) {
this.elements[i].renderFrame()
}
}
};
CVCompElement.prototype.destroy = function () {
var i;
var len = this.layers.length;
for (i = len - 1; i>= 0; i -= 1) {
if (this.elements[i]) {
this.elements[i].destroy()
}
}
this.layers = null;
this.elements = null
};
CVCompElement.prototype.createComp = function (data) {
return new CVCompElement(data, this.globalData, this)
};
function CanvasRenderer(animationItem, config) {
this.animationItem = animationItem;
this.renderConfig = {
clearCanvas: config && config.clearCanvas !== undefined ? config.clearCanvas : true,
context: config && config.context || null,
progressiveLoad: config && config.progressiveLoad || false,
preserveAspectRatio: config && config.preserveAspectRatio || 'xMidYMid meet',
imagePreserveAspectRatio: config && config.imagePreserveAspectRatio || 'xMidYMid slice',
contentVisibility: config && config.contentVisibility || 'visible',
className: config && config.className || '',
id: config && config.id || ''
};
this.renderConfig.dpr = config && config.dpr || 1;
if (this.animationItem.wrapper) {
this.renderConfig.dpr = config && config.dpr || window.devicePixelRatio || 1
}
this.renderedFrame = -1;
this.globalData = {
frameNum: -1,
_mdf: false,
renderConfig: this.renderConfig,
currentGlobalAlpha: -1
};
this.contextData = new CVContextData();
this.elements = [];
this.pendingElements = [];
this.transformMat = new Matrix();
this.completeLayers = false;
this.rendererType = 'canvas'
}
extendPrototype([CanvasRendererBase], CanvasRenderer);
CanvasRenderer.prototype.createComp = function (data) {
return new CVCompElement(data, this.globalData, this)
};
function HBaseElement() {}
HBaseElement.prototype = {
checkBlendMode: function checkBlendMode() {},
initRendererElement: function initRendererElement() {
this.baseElement = createTag(this.data.tg || 'div');
if (this.data.hasMask) {
this.svgElement = createNS('svg');
this.layerElement = createNS('g');
this.maskedElement = this.layerElement;
this.svgElement.appendChild(this.layerElement);
this.baseElement.appendChild(this.svgElement)
} else {
this.layerElement = this.baseElement
}
styleDiv(this.baseElement)
},
createContainerElements: function createContainerElements() {
this.renderableEffectsManager = new CVEffects(this);
this.transformedElement = this.baseElement;
this.maskedElement = this.layerElement;
if (this.data.ln) {
this.layerElement.setAttribute('id', this.data.ln)
}
if (this.data.cl) {
this.layerElement.setAttribute('class', this.data.cl)
}
if (this.data.bm !== 0) {
this.setBlendMode()
}
},
renderElement: function renderElement() {
var transformedElementStyle = this.transformedElement ? this.transformedElement.style : {};
if (this.finalTransform._matMdf) {
var matrixValue = this.finalTransform.mat.toCSS();
transformedElementStyle.transform = matrixValue;
transformedElementStyle.webkitTransform = matrixValue
}
if (this.finalTransform._opMdf) {
transformedElementStyle.opacity = this.finalTransform.mProp.o.v
}
},
renderFrame: function renderFrame() {
if (this.data.hd || this.hidden) {
return
}
this.renderTransform();
this.renderRenderable();
this.renderElement();
this.renderInnerContent();
if (this._isFirstFrame) {
this._isFirstFrame = false
}
},
destroy: function destroy() {
this.layerElement = null;
this.transformedElement = null;
if (this.matteElement) {
this.matteElement = null
}
if (this.maskManager) {
this.maskManager.destroy();
this.maskManager = null
}
},
createRenderableComponents: function createRenderableComponents() {
this.maskManager = new MaskElement(this.data, this, this.globalData)
},
addEffects: function addEffects() {},
setMatte: function setMatte() {}
};
HBaseElement.prototype.getBaseElement = SVGBaseElement.prototype.getBaseElement;
HBaseElement.prototype.destroyBaseElement = HBaseElement.prototype.destroy;
HBaseElement.prototype.buildElementParenting = BaseRenderer.prototype.buildElementParenting;
function HSolidElement(data, globalData, comp) {
this.initElement(data, globalData, comp)
}
extendPrototype([BaseElement, TransformElement, HBaseElement, HierarchyElement, FrameElement, RenderableDOMElement], HSolidElement);
HSolidElement.prototype.createContent = function () {
var rect;
if (this.data.hasMask) {
rect = createNS('rect');
rect.setAttribute('width', this.data.sw);
rect.setAttribute('height', this.data.sh);
rect.setAttribute('fill', this.data.sc);
this.svgElement.setAttribute('width', this.data.sw);
this.svgElement.setAttribute('height', this.data.sh)
} else {
rect = createTag('div');
rect.style.width = this.data.sw + 'px';
rect.style.height = this.data.sh + 'px';
rect.style.backgroundColor = this.data.sc
}
this.layerElement.appendChild(rect)
};
function HShapeElement(data, globalData, comp) {
this.shapes = [];
this.shapesData = data.shapes;
this.stylesList = [];
this.shapeModifiers = [];
this.itemsData = [];
this.processedElements = [];
this.animatedContents = [];
this.shapesContainer = createNS('g');
this.initElement(data, globalData, comp);
this.prevViewData = [];
this.currentBBox = {
x: 999999,
y: -999999,
h: 0,
w: 0
}
}
extendPrototype([BaseElement, TransformElement, HSolidElement, SVGShapeElement, HBaseElement, HierarchyElement, FrameElement, RenderableElement], HShapeElement);
HShapeElement.prototype._renderShapeFrame = HShapeElement.prototype.renderInnerContent;
HShapeElement.prototype.createContent = function () {
var cont;
this.baseElement.style.fontSize = 0;
if (this.data.hasMask) {
this.layerElement.appendChild(this.shapesContainer);
cont = this.svgElement
} else {
cont = createNS('svg');
var size = this.comp.data ? this.comp.data : this.globalData.compSize;
cont.setAttribute('width', size.w);
cont.setAttribute('height', size.h);
cont.appendChild(this.shapesContainer);
this.layerElement.appendChild(cont)
}
this.searchShapes(this.shapesData, this.itemsData, this.prevViewData, this.shapesContainer, 0, [], true);
this.filterUniqueShapes();
this.shapeCont = cont
};
HShapeElement.prototype.getTransformedPoint = function (transformers, point) {
var i;
var len = transformers.length;
for (i = 0; i < len; i += 1) { point = transformers[i].mProps.v.applyToPointArray(point[0], point[1], 0) } return point }; HShapeElement.prototype.calculateShapeBoundingBox = function (item, boundingBox) { var shape = item.sh.v; var transformers = item.transformers; var i; var len = shape._length; var vPoint; var oPoint; var nextIPoint; var nextVPoint; if (len <= 1) { return } for (i = 0; i < len - 1; i += 1) { vPoint = this.getTransformedPoint(transformers, shape.v[i]); oPoint = this.getTransformedPoint(transformers, shape.o[i]); nextIPoint = this.getTransformedPoint(transformers, shape.i[i + 1]); nextVPoint = this.getTransformedPoint(transformers, shape.v[i + 1]); this.checkBounds(vPoint, oPoint, nextIPoint, nextVPoint, boundingBox) } if (shape.c) { vPoint = this.getTransformedPoint(transformers, shape.v[i]); oPoint = this.getTransformedPoint(transformers, shape.o[i]); nextIPoint = this.getTransformedPoint(transformers, shape.i[0]); nextVPoint = this.getTransformedPoint(transformers, shape.v[0]); this.checkBounds(vPoint, oPoint, nextIPoint, nextVPoint, boundingBox) } }; HShapeElement.prototype.checkBounds = function (vPoint, oPoint, nextIPoint, nextVPoint, boundingBox) { this.getBoundsOfCurve(vPoint, oPoint, nextIPoint, nextVPoint); var bounds = this.shapeBoundingBox; boundingBox.x = bmMin(bounds.left, boundingBox.x); boundingBox.xMax = bmMax(bounds.right, boundingBox.xMax); boundingBox.y = bmMin(bounds.top, boundingBox.y); boundingBox.yMax = bmMax(bounds.bottom, boundingBox.yMax) }; HShapeElement.prototype.shapeBoundingBox = { left: 0, right: 0, top: 0, bottom: 0 }; HShapeElement.prototype.tempBoundingBox = { x: 0, xMax: 0, y: 0, yMax: 0, width: 0, height: 0 }; HShapeElement.prototype.getBoundsOfCurve = function (p0, p1, p2, p3) { var bounds = [ [p0[0], p3[0]], [p0[1], p3[1]] ]; for (var a, b, c, t, b2ac, t1, t2, i = 0; i < 2; ++i) { b = 6 * p0[i] - 12 * p1[i] + 6 * p2[i]; a = -3 * p0[i] + 9 * p1[i] - 9 * p2[i] + 3 * p3[i]; c = 3 * p1[i] - 3 * p0[i]; b |= 0; a |= 0; c |= 0; if (a === 0 && b === 0) {} else if (a === 0) { t = -c / b; if (t> 0 && t < 1) { bounds[i].push(this.calculateF(t, p0, p1, p2, p3, i)) } } else { b2ac = b * b - 4 * c * a; if (b2ac>= 0) {
t1 = (-b + bmSqrt(b2ac)) / (2 * a);
if (t1> 0 && t1 < 1) bounds[i].push(this.calculateF(t1, p0, p1, p2, p3, i)); t2 = (-b - bmSqrt(b2ac)) / (2 * a); if (t2> 0 && t2 < 1) bounds[i].push(this.calculateF(t2, p0, p1, p2, p3, i)) } } } this.shapeBoundingBox.left = bmMin.apply(null, bounds[0]); this.shapeBoundingBox.top = bmMin.apply(null, bounds[1]); this.shapeBoundingBox.right = bmMax.apply(null, bounds[0]); this.shapeBoundingBox.bottom = bmMax.apply(null, bounds[1]) }; HShapeElement.prototype.calculateF = function (t, p0, p1, p2, p3, i) { return bmPow(1 - t, 3) * p0[i] + 3 * bmPow(1 - t, 2) * t * p1[i] + 3 * (1 - t) * bmPow(t, 2) * p2[i] + bmPow(t, 3) * p3[i] }; HShapeElement.prototype.calculateBoundingBox = function (itemsData, boundingBox) { var i; var len = itemsData.length; for (i = 0; i < len; i += 1) { if (itemsData[i] && itemsData[i].sh) { this.calculateShapeBoundingBox(itemsData[i], boundingBox) } else if (itemsData[i] && itemsData[i].it) { this.calculateBoundingBox(itemsData[i].it, boundingBox) } else if (itemsData[i] && itemsData[i].style && itemsData[i].w) { this.expandStrokeBoundingBox(itemsData[i].w, boundingBox) } } }; HShapeElement.prototype.expandStrokeBoundingBox = function (widthProperty, boundingBox) { var width = 0; if (widthProperty.keyframes) { for (var i = 0; i < widthProperty.keyframes.length; i += 1) { var kfw = widthProperty.keyframes[i].s; if (kfw> width) {
width = kfw
}
}
width *= widthProperty.mult
} else {
width = widthProperty.v * widthProperty.mult
}
boundingBox.x -= width;
boundingBox.xMax += width;
boundingBox.y -= width;
boundingBox.yMax += width
};
HShapeElement.prototype.currentBoxContains = function (box) {
return this.currentBBox.x <= box.x && this.currentBBox.y <= box.y && this.currentBBox.width + this.currentBBox.x>= box.x + box.width && this.currentBBox.height + this.currentBBox.y>= box.y + box.height
};
HShapeElement.prototype.renderInnerContent = function () {
this._renderShapeFrame();
if (!this.hidden && (this._isFirstFrame || this._mdf)) {
var tempBoundingBox = this.tempBoundingBox;
var max = 999999;
tempBoundingBox.x = max;
tempBoundingBox.xMax = -max;
tempBoundingBox.y = max;
tempBoundingBox.yMax = -max;
this.calculateBoundingBox(this.itemsData, tempBoundingBox);
tempBoundingBox.width = tempBoundingBox.xMax < tempBoundingBox.x ? 0 : tempBoundingBox.xMax - tempBoundingBox.x; tempBoundingBox.height = tempBoundingBox.yMax < tempBoundingBox.y ? 0 : tempBoundingBox.yMax - tempBoundingBox.y; if (this.currentBoxContains(tempBoundingBox)) { return } var changed = false; if (this.currentBBox.w !== tempBoundingBox.width) { this.currentBBox.w = tempBoundingBox.width; this.shapeCont.setAttribute('height', tempBoundingBox.height); changed = true } if (changed || this.currentBBox.x !== tempBoundingBox.x || this.currentBBox.y !== tempBoundingBox.y) { this.currentBBox.w = tempBoundingBox.width; this.currentBBox.h = tempBoundingBox.height; this.currentBBox.x = tempBoundingBox.x; this.currentBBox.y = tempBoundingBox.y; this.shapeCont.setAttribute('viewBox', this.currentBBox.x + ' ' + this.currentBBox.y + ' ' + this.currentBBox.w + ' ' + this.currentBBox.h); var shapeStyle = this.shapeCont.style; var shapeTransform = 'translate(' + this.currentBBox.x + 'px,' + this.currentBBox.y + 'px)'; shapeStyle.transform = shapeTransform; shapeStyle.webkitTransform = shapeTransform } } }; function HTextElement(data, globalData, comp) { this.textSpans = []; this.textPaths = []; this.currentBBox = { x: 999999, y: -999999, h: 0, w: 0 }; this.renderType = 'svg'; this.isMasked = false; this.initElement(data, globalData, comp) } extendPrototype([BaseElement, TransformElement, HBaseElement, HierarchyElement, FrameElement, RenderableDOMElement, ITextElement], HTextElement); HTextElement.prototype.createContent = function () { this.isMasked = this.checkMasks(); if (this.isMasked) { this.renderType = 'svg'; this.compW = this.comp.data.w; this.compH = this.comp.data.h; this.svgElement.setAttribute('width', this.compW); this.svgElement.setAttribute('height', this.compH); var g = createNS('g'); this.maskedElement.appendChild(g); this.innerElem = g } else { this.renderType = 'html'; this.innerElem = this.layerElement } this.checkParenting() }; HTextElement.prototype.buildNewText = function () { var documentData = this.textProperty.currentData; this.renderedLetters = createSizedArray(documentData.l ? documentData.l.length : 0); var innerElemStyle = this.innerElem.style; var textColor = documentData.fc ? this.buildColor(documentData.fc) : 'rgba(0,0,0,0)'; innerElemStyle.fill = textColor; innerElemStyle.color = textColor; if (documentData.sc) { innerElemStyle.stroke = this.buildColor(documentData.sc); innerElemStyle.strokeWidth = documentData.sw + 'px' } var fontData = this.globalData.fontManager.getFontByName(documentData.f); if (!this.globalData.fontManager.chars) { innerElemStyle.fontSize = documentData.finalSize + 'px'; innerElemStyle.lineHeight = documentData.finalSize + 'px'; if (fontData.fClass) { this.innerElem.className = fontData.fClass } else { innerElemStyle.fontFamily = fontData.fFamily; var fWeight = documentData.fWeight; var fStyle = documentData.fStyle; innerElemStyle.fontStyle = fStyle; innerElemStyle.fontWeight = fWeight } } var i; var len; var letters = documentData.l; len = letters.length; var tSpan; var tParent; var tCont; var matrixHelper = this.mHelper; var shapes; var shapeStr = ''; var cnt = 0; for (i = 0; i < len; i += 1) { if (this.globalData.fontManager.chars) { if (!this.textPaths[cnt]) { tSpan = createNS('path'); tSpan.setAttribute('stroke-linecap', lineCapEnum[1]); tSpan.setAttribute('stroke-linejoin', lineJoinEnum[2]); tSpan.setAttribute('stroke-miterlimit', '4') } else { tSpan = this.textPaths[cnt] } if (!this.isMasked) { if (this.textSpans[cnt]) { tParent = this.textSpans[cnt]; tCont = tParent.children[0] } else { tParent = createTag('div'); tParent.style.lineHeight = 0; tCont = createNS('svg'); tCont.appendChild(tSpan); styleDiv(tParent) } } } else if (!this.isMasked) { if (this.textSpans[cnt]) { tParent = this.textSpans[cnt]; tSpan = this.textPaths[cnt] } else { tParent = createTag('span'); styleDiv(tParent); tSpan = createTag('span'); styleDiv(tSpan); tParent.appendChild(tSpan) } } else { tSpan = this.textPaths[cnt] ? this.textPaths[cnt] : createNS('text') } if (this.globalData.fontManager.chars) { var charData = this.globalData.fontManager.getCharData(documentData.finalText[i], fontData.fStyle, this.globalData.fontManager.getFontByName(documentData.f).fFamily); var shapeData; if (charData) { shapeData = charData.data } else { shapeData = null } matrixHelper.reset(); if (shapeData && shapeData.shapes && shapeData.shapes.length) { shapes = shapeData.shapes[0].it; matrixHelper.scale(documentData.finalSize / 100, documentData.finalSize / 100); shapeStr = this.createPathShape(matrixHelper, shapes); tSpan.setAttribute('d', shapeStr) } if (!this.isMasked) { this.innerElem.appendChild(tParent); if (shapeData && shapeData.shapes) { document.body.appendChild(tCont); var boundingBox = tCont.getBBox(); tCont.setAttribute('height', boundingBox.height + 2); tCont.setAttribute('viewBox', boundingBox.x - 1 + ' ' + (boundingBox.y - 1) + ' ' + (boundingBox.width + 2) + ' ' + (boundingBox.height + 2)); var tContStyle = tCont.style; var tContTranslation = 'translate(' + (boundingBox.x - 1) + 'px,' + (boundingBox.y - 1) + 'px)'; tContStyle.transform = tContTranslation; tContStyle.webkitTransform = tContTranslation; letters[i].yOffset = boundingBox.y - 1 } else { tCont.setAttribute('width', 1); tCont.setAttribute('height', 1) } tParent.appendChild(tCont) } else { this.innerElem.appendChild(tSpan) } } else { tSpan.textContent = letters[i].val; tSpan.setAttributeNS('http://www.w3.org/XML/1998/namespace', 'xml:space', 'preserve'); if (!this.isMasked) { this.innerElem.appendChild(tParent); var tStyle = tSpan.style; var tSpanTranslation = 'translate3d(0,' + -documentData.finalSize / 1.2 + 'px,0)'; tStyle.transform = tSpanTranslation; tStyle.webkitTransform = tSpanTranslation } else { this.innerElem.appendChild(tSpan) } } if (!this.isMasked) { this.textSpans[cnt] = tParent } else { this.textSpans[cnt] = tSpan } this.textSpans[cnt].style.display = 'block'; this.textPaths[cnt] = tSpan; cnt += 1 } while (cnt < this.textSpans.length) { this.textSpans[cnt].style.display = 'none'; cnt += 1 } }; HTextElement.prototype.renderInnerContent = function () { var svgStyle; if (this.data.singleShape) { if (!this._isFirstFrame && !this.lettersChangedFlag) { return } if (this.isMasked && this.finalTransform._matMdf) { this.svgElement.setAttribute('viewBox', -this.finalTransform.mProp.p.v[0] + ' ' + -this.finalTransform.mProp.p.v[1] + ' ' + this.compW + ' ' + this.compH); svgStyle = this.svgElement.style; var translation = 'translate(' + -this.finalTransform.mProp.p.v[0] + 'px,' + -this.finalTransform.mProp.p.v[1] + 'px)'; svgStyle.transform = translation; svgStyle.webkitTransform = translation } } this.textAnimator.getMeasures(this.textProperty.currentData, this.lettersChangedFlag); if (!this.lettersChangedFlag && !this.textAnimator.lettersChangedFlag) { return } var i; var len; var count = 0; var renderedLetters = this.textAnimator.renderedLetters; var letters = this.textProperty.currentData.l; len = letters.length; var renderedLetter; var textSpan; var textPath; for (i = 0; i < len; i += 1) { if (letters[i].n) { count += 1 } else { textSpan = this.textSpans[i]; textPath = this.textPaths[i]; renderedLetter = renderedLetters[count]; count += 1; if (renderedLetter._mdf.m) { if (!this.isMasked) { textSpan.style.webkitTransform = renderedLetter.m; textSpan.style.transform = renderedLetter.m } else { textSpan.setAttribute('transform', renderedLetter.m) } } textSpan.style.opacity = renderedLetter.o; if (renderedLetter.sw && renderedLetter._mdf.sw) { textPath.setAttribute('stroke-stroke', renderedLetter.sc) } if (renderedLetter.fc && renderedLetter._mdf.fc) { textPath.setAttribute('fill', renderedLetter.fc); textPath.style.color = renderedLetter.fc } } } if (this.innerElem.getBBox && !this.hidden && (this._isFirstFrame || this._mdf)) { var boundingBox = this.innerElem.getBBox(); if (this.currentBBox.w !== boundingBox.width) { this.currentBBox.w = boundingBox.width; this.svgElement.setAttribute('width', boundingBox.width) } if (this.currentBBox.h !== boundingBox.height) { this.currentBBox.h = boundingBox.height; this.svgElement.setAttribute('height', boundingBox.height) } var margin = 1; if (this.currentBBox.w !== boundingBox.width + margin * 2 || this.currentBBox.h !== boundingBox.height + margin * 2 || this.currentBBox.x !== boundingBox.x - margin || this.currentBBox.y !== boundingBox.y - margin) { this.currentBBox.w = boundingBox.width + margin * 2; this.currentBBox.h = boundingBox.height + margin * 2; this.currentBBox.x = boundingBox.x - margin; this.currentBBox.y = boundingBox.y - margin; this.svgElement.setAttribute('viewBox', this.currentBBox.x + ' ' + this.currentBBox.y + ' ' + this.currentBBox.w + ' ' + this.currentBBox.h); svgStyle = this.svgElement.style; var svgTransform = 'translate(' + this.currentBBox.x + 'px,' + this.currentBBox.y + 'px)'; svgStyle.transform = svgTransform; svgStyle.webkitTransform = svgTransform } } }; function HCameraElement(data, globalData, comp) { this.initFrame(); this.initBaseData(data, globalData, comp); this.initHierarchy(); var getProp = PropertyFactory.getProp; this.pe = getProp(this, data.pe, 0, 0, this); if (data.ks.p.s) { this.px = getProp(this, data.ks.p.x, 1, 0, this); this.py = getProp(this, data.ks.p.y, 1, 0, this); this.pz = getProp(this, data.ks.p.z, 1, 0, this) } else { this.p = getProp(this, data.ks.p, 1, 0, this) } if (data.ks.a) { this.a = getProp(this, data.ks.a, 1, 0, this) } if (data.ks.or.k.length && data.ks.or.k[0].to) { var i; var len = data.ks.or.k.length; for (i = 0; i < len; i += 1) { data.ks.or.k[i].to = null; data.ks.or.k[i].ti = null } } this.or = getProp(this, data.ks.or, 1, degToRads, this); this.or.sh = true; this.rx = getProp(this, data.ks.rx, 0, degToRads, this); this.ry = getProp(this, data.ks.ry, 0, degToRads, this); this.rz = getProp(this, data.ks.rz, 0, degToRads, this); this.mat = new Matrix(); this._prevMat = new Matrix(); this._isFirstFrame = true; this.finalTransform = { mProp: this } } extendPrototype([BaseElement, FrameElement, HierarchyElement], HCameraElement); HCameraElement.prototype.setup = function () { var i; var len = this.comp.threeDElements.length; var comp; var perspectiveStyle; var containerStyle; for (i = 0; i < len; i += 1) { comp = this.comp.threeDElements[i]; if (comp.type === '3d') { perspectiveStyle = comp.perspectiveElem.style; containerStyle = comp.container.style; var perspective = this.pe.v + 'px'; var origin = '0px 0px 0px'; var matrix = 'matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1)'; perspectiveStyle.perspective = perspective; perspectiveStyle.webkitPerspective = perspective; containerStyle.transformOrigin = origin; containerStyle.mozTransformOrigin = origin; containerStyle.webkitTransformOrigin = origin; perspectiveStyle.transform = matrix; perspectiveStyle.webkitTransform = matrix } } }; HCameraElement.prototype.createElements = function () {}; HCameraElement.prototype.hide = function () {}; HCameraElement.prototype.renderFrame = function () { var _mdf = this._isFirstFrame; var i; var len; if (this.hierarchy) { len = this.hierarchy.length; for (i = 0; i < len; i += 1) { _mdf = this.hierarchy[i].finalTransform.mProp._mdf || _mdf } } if (_mdf || this.pe._mdf || this.p && this.p._mdf || this.px && (this.px._mdf || this.py._mdf || this.pz._mdf) || this.rx._mdf || this.ry._mdf || this.rz._mdf || this.or._mdf || this.a && this.a._mdf) { this.mat.reset(); if (this.hierarchy) { len = this.hierarchy.length - 1; for (i = len; i>= 0; i -= 1) {
var mTransf = this.hierarchy[i].finalTransform.mProp;
this.mat.translate(-mTransf.p.v[0], -mTransf.p.v[1], mTransf.p.v[2]);
this.mat.rotateX(-mTransf.or.v[0]).rotateY(-mTransf.or.v[1]).rotateZ(mTransf.or.v[2]);
this.mat.rotateX(-mTransf.rx.v).rotateY(-mTransf.ry.v).rotateZ(mTransf.rz.v);
this.mat.scale(1 / mTransf.s.v[0], 1 / mTransf.s.v[1], 1 / mTransf.s.v[2]);
this.mat.translate(mTransf.a.v[0], mTransf.a.v[1], mTransf.a.v[2])
}
}
if (this.p) {
this.mat.translate(-this.p.v[0], -this.p.v[1], this.p.v[2])
} else {
this.mat.translate(-this.px.v, -this.py.v, this.pz.v)
}
if (this.a) {
var diffVector;
if (this.p) {
diffVector = [this.p.v[0] - this.a.v[0], this.p.v[1] - this.a.v[1], this.p.v[2] - this.a.v[2]]
} else {
diffVector = [this.px.v - this.a.v[0], this.py.v - this.a.v[1], this.pz.v - this.a.v[2]]
}
var mag = Math.sqrt(Math.pow(diffVector[0], 2) + Math.pow(diffVector[1], 2) + Math.pow(diffVector[2], 2));
var lookDir = [diffVector[0] / mag, diffVector[1] / mag, diffVector[2] / mag];
var lookLengthOnXZ = Math.sqrt(lookDir[2] * lookDir[2] + lookDir[0] * lookDir[0]);
var mRotationX = Math.atan2(lookDir[1], lookLengthOnXZ);
var mRotationY = Math.atan2(lookDir[0], -lookDir[2]);
this.mat.rotateY(mRotationY).rotateX(-mRotationX)
}
this.mat.rotateX(-this.rx.v).rotateY(-this.ry.v).rotateZ(this.rz.v);
this.mat.rotateX(-this.or.v[0]).rotateY(-this.or.v[1]).rotateZ(this.or.v[2]);
this.mat.translate(this.globalData.compSize.w / 2, this.globalData.compSize.h / 2, 0);
this.mat.translate(0, 0, this.pe.v);
var hasMatrixChanged = !this._prevMat.equals(this.mat);
if ((hasMatrixChanged || this.pe._mdf) && this.comp.threeDElements) {
len = this.comp.threeDElements.length;
var comp;
var perspectiveStyle;
var containerStyle;
for (i = 0; i < len; i += 1) { comp = this.comp.threeDElements[i]; if (comp.type === '3d') { if (hasMatrixChanged) { var matValue = this.mat.toCSS(); containerStyle = comp.container.style; containerStyle.transform = matValue; containerStyle.webkitTransform = matValue } if (this.pe._mdf) { perspectiveStyle = comp.perspectiveElem.style; perspectiveStyle.perspective = this.pe.v + 'px'; perspectiveStyle.webkitPerspective = this.pe.v + 'px' } } } this.mat.clone(this._prevMat) } } this._isFirstFrame = false }; HCameraElement.prototype.prepareFrame = function (num) { this.prepareProperties(num, true) }; HCameraElement.prototype.destroy = function () {}; HCameraElement.prototype.getBaseElement = function () { return null }; function HImageElement(data, globalData, comp) { this.assetData = globalData.getAssetData(data.refId); this.initElement(data, globalData, comp) } extendPrototype([BaseElement, TransformElement, HBaseElement, HSolidElement, HierarchyElement, FrameElement, RenderableElement], HImageElement); HImageElement.prototype.createContent = function () { var assetPath = this.globalData.getAssetsPath(this.assetData); var img = new Image(); if (this.data.hasMask) { this.imageElem = createNS('image'); this.imageElem.setAttribute('px'); this.imageElem.setAttribute('height', this.assetData.h + 'px'); this.imageElem.setAttributeNS('http://www.w3.org/1999/xlink', 'href', assetPath); this.layerElement.appendChild(this.imageElem); this.baseElement.setAttribute('width', this.assetData.w); this.baseElement.setAttribute('height', this.assetData.h) } else { this.layerElement.appendChild(img) } img.crossOrigin = 'anonymous'; img.src = assetPath; if (this.data.ln) { this.baseElement.setAttribute('id', this.data.ln) } }; function HybridRendererBase(animationItem, config) { this.animationItem = animationItem; this.layers = null; this.renderedFrame = -1; this.renderConfig = { className: config && config.className || '', imagePreserveAspectRatio: config && config.imagePreserveAspectRatio || 'xMidYMid slice', hideOnTransparent: !(config && config.hideOnTransparent === false), filterSize: { width: config && config.filterSize && config.filterSize.width || '400%', height: config && config.filterSize && config.filterSize.height || '400%', x: config && config.filterSize && config.filterSize.x || '-100%', y: config && config.filterSize && config.filterSize.y || '-100%' } }; this.globalData = { _mdf: false, frameNum: -1, renderConfig: this.renderConfig }; this.pendingElements = []; this.elements = []; this.threeDElements = []; this.destroyed = false; this.camera = null; this.supports3d = true; this.rendererType = 'html' } extendPrototype([BaseRenderer], HybridRendererBase); HybridRendererBase.prototype.buildItem = SVGRenderer.prototype.buildItem; HybridRendererBase.prototype.checkPendingElements = function () { while (this.pendingElements.length) { var element = this.pendingElements.pop(); element.checkParenting() } }; HybridRendererBase.prototype.appendElementInPos = function (element, pos) { var newDOMElement = element.getBaseElement(); if (!newDOMElement) { return } var layer = this.layers[pos]; if (!layer.ddd || !this.supports3d) { if (this.threeDElements) { this.addTo3dContainer(newDOMElement, pos) } else { var i = 0; var nextDOMElement; var nextLayer; var tmpDOMElement; while (i < pos) { if (this.elements[i] && this.elements[i] !== true && this.elements[i].getBaseElement) { nextLayer = this.elements[i]; tmpDOMElement = this.layers[i].ddd ? this.getThreeDContainerByPos(i) : nextLayer.getBaseElement(); nextDOMElement = tmpDOMElement || nextDOMElement } i += 1 } if (nextDOMElement) { if (!layer.ddd || !this.supports3d) { this.layerElement.insertBefore(newDOMElement, nextDOMElement) } } else if (!layer.ddd || !this.supports3d) { this.layerElement.appendChild(newDOMElement) } } } else { this.addTo3dContainer(newDOMElement, pos) } }; HybridRendererBase.prototype.createShape = function (data) { if (!this.supports3d) { return new SVGShapeElement(data, this.globalData, this) } return new HShapeElement(data, this.globalData, this) }; HybridRendererBase.prototype.createText = function (data) { if (!this.supports3d) { return new SVGTextLottieElement(data, this.globalData, this) } return new HTextElement(data, this.globalData, this) }; HybridRendererBase.prototype.createCamera = function (data) { this.camera = new HCameraElement(data, this.globalData, this); return this.camera }; HybridRendererBase.prototype.createImage = function (data) { if (!this.supports3d) { return new IImageElement(data, this.globalData, this) } return new HImageElement(data, this.globalData, this) }; HybridRendererBase.prototype.createSolid = function (data) { if (!this.supports3d) { return new ISolidElement(data, this.globalData, this) } return new HSolidElement(data, this.globalData, this) }; HybridRendererBase.prototype.createNull = SVGRenderer.prototype.createNull; HybridRendererBase.prototype.getThreeDContainerByPos = function (pos) { var i = 0; var len = this.threeDElements.length; while (i < len) { if (this.threeDElements[i].startPos <= pos && this.threeDElements[i].endPos>= pos) {
return this.threeDElements[i].perspectiveElem
}
i += 1
}
return null
};
HybridRendererBase.prototype.createThreeDContainer = function (pos, type) {
var perspectiveElem = createTag('div');
var style;
var containerStyle;
styleDiv(perspectiveElem);
var container = createTag('div');
styleDiv(container);
if (type === '3d') {
style = perspectiveElem.style;
style.width = this.globalData.compSize.w + 'px';
style.height = this.globalData.compSize.h + 'px';
var center = '50% 50%';
style.webkitTransformOrigin = center;
style.mozTransformOrigin = center;
style.transformOrigin = center;
containerStyle = container.style;
var matrix = 'matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1)';
containerStyle.transform = matrix;
containerStyle.webkitTransform = matrix
}
perspectiveElem.appendChild(container);
var threeDContainerData = {
container: container,
perspectiveElem: perspectiveElem,
startPos: pos,
endPos: pos,
type: type
};
this.threeDElements.push(threeDContainerData);
return threeDContainerData
};
HybridRendererBase.prototype.build3dContainers = function () {
var i;
var len = this.layers.length;
var lastThreeDContainerData;
var currentContainer = '';
for (i = 0; i < len; i += 1) { if (this.layers[i].ddd && this.layers[i].ty !== 3) { if (currentContainer !== '3d') { currentContainer = '3d'; lastThreeDContainerData = this.createThreeDContainer(i, '3d') } lastThreeDContainerData.endPos = Math.max(lastThreeDContainerData.endPos, i) } else { if (currentContainer !== '2d') { currentContainer = '2d'; lastThreeDContainerData = this.createThreeDContainer(i, '2d') } lastThreeDContainerData.endPos = Math.max(lastThreeDContainerData.endPos, i) } } len = this.threeDElements.length; for (i = len - 1; i>= 0; i -= 1) {
this.resizerElem.appendChild(this.threeDElements[i].perspectiveElem)
}
};
HybridRendererBase.prototype.addTo3dContainer = function (elem, pos) {
var i = 0;
var len = this.threeDElements.length;
while (i < len) { if (pos <= this.threeDElements[i].endPos) { var j = this.threeDElements[i].startPos; var nextElement; while (j < pos) { if (this.elements[j] && this.elements[j].getBaseElement) { nextElement = this.elements[j].getBaseElement() } j += 1 } if (nextElement) { this.threeDElements[i].container.insertBefore(elem, nextElement) } else { this.threeDElements[i].container.appendChild(elem) } break } i += 1 } }; HybridRendererBase.prototype.configAnimation = function (animData) { var resizerElem = createTag('div'); var wrapper = this.animationItem.wrapper; var style = resizerElem.style; style.width = animData.w + 'px'; style.height = animData.h + 'px'; this.resizerElem = resizerElem; styleDiv(resizerElem); style.transformStyle = 'flat'; style.mozTransformStyle = 'flat'; style.webkitTransformStyle = 'flat'; if (this.renderConfig.className) { resizerElem.setAttribute('class', this.renderConfig.className) } wrapper.appendChild(resizerElem); style.overflow = 'hidden'; var svg = createNS('svg'); svg.setAttribute('1'); svg.setAttribute('height', '1'); styleDiv(svg); this.resizerElem.appendChild(svg); var defs = createNS('defs'); svg.appendChild(defs); this.data = animData; this.setupGlobalData(animData, svg); this.globalData.defs = defs; this.layers = animData.layers; this.layerElement = this.resizerElem; this.build3dContainers(); this.updateContainerSize() }; HybridRendererBase.prototype.destroy = function () { if (this.animationItem.wrapper) { this.animationItem.wrapper.innerText = '' } this.animationItem.container = null; this.globalData.defs = null; var i; var len = this.layers ? this.layers.length : 0; for (i = 0; i < len; i += 1) { this.elements[i].destroy() } this.elements.length = 0; this.destroyed = true; this.animationItem = null }; HybridRendererBase.prototype.updateContainerSize = function () { var elementWidth = this.animationItem.wrapper.offsetWidth; var elementHeight = this.animationItem.wrapper.offsetHeight; var elementRel = elementWidth / elementHeight; var animationRel = this.globalData.compSize.w / this.globalData.compSize.h; var sx; var sy; var tx; var ty; if (animationRel> elementRel) {
sx = elementWidth / this.globalData.compSize.w;
sy = elementWidth / this.globalData.compSize.w;
tx = 0;
ty = (elementHeight - this.globalData.compSize.h * (elementWidth / this.globalData.compSize.w)) / 2
} else {
sx = elementHeight / this.globalData.compSize.h;
sy = elementHeight / this.globalData.compSize.h;
tx = (elementWidth - this.globalData.compSize.w * (elementHeight / this.globalData.compSize.h)) / 2;
ty = 0
}
var style = this.resizerElem.style;
style.webkitTransform = 'matrix3d(' + sx + ',0,0,0,0,' + sy + ',0,0,0,0,1,0,' + tx + ',' + ty + ',0,1)';
style.transform = style.webkitTransform
};
HybridRendererBase.prototype.renderFrame = SVGRenderer.prototype.renderFrame;
HybridRendererBase.prototype.hide = function () {
this.resizerElem.style.display = 'none'
};
HybridRendererBase.prototype.show = function () {
this.resizerElem.style.display = 'block'
};
HybridRendererBase.prototype.initItems = function () {
this.buildAllItems();
if (this.camera) {
this.camera.setup()
} else {
var cWidth = this.globalData.compSize.w;
var cHeight = this.globalData.compSize.h;
var i;
var len = this.threeDElements.length;
for (i = 0; i < len; i += 1) { var style = this.threeDElements[i].perspectiveElem.style; style.webkitPerspective = Math.sqrt(Math.pow(cWidth, 2) + Math.pow(cHeight, 2)) + 'px'; style.perspective = style.webkitPerspective } } }; HybridRendererBase.prototype.searchExtraCompositions = function (assets) { var i; var len = assets.length; var floatingContainer = createTag('div'); for (i = 0; i < len; i += 1) { if (assets[i].xt) { var comp = this.createComp(assets[i], floatingContainer, this.globalData.comp, null); comp.initExpressions(); this.globalData.projectInterface.registerComposition(comp) } } }; function HCompElement(data, globalData, comp) { this.layers = data.layers; this.supports3d = !data.hasMask; this.completeLayers = false; this.pendingElements = []; this.elements = this.layers ? createSizedArray(this.layers.length) : []; this.initElement(data, globalData, comp); this.tm = data.tm ? PropertyFactory.getProp(this, data.tm, 0, globalData.frameRate, this) : { _placeholder: true } } extendPrototype([HybridRendererBase, ICompElement, HBaseElement], HCompElement); HCompElement.prototype._createBaseContainerElements = HCompElement.prototype.createContainerElements; HCompElement.prototype.createContainerElements = function () { this._createBaseContainerElements(); if (this.data.hasMask) { this.svgElement.setAttribute('height', this.data.h); this.transformedElement = this.baseElement } else { this.transformedElement = this.layerElement } }; HCompElement.prototype.addTo3dContainer = function (elem, pos) { var j = 0; var nextElement; while (j < pos) { if (this.elements[j] && this.elements[j].getBaseElement) { nextElement = this.elements[j].getBaseElement() } j += 1 } if (nextElement) { this.layerElement.insertBefore(elem, nextElement) } else { this.layerElement.appendChild(elem) } }; HCompElement.prototype.createComp = function (data) { if (!this.supports3d) { return new SVGCompElement(data, this.globalData, this) } return new HCompElement(data, this.globalData, this) }; function HybridRenderer(animationItem, config) { this.animationItem = animationItem; this.layers = null; this.renderedFrame = -1; this.renderConfig = { className: config && config.className || '', imagePreserveAspectRatio: config && config.imagePreserveAspectRatio || 'xMidYMid slice', hideOnTransparent: !(config && config.hideOnTransparent === false), filterSize: { width: config && config.filterSize && config.filterSize.width || '400%', height: config && config.filterSize && config.filterSize.height || '400%', x: config && config.filterSize && config.filterSize.x || '-100%', y: config && config.filterSize && config.filterSize.y || '-100%' } }; this.globalData = { _mdf: false, frameNum: -1, renderConfig: this.renderConfig }; this.pendingElements = []; this.elements = []; this.threeDElements = []; this.destroyed = false; this.camera = null; this.supports3d = true; this.rendererType = 'html' } extendPrototype([HybridRendererBase], HybridRenderer); HybridRenderer.prototype.createComp = function (data) { if (!this.supports3d) { return new SVGCompElement(data, this.globalData, this) } return new HCompElement(data, this.globalData, this) }; var Expressions = function () { var ob = {}; ob.initExpressions = initExpressions; function initExpressions(animation) { var stackCount = 0; var registers = []; function pushExpression() { stackCount += 1 } function popExpression() { stackCount -= 1; if (stackCount === 0) { releaseInstances() } } function registerExpressionProperty(expression) { if (registers.indexOf(expression) === -1) { registers.push(expression) } } function releaseInstances() { var i; var len = registers.length; for (i = 0; i < len; i += 1) { registers[i].release() } registers.length = 0 } animation.renderer.compInterface = CompExpressionInterface(animation.renderer); animation.renderer.globalData.projectInterface.registerComposition(animation.renderer); animation.renderer.globalData.pushExpression = pushExpression; animation.renderer.globalData.popExpression = popExpression; animation.renderer.globalData.registerExpressionProperty = registerExpressionProperty } return ob }(); function _typeof1ドル(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof1ドル = function _typeof(obj) { return typeof obj } } else { _typeof1ドル = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj } } return _typeof1ドル(obj) } function seedRandom(pool, math) { var global = this, width = 256, chunks = 6, digits = 52, rngname = 'random', startdenom = math.pow(width, chunks), significance = math.pow(2, digits), overflow = significance * 2, mask = width - 1, nodecrypto; function seedrandom(seed, options, callback) { var key = []; options = options === true ? { entropy: true } : options || {}; var shortseed = mixkey(flatten(options.entropy ? [seed, tostring(pool)] : seed === null ? autoseed() : seed, 3), key); var arc4 = new ARC4(key); var prng = function prng() { var n = arc4.g(chunks), d = startdenom, x = 0; while (n < significance) { n = (n + x) * width; d *= width; x = arc4.g(1) } while (n>= overflow) {
n /= 2;
d /= 2;
x>>>= 1
}
return (n + x) / d
};
prng.int32 = function () {
return arc4.g(4) | 0
};
prng.quick = function () {
return arc4.g(4) / 0x100000000
};
prng["double"] = prng;
mixkey(tostring(arc4.S), pool);
return (options.pass || callback || function (prng, seed, is_math_call, state) {
if (state) {
if (state.S) {
copy(state, arc4)
}
prng.state = function () {
return copy(arc4, {})
}
}
if (is_math_call) {
math[rngname] = prng;
return seed
} else return prng
})(prng, shortseed, 'global' in options ? options.global : this == math, options.state)
}
math['seed' + rngname] = seedrandom;
function ARC4(key) {
var t, keylen = key.length,
me = this,
i = 0,
j = me.i = me.j = 0,
s = me.S = [];
if (!keylen) {
key = [keylen++]
}
while (i < width) { s[i] = i++ } for (i = 0; i < width; i++) { s[i] = s[j = mask & j + key[i % keylen] + (t = s[i])]; s[j] = t } me.g = function (count) { var t, r = 0, i = me.i, j = me.j, s = me.S; while (count--) { t = s[i = mask & i + 1]; r = r * width + s[mask & (s[i] = s[j = mask & j + t]) + (s[j] = t)] } me.i = i; me.j = j; return r } } function copy(f, t) { t.i = f.i; t.j = f.j; t.S = f.S.slice(); return t } function flatten(obj, depth) { var result = [], typ = _typeof1ドル(obj), prop; if (depth && typ == 'object') { for (prop in obj) { try { result.push(flatten(obj[prop], depth - 1)) } catch (e) {} } } return result.length ? result : typ == 'string' ? obj : obj + '0円' } function mixkey(seed, key) { var stringseed = seed + '', smear, j = 0; while (j < stringseed.length) { key[mask & j] = mask & (smear ^= key[mask & j] * 19) + stringseed.charCodeAt(j++) } return tostring(key) } function autoseed() { try { if (nodecrypto) { return tostring(nodecrypto.randomBytes(width)) } var out = new Uint8Array(width); (global.crypto || global.msCrypto).getRandomValues(out); return tostring(out) } catch (e) { var browser = global.navigator, plugins = browser && browser.plugins; return [+new Date(), global, plugins, global.screen, tostring(pool)] } } function tostring(a) { return String.fromCharCode.apply(0, a) } mixkey(math.random(), pool) }; function initialize2ドル(BMMath) { seedRandom([], BMMath) } var propTypes = { SHAPE: 'shape' }; function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj } } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj } } return _typeof(obj) } var ExpressionManager = function () { 'use strict'; var ob = {}; var Math = BMMath; var window = null; var document = null; var XMLHttpRequest = null; var fetch = null; var frames = null; initialize2ドル(BMMath); function $bm_isInstanceOfArray(arr) { return arr.constructor === Array || arr.constructor === Float32Array } function isNumerable(tOfV, v) { return tOfV === 'number' || tOfV === 'boolean' || tOfV === 'string' || v instanceof Number } function $bm_neg(a) { var tOfA = _typeof(a); if (tOfA === 'number' || tOfA === 'boolean' || a instanceof Number) { return -a } if ($bm_isInstanceOfArray(a)) { var i; var lenA = a.length; var retArr = []; for (i = 0; i < lenA; i += 1) { retArr[i] = -a[i] } return retArr } if (a.propType) { return a.v } return -a } var easeInBez = BezierFactory.getBezierEasing(0.333, 0, 0.833, 0.833, 'easeIn').get; var easeOutBez = BezierFactory.getBezierEasing(0.167, 0.167, 0.667, 1, 'easeOut').get; var easeInOutBez = BezierFactory.getBezierEasing(0.33, 0, 0.667, 1, 'easeInOut').get; function sum(a, b) { var tOfA = _typeof(a); var tOfB = _typeof(b); if (tOfA === 'string' || tOfB === 'string') { return a + b } if (isNumerable(tOfA, a) && isNumerable(tOfB, b)) { return a + b } if ($bm_isInstanceOfArray(a) && isNumerable(tOfB, b)) { a = a.slice(0); a[0] += b; return a } if (isNumerable(tOfA, a) && $bm_isInstanceOfArray(b)) { b = b.slice(0); b[0] = a + b[0]; return b } if ($bm_isInstanceOfArray(a) && $bm_isInstanceOfArray(b)) { var i = 0; var lenA = a.length; var lenB = b.length; var retArr = []; while (i < lenA || i < lenB) { if ((typeof a[i] === 'number' || a[i] instanceof Number) && (typeof b[i] === 'number' || b[i] instanceof Number)) { retArr[i] = a[i] + b[i] } else { retArr[i] = b[i] === undefined ? a[i] : a[i] || b[i] } i += 1 } return retArr } return 0 } var add = sum; function sub(a, b) { var tOfA = _typeof(a); var tOfB = _typeof(b); if (isNumerable(tOfA, a) && isNumerable(tOfB, b)) { if (tOfA === 'string') { a = parseInt(a, 10) } if (tOfB === 'string') { b = parseInt(b, 10) } return a - b } if ($bm_isInstanceOfArray(a) && isNumerable(tOfB, b)) { a = a.slice(0); a[0] -= b; return a } if (isNumerable(tOfA, a) && $bm_isInstanceOfArray(b)) { b = b.slice(0); b[0] = a - b[0]; return b } if ($bm_isInstanceOfArray(a) && $bm_isInstanceOfArray(b)) { var i = 0; var lenA = a.length; var lenB = b.length; var retArr = []; while (i < lenA || i < lenB) { if ((typeof a[i] === 'number' || a[i] instanceof Number) && (typeof b[i] === 'number' || b[i] instanceof Number)) { retArr[i] = a[i] - b[i] } else { retArr[i] = b[i] === undefined ? a[i] : a[i] || b[i] } i += 1 } return retArr } return 0 } function mul(a, b) { var tOfA = _typeof(a); var tOfB = _typeof(b); var arr; if (isNumerable(tOfA, a) && isNumerable(tOfB, b)) { return a * b } var i; var len; if ($bm_isInstanceOfArray(a) && isNumerable(tOfB, b)) { len = a.length; arr = createTypedArray('float32', len); for (i = 0; i < len; i += 1) { arr[i] = a[i] * b } return arr } if (isNumerable(tOfA, a) && $bm_isInstanceOfArray(b)) { len = b.length; arr = createTypedArray('float32', len); for (i = 0; i < len; i += 1) { arr[i] = a * b[i] } return arr } return 0 } function div(a, b) { var tOfA = _typeof(a); var tOfB = _typeof(b); var arr; if (isNumerable(tOfA, a) && isNumerable(tOfB, b)) { return a / b } var i; var len; if ($bm_isInstanceOfArray(a) && isNumerable(tOfB, b)) { len = a.length; arr = createTypedArray('float32', len); for (i = 0; i < len; i += 1) { arr[i] = a[i] / b } return arr } if (isNumerable(tOfA, a) && $bm_isInstanceOfArray(b)) { len = b.length; arr = createTypedArray('float32', len); for (i = 0; i < len; i += 1) { arr[i] = a / b[i] } return arr } return 0 } function mod(a, b) { if (typeof a === 'string') { a = parseInt(a, 10) } if (typeof b === 'string') { b = parseInt(b, 10) } return a % b } var $bm_sum = sum; var $bm_sub = sub; var $bm_mul = mul; var $bm_div = div; var $bm_mod = mod; function clamp(num, min, max) { if (min> max) {
var mm = max;
max = min;
min = mm
}
return Math.min(Math.max(num, min), max)
}
function radiansToDegrees(val) {
return val / degToRads
}
var radians_to_degrees = radiansToDegrees;
function degreesToRadians(val) {
return val * degToRads
}
var degrees_to_radians = radiansToDegrees;
var helperLengthArray = [0, 0, 0, 0, 0, 0];
function length(arr1, arr2) {
if (typeof arr1 === 'number' || arr1 instanceof Number) {
arr2 = arr2 || 0;
return Math.abs(arr1 - arr2)
}
if (!arr2) {
arr2 = helperLengthArray
}
var i;
var len = Math.min(arr1.length, arr2.length);
var addedLength = 0;
for (i = 0; i < len; i += 1) { addedLength += Math.pow(arr2[i] - arr1[i], 2) } return Math.sqrt(addedLength) } function normalize(vec) { return div(vec, length(vec)) } function rgbToHsl(val) { var r = val[0]; var g = val[1]; var b = val[2]; var max = Math.max(r, g, b); var min = Math.min(r, g, b); var h; var s; var l = (max + min) / 2; if (max === min) { h = 0; s = 0 } else { var d = max - min; s = l> 0.5 ? d / (2 - max - min) : d / (max + min);
switch (max) {
case r:
h = (g - b) / d + (g < b ? 6 : 0); break; case g: h = (b - r) / d + 2; break; case b: h = (r - g) / d + 4; break; default: break } h /= 6 } return [h, s, l, val[3]] } function hue2rgb(p, q, t) { if (t < 0) t += 1; if (t> 1) t -= 1;
if (t < 1 / 6) return p + (q - p) * 6 * t; if (t < 1 / 2) return q; if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6; return p } function hslToRgb(val) { var h = val[0]; var s = val[1]; var l = val[2]; var r; var g; var b; if (s === 0) { r = l; b = l; g = l } else { var q = l < 0.5 ? l * (1 + s) : l + s - l * s; var p = 2 * l - q; r = hue2rgb(p, q, h + 1 / 3); g = hue2rgb(p, q, h); b = hue2rgb(p, q, h - 1 / 3) } return [r, g, b, val[3]] } function linear(t, tMin, tMax, value1, value2) { if (value1 === undefined || value2 === undefined) { value1 = tMin; value2 = tMax; tMin = 0; tMax = 1 } if (tMax < tMin) { var _tMin = tMax; tMax = tMin; tMin = _tMin } if (t <= tMin) { return value1 } if (t>= tMax) {
return value2
}
var perc = tMax === tMin ? 0 : (t - tMin) / (tMax - tMin);
if (!value1.length) {
return value1 + (value2 - value1) * perc
}
var i;
var len = value1.length;
var arr = createTypedArray('float32', len);
for (i = 0; i < len; i += 1) { arr[i] = value1[i] + (value2[i] - value1[i]) * perc } return arr } function random(min, max) { if (max === undefined) { if (min === undefined) { min = 0; max = 1 } else { max = min; min = undefined } } if (max.length) { var i; var len = max.length; if (!min) { min = createTypedArray('float32', len) } var arr = createTypedArray('float32', len); var rnd = BMMath.random(); for (i = 0; i < len; i += 1) { arr[i] = min[i] + rnd * (max[i] - min[i]) } return arr } if (min === undefined) { min = 0 } var rndm = BMMath.random(); return min + rndm * (max - min) } function createPath(points, inTangents, outTangents, closed) { var i; var len = points.length; var path = shapePool.newElement(); path.setPathData(!!closed, len); var arrPlaceholder = [0, 0]; var inVertexPoint; var outVertexPoint; for (i = 0; i < len; i += 1) { inVertexPoint = inTangents && inTangents[i] ? inTangents[i] : arrPlaceholder; outVertexPoint = outTangents && outTangents[i] ? outTangents[i] : arrPlaceholder; path.setTripleAt(points[i][0], points[i][1], outVertexPoint[0] + points[i][0], outVertexPoint[1] + points[i][1], inVertexPoint[0] + points[i][0], inVertexPoint[1] + points[i][1], i, true) } return path } function initiateExpression(elem, data, property) { var val = data.x; var needsVelocity = /velocity(?![\w\d])/.test(val); var _needsRandom = val.indexOf('random') !== -1; var elemType = elem.data.ty; var transform; var $bm_transform; var content; var effect; var thisProperty = property; thisProperty.valueAtTime = thisProperty.getValueAtTime; Object.defineProperty(thisProperty, 'value', { get: function get() { return thisProperty.v } }); elem.comp.frameDuration = 1 / elem.comp.globalData.frameRate; elem.comp.displayStartTime = 0; var inPoint = elem.data.ip / elem.comp.globalData.frameRate; var outPoint = elem.data.op / elem.comp.globalData.frameRate; var width = elem.data.sw ? elem.data.sw : 0; var height = elem.data.sh ? elem.data.sh : 0; var name = elem.data.nm; var loopIn; var loop_in; var loopOut; var loop_out; var smooth; var toWorld; var fromWorld; var fromComp; var toComp; var fromCompToSurface; var position; var rotation; var anchorPoint; var scale; var thisLayer; var thisComp; var mask; var valueAtTime; var velocityAtTime; var scoped_bm_rt; var expression_function = eval('[function _expression_function(){' + val + ';scoped_bm_rt=$bm_rt}]')[0]; var numKeys = property.kf ? data.k.length : 0; var active = !this.data || this.data.hd !== true; var wiggle = function wiggle(freq, amp) { var iWiggle; var j; var lenWiggle = this.pv.length ? this.pv.length : 1; var addedAmps = createTypedArray('float32', lenWiggle); freq = 5; var iterations = Math.floor(time * freq); iWiggle = 0; j = 0; while (iWiggle < iterations) { for (j = 0; j < lenWiggle; j += 1) { addedAmps[j] += -amp + amp * 2 * BMMath.random() } iWiggle += 1 } var periods = time * freq; var perc = periods - Math.floor(periods); var arr = createTypedArray('float32', lenWiggle); if (lenWiggle> 1) {
for (j = 0; j < lenWiggle; j += 1) { arr[j] = this.pv[j] + addedAmps[j] + (-amp + amp * 2 * BMMath.random()) * perc } return arr } return this.pv + addedAmps[0] + (-amp + amp * 2 * BMMath.random()) * perc }.bind(this); if (thisProperty.loopIn) { loopIn = thisProperty.loopIn.bind(thisProperty); loop_in = loopIn } if (thisProperty.loopOut) { loopOut = thisProperty.loopOut.bind(thisProperty); loop_out = loopOut } if (thisProperty.smooth) { smooth = thisProperty.smooth.bind(thisProperty) } function loopInDuration(type, duration) { return loopIn(type, duration, true) } function loopOutDuration(type, duration) { return loopOut(type, duration, true) } if (this.getValueAtTime) { valueAtTime = this.getValueAtTime.bind(this) } if (this.getVelocityAtTime) { velocityAtTime = this.getVelocityAtTime.bind(this) } var comp = elem.comp.globalData.projectInterface.bind(elem.comp.globalData.projectInterface); function lookAt(elem1, elem2) { var fVec = [elem2[0] - elem1[0], elem2[1] - elem1[1], elem2[2] - elem1[2]]; var pitch = Math.atan2(fVec[0], Math.sqrt(fVec[1] * fVec[1] + fVec[2] * fVec[2])) / degToRads; var yaw = -Math.atan2(fVec[1], fVec[2]) / degToRads; return [yaw, pitch, 0] } function easeOut(t, tMin, tMax, val1, val2) { return applyEase(easeOutBez, t, tMin, tMax, val1, val2) } function easeIn(t, tMin, tMax, val1, val2) { return applyEase(easeInBez, t, tMin, tMax, val1, val2) } function ease(t, tMin, tMax, val1, val2) { return applyEase(easeInOutBez, t, tMin, tMax, val1, val2) } function applyEase(fn, t, tMin, tMax, val1, val2) { if (val1 === undefined) { val1 = tMin; val2 = tMax } else { t = (t - tMin) / (tMax - tMin) } if (t> 1) {
t = 1
} else if (t < 0) { t = 0 } var mult = fn(t); if ($bm_isInstanceOfArray(val1)) { var iKey; var lenKey = val1.length; var arr = createTypedArray('float32', lenKey); for (iKey = 0; iKey < lenKey; iKey += 1) { arr[iKey] = (val2[iKey] - val1[iKey]) * mult + val1[iKey] } return arr } return (val2 - val1) * mult + val1 } function nearestKey(time) { var iKey; var lenKey = data.k.length; var index; var keyTime; if (!data.k.length || typeof data.k[0] === 'number') { index = 0; keyTime = 0 } else { index = -1; time *= elem.comp.globalData.frameRate; if (time < data.k[0].t) { index = 1; keyTime = data.k[0].t } else { for (iKey = 0; iKey < lenKey - 1; iKey += 1) { if (time === data.k[iKey].t) { index = iKey + 1; keyTime = data.k[iKey].t; break } else if (time> data.k[iKey].t && time < data.k[iKey + 1].t) { if (time - data.k[iKey].t> data.k[iKey + 1].t - time) {
index = iKey + 2;
keyTime = data.k[iKey + 1].t
} else {
index = iKey + 1;
keyTime = data.k[iKey].t
}
break
}
}
if (index === -1) {
index = iKey + 1;
keyTime = data.k[iKey].t
}
}
}
var obKey = {};
obKey.index = index;
obKey.time = keyTime / elem.comp.globalData.frameRate;
return obKey
}
function key(ind) {
var obKey;
var iKey;
var lenKey;
if (!data.k.length || typeof data.k[0] === 'number') {
throw new Error('The property has no keyframe at index ' + ind);
}
ind -= 1;
obKey = {
time: data.k[ind].t / elem.comp.globalData.frameRate,
value: []
};
var arr = Object.prototype.hasOwnProperty.call(data.k[ind], 's') ? data.k[ind].s : data.k[ind - 1].e;
lenKey = arr.length;
for (iKey = 0; iKey < lenKey; iKey += 1) { obKey[iKey] = arr[iKey]; obKey.value[iKey] = arr[iKey] } return obKey } function framesToTime(fr, fps) { if (!fps) { fps = elem.comp.globalData.frameRate } return fr / fps } function timeToFrames(t, fps) { if (!t && t !== 0) { t = time } if (!fps) { fps = elem.comp.globalData.frameRate } return t * fps } function seedRandom(seed) { BMMath.seedrandom(randSeed + seed) } function sourceRectAtTime() { return elem.sourceRectAtTime() } function substring(init, end) { if (typeof value === 'string') { if (end === undefined) { return value.substring(init) } return value.substring(init, end) } return '' } function substr(init, end) { if (typeof value === 'string') { if (end === undefined) { return value.substr(init) } return value.substr(init, end) } return '' } function posterizeTime(framesPerSecond) { time = framesPerSecond === 0 ? 0 : Math.floor(time * framesPerSecond) / framesPerSecond; value = valueAtTime(time) } var time; var velocity; var value; var text; var textIndex; var textTotal; var selectorValue; var index = elem.data.ind; var hasParent = !!(elem.hierarchy && elem.hierarchy.length); var parent; var randSeed = Math.floor(Math.random() * 1000000); var globalData = elem.globalData; function executeExpression(_value) { value = _value; if (this.frameExpressionId === elem.globalData.frameId && this.propType !== 'textSelector') { return value } if (this.propType === 'textSelector') { textIndex = this.textIndex; textTotal = this.textTotal; selectorValue = this.selectorValue } if (!thisLayer) { text = elem.layerInterface.text; thisLayer = elem.layerInterface; thisComp = elem.comp.compInterface; toWorld = thisLayer.toWorld.bind(thisLayer); fromWorld = thisLayer.fromWorld.bind(thisLayer); fromComp = thisLayer.fromComp.bind(thisLayer); toComp = thisLayer.toComp.bind(thisLayer); mask = thisLayer.mask ? thisLayer.mask.bind(thisLayer) : null; fromCompToSurface = fromComp } if (!transform) { transform = elem.layerInterface('ADBE Transform Group'); $bm_transform = transform; if (transform) { anchorPoint = transform.anchorPoint } } if (elemType === 4 && !content) { content = thisLayer('ADBE Root Vectors Group') } if (!effect) { effect = thisLayer(4) } hasParent = !!(elem.hierarchy && elem.hierarchy.length); if (hasParent && !parent) { parent = elem.hierarchy[0].layerInterface } time = this.comp.renderedFrame / this.comp.globalData.frameRate; if (_needsRandom) { seedRandom(randSeed + time) } if (needsVelocity) { velocity = velocityAtTime(time) } expression_function(); this.frameExpressionId = elem.globalData.frameId; scoped_bm_rt = scoped_bm_rt.propType === propTypes.SHAPE ? scoped_bm_rt.v : scoped_bm_rt; return scoped_bm_rt } executeExpression.__preventDeadCodeRemoval = [$bm_transform, anchorPoint, time, velocity, inPoint, outPoint, width, height, name, loop_in, loop_out, smooth, toComp, fromCompToSurface, toWorld, fromWorld, mask, position, rotation, scale, thisComp, numKeys, active, wiggle, loopInDuration, loopOutDuration, comp, lookAt, easeOut, easeIn, ease, nearestKey, key, text, textIndex, textTotal, selectorValue, framesToTime, timeToFrames, sourceRectAtTime, substring, substr, posterizeTime, index, globalData]; return executeExpression } ob.initiateExpression = initiateExpression; ob.__preventDeadCodeRemoval = [window, document, XMLHttpRequest, fetch, frames, $bm_neg, add, $bm_sum, $bm_sub, $bm_mul, $bm_div, $bm_mod, clamp, radians_to_degrees, degreesToRadians, degrees_to_radians, normalize, rgbToHsl, hslToRgb, linear, random, createPath]; return ob }(); var expressionHelpers = function () { function searchExpressions(elem, data, prop) { if (data.x) { prop.k = true; prop.x = true; prop.initiateExpression = ExpressionManager.initiateExpression; prop.effectsSequence.push(prop.initiateExpression(elem, data, prop).bind(prop)) } } function getValueAtTime(frameNum) { frameNum *= this.elem.globalData.frameRate; frameNum -= this.offsetTime; if (frameNum !== this._cachingAtTime.lastFrame) { this._cachingAtTime.lastIndex = this._cachingAtTime.lastFrame < frameNum ? this._cachingAtTime.lastIndex : 0; this._cachingAtTime.value = this.interpolateValue(frameNum, this._cachingAtTime); this._cachingAtTime.lastFrame = frameNum } return this._cachingAtTime.value } function getSpeedAtTime(frameNum) { var delta = -0.01; var v1 = this.getValueAtTime(frameNum); var v2 = this.getValueAtTime(frameNum + delta); var speed = 0; if (v1.length) { var i; for (i = 0; i < v1.length; i += 1) { speed += Math.pow(v2[i] - v1[i], 2) } speed = Math.sqrt(speed) * 100 } else { speed = 0 } return speed } function getVelocityAtTime(frameNum) { if (this.vel !== undefined) { return this.vel } var delta = -0.001; var v1 = this.getValueAtTime(frameNum); var v2 = this.getValueAtTime(frameNum + delta); var velocity; if (v1.length) { velocity = createTypedArray('float32', v1.length); var i; for (i = 0; i < v1.length; i += 1) { velocity[i] = (v2[i] - v1[i]) / delta } } else { velocity = (v2 - v1) / delta } return velocity } function getStaticValueAtTime() { return this.pv } function setGroupProperty(propertyGroup) { this.propertyGroup = propertyGroup } return { searchExpressions: searchExpressions, getSpeedAtTime: getSpeedAtTime, getVelocityAtTime: getVelocityAtTime, getValueAtTime: getValueAtTime, getStaticValueAtTime: getStaticValueAtTime, setGroupProperty: setGroupProperty } }(); function addPropertyDecorator() { function loopOut(type, duration, durationFlag) { if (!this.k || !this.keyframes) { return this.pv } type = type ? type.toLowerCase() : ''; var currentFrame = this.comp.renderedFrame; var keyframes = this.keyframes; var lastKeyFrame = keyframes[keyframes.length - 1].t; if (currentFrame <= lastKeyFrame) { return this.pv } var cycleDuration; var firstKeyFrame; if (!durationFlag) { if (!duration || duration> keyframes.length - 1) {
duration = keyframes.length - 1
}
firstKeyFrame = keyframes[keyframes.length - 1 - duration].t;
cycleDuration = lastKeyFrame - firstKeyFrame
} else {
if (!duration) {
cycleDuration = Math.max(0, lastKeyFrame - this.elem.data.ip)
} else {
cycleDuration = Math.abs(lastKeyFrame - this.elem.comp.globalData.frameRate * duration)
}
firstKeyFrame = lastKeyFrame - cycleDuration
}
var i;
var len;
var ret;
if (type === 'pingpong') {
var iterations = Math.floor((currentFrame - firstKeyFrame) / cycleDuration);
if (iterations % 2 !== 0) {
return this.getValueAtTime((cycleDuration - (currentFrame - firstKeyFrame) % cycleDuration + firstKeyFrame) / this.comp.globalData.frameRate, 0)
}
} else if (type === 'offset') {
var initV = this.getValueAtTime(firstKeyFrame / this.comp.globalData.frameRate, 0);
var endV = this.getValueAtTime(lastKeyFrame / this.comp.globalData.frameRate, 0);
var current = this.getValueAtTime(((currentFrame - firstKeyFrame) % cycleDuration + firstKeyFrame) / this.comp.globalData.frameRate, 0);
var repeats = Math.floor((currentFrame - firstKeyFrame) / cycleDuration);
if (this.pv.length) {
ret = new Array(initV.length);
len = ret.length;
for (i = 0; i < len; i += 1) { ret[i] = (endV[i] - initV[i]) * repeats + current[i] } return ret } return (endV - initV) * repeats + current } else if (type === 'continue') { var lastValue = this.getValueAtTime(lastKeyFrame / this.comp.globalData.frameRate, 0); var nextLastValue = this.getValueAtTime((lastKeyFrame - 0.001) / this.comp.globalData.frameRate, 0); if (this.pv.length) { ret = new Array(lastValue.length); len = ret.length; for (i = 0; i < len; i += 1) { ret[i] = lastValue[i] + (lastValue[i] - nextLastValue[i]) * ((currentFrame - lastKeyFrame) / this.comp.globalData.frameRate) / 0.0005 } return ret } return lastValue + (lastValue - nextLastValue) * ((currentFrame - lastKeyFrame) / 0.001) } return this.getValueAtTime(((currentFrame - firstKeyFrame) % cycleDuration + firstKeyFrame) / this.comp.globalData.frameRate, 0) } function loopIn(type, duration, durationFlag) { if (!this.k) { return this.pv } type = type ? type.toLowerCase() : ''; var currentFrame = this.comp.renderedFrame; var keyframes = this.keyframes; var firstKeyFrame = keyframes[0].t; if (currentFrame>= firstKeyFrame) {
return this.pv
}
var cycleDuration;
var lastKeyFrame;
if (!durationFlag) {
if (!duration || duration> keyframes.length - 1) {
duration = keyframes.length - 1
}
lastKeyFrame = keyframes[duration].t;
cycleDuration = lastKeyFrame - firstKeyFrame
} else {
if (!duration) {
cycleDuration = Math.max(0, this.elem.data.op - firstKeyFrame)
} else {
cycleDuration = Math.abs(this.elem.comp.globalData.frameRate * duration)
}
lastKeyFrame = firstKeyFrame + cycleDuration
}
var i;
var len;
var ret;
if (type === 'pingpong') {
var iterations = Math.floor((firstKeyFrame - currentFrame) / cycleDuration);
if (iterations % 2 === 0) {
return this.getValueAtTime(((firstKeyFrame - currentFrame) % cycleDuration + firstKeyFrame) / this.comp.globalData.frameRate, 0)
}
} else if (type === 'offset') {
var initV = this.getValueAtTime(firstKeyFrame / this.comp.globalData.frameRate, 0);
var endV = this.getValueAtTime(lastKeyFrame / this.comp.globalData.frameRate, 0);
var current = this.getValueAtTime((cycleDuration - (firstKeyFrame - currentFrame) % cycleDuration + firstKeyFrame) / this.comp.globalData.frameRate, 0);
var repeats = Math.floor((firstKeyFrame - currentFrame) / cycleDuration) + 1;
if (this.pv.length) {
ret = new Array(initV.length);
len = ret.length;
for (i = 0; i < len; i += 1) { ret[i] = current[i] - (endV[i] - initV[i]) * repeats } return ret } return current - (endV - initV) * repeats } else if (type === 'continue') { var firstValue = this.getValueAtTime(firstKeyFrame / this.comp.globalData.frameRate, 0); var nextFirstValue = this.getValueAtTime((firstKeyFrame + 0.001) / this.comp.globalData.frameRate, 0); if (this.pv.length) { ret = new Array(firstValue.length); len = ret.length; for (i = 0; i < len; i += 1) { ret[i] = firstValue[i] + (firstValue[i] - nextFirstValue[i]) * (firstKeyFrame - currentFrame) / 0.001 } return ret } return firstValue + (firstValue - nextFirstValue) * (firstKeyFrame - currentFrame) / 0.001 } return this.getValueAtTime((cycleDuration - ((firstKeyFrame - currentFrame) % cycleDuration + firstKeyFrame)) / this.comp.globalData.frameRate, 0) } function smooth(width, samples) { if (!this.k) { return this.pv } width = (width || 0.4) * 0.5; samples = Math.floor(samples || 5); if (samples <= 1) { return this.pv } var currentTime = this.comp.renderedFrame / this.comp.globalData.frameRate; var initFrame = currentTime - width; var endFrame = currentTime + width; var sampleFrequency = samples> 1 ? (endFrame - initFrame) / (samples - 1) : 1;
var i = 0;
var j = 0;
var value;
if (this.pv.length) {
value = createTypedArray('float32', this.pv.length)
} else {
value = 0
}
var sampleValue;
while (i < samples) { sampleValue = this.getValueAtTime(initFrame + i * sampleFrequency); if (this.pv.length) { for (j = 0; j < this.pv.length; j += 1) { value[j] += sampleValue[j] } } else { value += sampleValue } i += 1 } if (this.pv.length) { for (j = 0; j < this.pv.length; j += 1) { value[j] /= samples } } else { value /= samples } return value } function getTransformValueAtTime(time) { if (!this._transformCachingAtTime) { this._transformCachingAtTime = { v: new Matrix() } } var matrix = this._transformCachingAtTime.v; matrix.cloneFromProps(this.pre.props); if (this.appliedTransformations < 1) { var anchor = this.a.getValueAtTime(time); matrix.translate(-anchor[0] * this.a.mult, -anchor[1] * this.a.mult, anchor[2] * this.a.mult) } if (this.appliedTransformations < 2) { var scale = this.s.getValueAtTime(time); matrix.scale(scale[0] * this.s.mult, scale[1] * this.s.mult, scale[2] * this.s.mult) } if (this.sk && this.appliedTransformations < 3) { var skew = this.sk.getValueAtTime(time); var skewAxis = this.sa.getValueAtTime(time); matrix.skewFromAxis(-skew * this.sk.mult, skewAxis * this.sa.mult) } if (this.r && this.appliedTransformations < 4) { var rotation = this.r.getValueAtTime(time); matrix.rotate(-rotation * this.r.mult) } else if (!this.r && this.appliedTransformations < 4) { var rotationZ = this.rz.getValueAtTime(time); var rotationY = this.ry.getValueAtTime(time); var rotationX = this.rx.getValueAtTime(time); var orientation = this.or.getValueAtTime(time); matrix.rotateZ(-rotationZ * this.rz.mult).rotateY(rotationY * this.ry.mult).rotateX(rotationX * this.rx.mult).rotateZ(-orientation[2] * this.or.mult).rotateY(orientation[1] * this.or.mult).rotateX(orientation[0] * this.or.mult) } if (this.data.p && this.data.p.s) { var positionX = this.px.getValueAtTime(time); var positionY = this.py.getValueAtTime(time); if (this.data.p.z) { var positionZ = this.pz.getValueAtTime(time); matrix.translate(positionX * this.px.mult, positionY * this.py.mult, -positionZ * this.pz.mult) } else { matrix.translate(positionX * this.px.mult, positionY * this.py.mult, 0) } } else { var position = this.p.getValueAtTime(time); matrix.translate(position[0] * this.p.mult, position[1] * this.p.mult, -position[2] * this.p.mult) } return matrix } function getTransformStaticValueAtTime() { return this.v.clone(new Matrix()) } var getTransformProperty = TransformPropertyFactory.getTransformProperty; TransformPropertyFactory.getTransformProperty = function (elem, data, container) { var prop = getTransformProperty(elem, data, container); if (prop.dynamicProperties.length) { prop.getValueAtTime = getTransformValueAtTime.bind(prop) } else { prop.getValueAtTime = getTransformStaticValueAtTime.bind(prop) } prop.setGroupProperty = expressionHelpers.setGroupProperty; return prop }; var propertyGetProp = PropertyFactory.getProp; PropertyFactory.getProp = function (elem, data, type, mult, container) { var prop = propertyGetProp(elem, data, type, mult, container); if (prop.kf) { prop.getValueAtTime = expressionHelpers.getValueAtTime.bind(prop) } else { prop.getValueAtTime = expressionHelpers.getStaticValueAtTime.bind(prop) } prop.setGroupProperty = expressionHelpers.setGroupProperty; prop.loopOut = loopOut; prop.loopIn = loopIn; prop.smooth = smooth; prop.getVelocityAtTime = expressionHelpers.getVelocityAtTime.bind(prop); prop.getSpeedAtTime = expressionHelpers.getSpeedAtTime.bind(prop); prop.numKeys = data.a === 1 ? data.k.length : 0; prop.propertyIndex = data.ix; var value = 0; if (type !== 0) { value = createTypedArray('float32', data.a === 1 ? data.k[0].s.length : data.k.length) } prop._cachingAtTime = { lastFrame: initialDefaultFrame, lastIndex: 0, value: value }; expressionHelpers.searchExpressions(elem, data, prop); if (prop.k) { container.addDynamicProperty(prop) } return prop }; function getShapeValueAtTime(frameNum) { if (!this._cachingAtTime) { this._cachingAtTime = { shapeValue: shapePool.clone(this.pv), lastIndex: 0, lastTime: initialDefaultFrame } } frameNum *= this.elem.globalData.frameRate; frameNum -= this.offsetTime; if (frameNum !== this._cachingAtTime.lastTime) { this._cachingAtTime.lastIndex = this._cachingAtTime.lastTime < frameNum ? this._caching.lastIndex : 0; this._cachingAtTime.lastTime = frameNum; this.interpolateShape(frameNum, this._cachingAtTime.shapeValue, this._cachingAtTime) } return this._cachingAtTime.shapeValue } var ShapePropertyConstructorFunction = ShapePropertyFactory.getConstructorFunction(); var KeyframedShapePropertyConstructorFunction = ShapePropertyFactory.getKeyframedConstructorFunction(); function ShapeExpressions() {} ShapeExpressions.prototype = { vertices: function vertices(prop, time) { if (this.k) { this.getValue() } var shapePath = this.v; if (time !== undefined) { shapePath = this.getValueAtTime(time, 0) } var i; var len = shapePath._length; var vertices = shapePath[prop]; var points = shapePath.v; var arr = createSizedArray(len); for (i = 0; i < len; i += 1) { if (prop === 'i' || prop === 'o') { arr[i] = [vertices[i][0] - points[i][0], vertices[i][1] - points[i][1]] } else { arr[i] = [vertices[i][0], vertices[i][1]] } } return arr }, points: function points(time) { return this.vertices('v', time) }, inTangents: function inTangents(time) { return this.vertices('i', time) }, outTangents: function outTangents(time) { return this.vertices('o', time) }, isClosed: function isClosed() { return this.v.c }, pointOnPath: function pointOnPath(perc, time) { var shapePath = this.v; if (time !== undefined) { shapePath = this.getValueAtTime(time, 0) } if (!this._segmentsLength) { this._segmentsLength = bez.getSegmentsLength(shapePath) } var segmentsLength = this._segmentsLength; var lengths = segmentsLength.lengths; var lengthPos = segmentsLength.totalLength * perc; var i = 0; var len = lengths.length; var accumulatedLength = 0; var pt; while (i < len) { if (accumulatedLength + lengths[i].addedLength> lengthPos) {
var initIndex = i;
var endIndex = shapePath.c && i === len - 1 ? 0 : i + 1;
var segmentPerc = (lengthPos - accumulatedLength) / lengths[i].addedLength;
pt = bez.getPointInSegment(shapePath.v[initIndex], shapePath.v[endIndex], shapePath.o[initIndex], shapePath.i[endIndex], segmentPerc, lengths[i]);
break
} else {
accumulatedLength += lengths[i].addedLength
}
i += 1
}
if (!pt) {
pt = shapePath.c ? [shapePath.v[0][0], shapePath.v[0][1]] : [shapePath.v[shapePath._length - 1][0], shapePath.v[shapePath._length - 1][1]]
}
return pt
},
vectorOnPath: function vectorOnPath(perc, time, vectorType) {
if (perc == 1) {
perc = this.v.c
} else if (perc == 0) {
perc = 0.999
}
var pt1 = this.pointOnPath(perc, time);
var pt2 = this.pointOnPath(perc + 0.001, time);
var xLength = pt2[0] - pt1[0];
var yLength = pt2[1] - pt1[1];
var magnitude = Math.sqrt(Math.pow(xLength, 2) + Math.pow(yLength, 2));
if (magnitude === 0) {
return [0, 0]
}
var unitVector = vectorType === 'tangent' ? [xLength / magnitude, yLength / magnitude] : [-yLength / magnitude, xLength / magnitude];
return unitVector
},
tangentOnPath: function tangentOnPath(perc, time) {
return this.vectorOnPath(perc, time, 'tangent')
},
normalOnPath: function normalOnPath(perc, time) {
return this.vectorOnPath(perc, time, 'normal')
},
setGroupProperty: expressionHelpers.setGroupProperty,
getValueAtTime: expressionHelpers.getStaticValueAtTime
};
extendPrototype([ShapeExpressions], ShapePropertyConstructorFunction);
extendPrototype([ShapeExpressions], KeyframedShapePropertyConstructorFunction);
KeyframedShapePropertyConstructorFunction.prototype.getValueAtTime = getShapeValueAtTime;
KeyframedShapePropertyConstructorFunction.prototype.initiateExpression = ExpressionManager.initiateExpression;
var propertyGetShapeProp = ShapePropertyFactory.getShapeProp;
ShapePropertyFactory.getShapeProp = function (elem, data, type, arr, trims) {
var prop = propertyGetShapeProp(elem, data, type, arr, trims);
prop.propertyIndex = data.ix;
prop.lock = false;
if (type === 3) {
expressionHelpers.searchExpressions(elem, data.pt, prop)
} else if (type === 4) {
expressionHelpers.searchExpressions(elem, data.ks, prop)
}
if (prop.k) {
elem.addDynamicProperty(prop)
}
return prop
}
}
function initialize1ドル() {
addPropertyDecorator()
}
function addDecorator() {
function searchExpressions() {
if (this.data.d.x) {
this.calculateExpression = ExpressionManager.initiateExpression.bind(this)(this.elem, this.data.d, this);
this.addEffect(this.getExpressionValue.bind(this));
return true
}
return null
}
TextProperty.prototype.getExpressionValue = function (currentValue, text) {
var newValue = this.calculateExpression(text);
if (currentValue.t !== newValue) {
var newData = {};
this.copyData(newData, currentValue);
newData.t = newValue.toString();
newData.__complete = false;
return newData
}
return currentValue
};
TextProperty.prototype.searchProperty = function () {
var isKeyframed = this.searchKeyframes();
var hasExpressions = this.searchExpressions();
this.kf = isKeyframed || hasExpressions;
return this.kf
};
TextProperty.prototype.searchExpressions = searchExpressions
}
function initialize() {
addDecorator()
}
function SVGComposableEffect() {}
SVGComposableEffect.prototype = {
createMergeNode: function createMergeNode(resultId, ins) {
var feMerge = createNS('feMerge');
feMerge.setAttribute('result', resultId);
var feMergeNode;
var i;
for (i = 0; i < ins.length; i += 1) { feMergeNode = createNS('feMergeNode'); feMergeNode.setAttribute('in', ins[i]); feMerge.appendChild(feMergeNode); feMerge.appendChild(feMergeNode) } return feMerge } }; function SVGTintFilter(filter, filterManager, elem, id, source) { this.filterManager = filterManager; var feColorMatrix = createNS('feColorMatrix'); feColorMatrix.setAttribute('type', 'matrix'); feColorMatrix.setAttribute('color-interpolation-filters', 'linearRGB'); feColorMatrix.setAttribute('values', '0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'); feColorMatrix.setAttribute('result', id + '_tint_1'); filter.appendChild(feColorMatrix); feColorMatrix = createNS('feColorMatrix'); feColorMatrix.setAttribute('type', 'matrix'); feColorMatrix.setAttribute('color-interpolation-filters', 'sRGB'); feColorMatrix.setAttribute('values', '1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0'); feColorMatrix.setAttribute('result', id + '_tint_2'); filter.appendChild(feColorMatrix); this.matrixFilter = feColorMatrix; var feMerge = this.createMergeNode(id, [source, id + '_tint_1', id + '_tint_2']); filter.appendChild(feMerge) } extendPrototype([SVGComposableEffect], SVGTintFilter); SVGTintFilter.prototype.renderFrame = function (forceRender) { if (forceRender || this.filterManager._mdf) { var colorBlack = this.filterManager.effectElements[0].p.v; var colorWhite = this.filterManager.effectElements[1].p.v; var opacity = this.filterManager.effectElements[2].p.v / 100; this.matrixFilter.setAttribute('values', colorWhite[0] - colorBlack[0] + ' 0 0 0 ' + colorBlack[0] + ' ' + (colorWhite[1] - colorBlack[1]) + ' 0 0 0 ' + colorBlack[1] + ' ' + (colorWhite[2] - colorBlack[2]) + ' 0 0 0 ' + colorBlack[2] + ' 0 0 0 ' + opacity + ' 0') } }; function SVGFillFilter(filter, filterManager, elem, id) { this.filterManager = filterManager; var feColorMatrix = createNS('feColorMatrix'); feColorMatrix.setAttribute('type', 'matrix'); feColorMatrix.setAttribute('color-interpolation-filters', 'sRGB'); feColorMatrix.setAttribute('values', '1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0'); feColorMatrix.setAttribute('result', id); filter.appendChild(feColorMatrix); this.matrixFilter = feColorMatrix } SVGFillFilter.prototype.renderFrame = function (forceRender) { if (forceRender || this.filterManager._mdf) { var color = this.filterManager.effectElements[2].p.v; var opacity = this.filterManager.effectElements[6].p.v; this.matrixFilter.setAttribute('values', '0 0 0 0 ' + color[0] + ' 0 0 0 0 ' + color[1] + ' 0 0 0 0 ' + color[2] + ' 0 0 0 ' + opacity + ' 0') } }; function SVGStrokeEffect(fil, filterManager, elem) { this.initialized = false; this.filterManager = filterManager; this.elem = elem; this.paths = [] } SVGStrokeEffect.prototype.initialize = function () { var elemChildren = this.elem.layerElement.children || this.elem.layerElement.childNodes; var path; var groupPath; var i; var len; if (this.filterManager.effectElements[1].p.v === 1) { len = this.elem.maskManager.masksProperties.length; i = 0 } else { i = this.filterManager.effectElements[0].p.v - 1; len = i + 1 } groupPath = createNS('g'); groupPath.setAttribute('fill', 'none'); groupPath.setAttribute('stroke-linecap', 'round'); groupPath.setAttribute('stroke-dashoffset', 1); for (i; i < len; i += 1) { path = createNS('path'); groupPath.appendChild(path); this.paths.push({ p: path, m: i }) } if (this.filterManager.effectElements[10].p.v === 3) { var mask = createNS('mask'); var id = createElementID(); mask.setAttribute('id', id); mask.setAttribute('mask-type', 'alpha'); mask.appendChild(groupPath); this.elem.globalData.defs.appendChild(mask); var g = createNS('g'); g.setAttribute('mask', 'url(' + getLocationHref() + '#' + id + ')'); while (elemChildren[0]) { g.appendChild(elemChildren[0]) } this.elem.layerElement.appendChild(g); this.masker = mask; groupPath.setAttribute('stroke', '#fff') } else if (this.filterManager.effectElements[10].p.v === 1 || this.filterManager.effectElements[10].p.v === 2) { if (this.filterManager.effectElements[10].p.v === 2) { elemChildren = this.elem.layerElement.children || this.elem.layerElement.childNodes; while (elemChildren.length) { this.elem.layerElement.removeChild(elemChildren[0]) } } this.elem.layerElement.appendChild(groupPath); this.elem.layerElement.removeAttribute('mask'); groupPath.setAttribute('stroke', '#fff') } this.initialized = true; this.pathMasker = groupPath }; SVGStrokeEffect.prototype.renderFrame = function (forceRender) { if (!this.initialized) { this.initialize() } var i; var len = this.paths.length; var mask; var path; for (i = 0; i < len; i += 1) { if (this.paths[i].m !== -1) { mask = this.elem.maskManager.viewData[this.paths[i].m]; path = this.paths[i].p; if (forceRender || this.filterManager._mdf || mask.prop._mdf) { path.setAttribute('d', mask.lastPath) } if (forceRender || this.filterManager.effectElements[9].p._mdf || this.filterManager.effectElements[4].p._mdf || this.filterManager.effectElements[7].p._mdf || this.filterManager.effectElements[8].p._mdf || mask.prop._mdf) { var dasharrayValue; if (this.filterManager.effectElements[7].p.v !== 0 || this.filterManager.effectElements[8].p.v !== 100) { var s = Math.min(this.filterManager.effectElements[7].p.v, this.filterManager.effectElements[8].p.v) * 0.01; var e = Math.max(this.filterManager.effectElements[7].p.v, this.filterManager.effectElements[8].p.v) * 0.01; var l = path.getTotalLength(); dasharrayValue = '0 0 0 ' + l * s + ' '; var lineLength = l * (e - s); var segment = 1 + this.filterManager.effectElements[4].p.v * 2 * this.filterManager.effectElements[9].p.v * 0.01; var units = Math.floor(lineLength / segment); var j; for (j = 0; j < units; j += 1) { dasharrayValue += '1 ' + this.filterManager.effectElements[4].p.v * 2 * this.filterManager.effectElements[9].p.v * 0.01 + ' ' } dasharrayValue += '0 ' + l * 10 + ' 0 0' } else { dasharrayValue = '1 ' + this.filterManager.effectElements[4].p.v * 2 * this.filterManager.effectElements[9].p.v * 0.01 } path.setAttribute('stroke-dasharray', dasharrayValue) } } } if (forceRender || this.filterManager.effectElements[4].p._mdf) { this.pathMasker.setAttribute('stroke-opacity', this.filterManager.effectElements[6].p.v) } if (this.filterManager.effectElements[10].p.v === 1 || this.filterManager.effectElements[10].p.v === 2) { if (forceRender || this.filterManager.effectElements[3].p._mdf) { var color = this.filterManager.effectElements[3].p.v; this.pathMasker.setAttribute('stroke', 'rgb(' + bmFloor(color[0] * 255) + ',' + bmFloor(color[1] * 255) + ',' + bmFloor(color[2] * 255) + ')') } } }; function SVGTritoneFilter(filter, filterManager, elem, id) { this.filterManager = filterManager; var feColorMatrix = createNS('feColorMatrix'); feColorMatrix.setAttribute('type', 'matrix'); feColorMatrix.setAttribute('color-interpolation-filters', 'linearRGB'); feColorMatrix.setAttribute('values', '0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'); filter.appendChild(feColorMatrix); var feComponentTransfer = createNS('feComponentTransfer'); feComponentTransfer.setAttribute('color-interpolation-filters', 'sRGB'); feComponentTransfer.setAttribute('result', id); this.matrixFilter = feComponentTransfer; var feFuncR = createNS('feFuncR'); feFuncR.setAttribute('type', 'table'); feComponentTransfer.appendChild(feFuncR); this.feFuncR = feFuncR; var feFuncG = createNS('feFuncG'); feFuncG.setAttribute('type', 'table'); feComponentTransfer.appendChild(feFuncG); this.feFuncG = feFuncG; var feFuncB = createNS('feFuncB'); feFuncB.setAttribute('type', 'table'); feComponentTransfer.appendChild(feFuncB); this.feFuncB = feFuncB; filter.appendChild(feComponentTransfer) } SVGTritoneFilter.prototype.renderFrame = function (forceRender) { if (forceRender || this.filterManager._mdf) { var color1 = this.filterManager.effectElements[0].p.v; var color2 = this.filterManager.effectElements[1].p.v; var color3 = this.filterManager.effectElements[2].p.v; var tableR = color3[0] + ' ' + color2[0] + ' ' + color1[0]; var tableG = color3[1] + ' ' + color2[1] + ' ' + color1[1]; var tableB = color3[2] + ' ' + color2[2] + ' ' + color1[2]; this.feFuncR.setAttribute('tableValues', tableR); this.feFuncG.setAttribute('tableValues', tableG); this.feFuncB.setAttribute('tableValues', tableB) } }; function SVGProLevelsFilter(filter, filterManager, elem, id) { this.filterManager = filterManager; var effectElements = this.filterManager.effectElements; var feComponentTransfer = createNS('feComponentTransfer'); if (effectElements[10].p.k || effectElements[10].p.v !== 0 || effectElements[11].p.k || effectElements[11].p.v !== 1 || effectElements[12].p.k || effectElements[12].p.v !== 1 || effectElements[13].p.k || effectElements[13].p.v !== 0 || effectElements[14].p.k || effectElements[14].p.v !== 1) { this.feFuncR = this.createFeFunc('feFuncR', feComponentTransfer) } if (effectElements[17].p.k || effectElements[17].p.v !== 0 || effectElements[18].p.k || effectElements[18].p.v !== 1 || effectElements[19].p.k || effectElements[19].p.v !== 1 || effectElements[20].p.k || effectElements[20].p.v !== 0 || effectElements[21].p.k || effectElements[21].p.v !== 1) { this.feFuncG = this.createFeFunc('feFuncG', feComponentTransfer) } if (effectElements[24].p.k || effectElements[24].p.v !== 0 || effectElements[25].p.k || effectElements[25].p.v !== 1 || effectElements[26].p.k || effectElements[26].p.v !== 1 || effectElements[27].p.k || effectElements[27].p.v !== 0 || effectElements[28].p.k || effectElements[28].p.v !== 1) { this.feFuncB = this.createFeFunc('feFuncB', feComponentTransfer) } if (effectElements[31].p.k || effectElements[31].p.v !== 0 || effectElements[32].p.k || effectElements[32].p.v !== 1 || effectElements[33].p.k || effectElements[33].p.v !== 1 || effectElements[34].p.k || effectElements[34].p.v !== 0 || effectElements[35].p.k || effectElements[35].p.v !== 1) { this.feFuncA = this.createFeFunc('feFuncA', feComponentTransfer) } if (this.feFuncR || this.feFuncG || this.feFuncB || this.feFuncA) { feComponentTransfer.setAttribute('color-interpolation-filters', 'sRGB'); filter.appendChild(feComponentTransfer) } if (effectElements[3].p.k || effectElements[3].p.v !== 0 || effectElements[4].p.k || effectElements[4].p.v !== 1 || effectElements[5].p.k || effectElements[5].p.v !== 1 || effectElements[6].p.k || effectElements[6].p.v !== 0 || effectElements[7].p.k || effectElements[7].p.v !== 1) { feComponentTransfer = createNS('feComponentTransfer'); feComponentTransfer.setAttribute('color-interpolation-filters', 'sRGB'); feComponentTransfer.setAttribute('result', id); filter.appendChild(feComponentTransfer); this.feFuncRComposed = this.createFeFunc('feFuncR', feComponentTransfer); this.feFuncGComposed = this.createFeFunc('feFuncG', feComponentTransfer); this.feFuncBComposed = this.createFeFunc('feFuncB', feComponentTransfer) } } SVGProLevelsFilter.prototype.createFeFunc = function (type, feComponentTransfer) { var feFunc = createNS(type); feFunc.setAttribute('type', 'table'); feComponentTransfer.appendChild(feFunc); return feFunc }; SVGProLevelsFilter.prototype.getTableValue = function (inputBlack, inputWhite, gamma, outputBlack, outputWhite) { var cnt = 0; var segments = 256; var perc; var min = Math.min(inputBlack, inputWhite); var max = Math.max(inputBlack, inputWhite); var table = Array.call(null, { length: segments }); var colorValue; var pos = 0; var outputDelta = outputWhite - outputBlack; var inputDelta = inputWhite - inputBlack; while (cnt <= 256) { perc = cnt / 256; if (perc <= min) { colorValue = inputDelta < 0 ? outputWhite : outputBlack } else if (perc>= max) {
colorValue = inputDelta < 0 ? outputBlack : outputWhite
} else {
colorValue = outputBlack + outputDelta * Math.pow((perc - inputBlack) / inputDelta, 1 / gamma)
}
table[pos] = colorValue;
pos += 1;
cnt += 256 / (segments - 1)
}
return table.join(' ')
};
SVGProLevelsFilter.prototype.renderFrame = function (forceRender) {
if (forceRender || this.filterManager._mdf) {
var val;
var effectElements = this.filterManager.effectElements;
if (this.feFuncRComposed && (forceRender || effectElements[3].p._mdf || effectElements[4].p._mdf || effectElements[5].p._mdf || effectElements[6].p._mdf || effectElements[7].p._mdf)) {
val = this.getTableValue(effectElements[3].p.v, effectElements[4].p.v, effectElements[5].p.v, effectElements[6].p.v, effectElements[7].p.v);
this.feFuncRComposed.setAttribute('tableValues', val);
this.feFuncGComposed.setAttribute('tableValues', val);
this.feFuncBComposed.setAttribute('tableValues', val)
}
if (this.feFuncR && (forceRender || effectElements[10].p._mdf || effectElements[11].p._mdf || effectElements[12].p._mdf || effectElements[13].p._mdf || effectElements[14].p._mdf)) {
val = this.getTableValue(effectElements[10].p.v, effectElements[11].p.v, effectElements[12].p.v, effectElements[13].p.v, effectElements[14].p.v);
this.feFuncR.setAttribute('tableValues', val)
}
if (this.feFuncG && (forceRender || effectElements[17].p._mdf || effectElements[18].p._mdf || effectElements[19].p._mdf || effectElements[20].p._mdf || effectElements[21].p._mdf)) {
val = this.getTableValue(effectElements[17].p.v, effectElements[18].p.v, effectElements[19].p.v, effectElements[20].p.v, effectElements[21].p.v);
this.feFuncG.setAttribute('tableValues', val)
}
if (this.feFuncB && (forceRender || effectElements[24].p._mdf || effectElements[25].p._mdf || effectElements[26].p._mdf || effectElements[27].p._mdf || effectElements[28].p._mdf)) {
val = this.getTableValue(effectElements[24].p.v, effectElements[25].p.v, effectElements[26].p.v, effectElements[27].p.v, effectElements[28].p.v);
this.feFuncB.setAttribute('tableValues', val)
}
if (this.feFuncA && (forceRender || effectElements[31].p._mdf || effectElements[32].p._mdf || effectElements[33].p._mdf || effectElements[34].p._mdf || effectElements[35].p._mdf)) {
val = this.getTableValue(effectElements[31].p.v, effectElements[32].p.v, effectElements[33].p.v, effectElements[34].p.v, effectElements[35].p.v);
this.feFuncA.setAttribute('tableValues', val)
}
}
};
function SVGDropShadowEffect(filter, filterManager, elem, id, source) {
var globalFilterSize = filterManager.container.globalData.renderConfig.filterSize;
var filterSize = filterManager.data.fs || globalFilterSize;
filter.setAttribute('x', filterSize.x || globalFilterSize.x);
filter.setAttribute('y', filterSize.y || globalFilterSize.y);
filter.setAttribute('height', filterSize.height || globalFilterSize.height);
this.filterManager = filterManager;
var feGaussianBlur = createNS('feGaussianBlur');
feGaussianBlur.setAttribute('in', 'SourceAlpha');
feGaussianBlur.setAttribute('result', id + '_drop_shadow_1');
feGaussianBlur.setAttribute('stdDeviation', '0');
this.feGaussianBlur = feGaussianBlur;
filter.appendChild(feGaussianBlur);
var feOffset = createNS('feOffset');
feOffset.setAttribute('dx', '25');
feOffset.setAttribute('dy', '0');
feOffset.setAttribute('in', id + '_drop_shadow_1');
feOffset.setAttribute('result', id + '_drop_shadow_2');
this.feOffset = feOffset;
filter.appendChild(feOffset);
var feFlood = createNS('feFlood');
feFlood.setAttribute('flood-color', '#00ff00');
feFlood.setAttribute('flood-opacity', '1');
feFlood.setAttribute('result', id + '_drop_shadow_3');
this.feFlood = feFlood;
filter.appendChild(feFlood);
var feComposite = createNS('feComposite');
feComposite.setAttribute('in', id + '_drop_shadow_3');
feComposite.setAttribute('in2', id + '_drop_shadow_2');
feComposite.setAttribute('operator', 'in');
feComposite.setAttribute('result', id + '_drop_shadow_4');
filter.appendChild(feComposite);
var feMerge = this.createMergeNode(id, [id + '_drop_shadow_4', source]);
filter.appendChild(feMerge)
}
extendPrototype([SVGComposableEffect], SVGDropShadowEffect);
SVGDropShadowEffect.prototype.renderFrame = function (forceRender) {
if (forceRender || this.filterManager._mdf) {
if (forceRender || this.filterManager.effectElements[4].p._mdf) {
this.feGaussianBlur.setAttribute('stdDeviation', this.filterManager.effectElements[4].p.v / 4)
}
if (forceRender || this.filterManager.effectElements[0].p._mdf) {
var col = this.filterManager.effectElements[0].p.v;
this.feFlood.setAttribute('flood-color', rgbToHex(Math.round(col[0] * 255), Math.round(col[1] * 255), Math.round(col[2] * 255)))
}
if (forceRender || this.filterManager.effectElements[1].p._mdf) {
this.feFlood.setAttribute('flood-opacity', this.filterManager.effectElements[1].p.v / 255)
}
if (forceRender || this.filterManager.effectElements[2].p._mdf || this.filterManager.effectElements[3].p._mdf) {
var distance = this.filterManager.effectElements[3].p.v;
var angle = (this.filterManager.effectElements[2].p.v - 90) * degToRads;
var x = distance * Math.cos(angle);
var y = distance * Math.sin(angle);
this.feOffset.setAttribute('dx', x);
this.feOffset.setAttribute('dy', y)
}
}
};
var _svgMatteSymbols = [];
function SVGMatte3Effect(filterElem, filterManager, elem) {
this.initialized = false;
this.filterManager = filterManager;
this.filterElem = filterElem;
this.elem = elem;
elem.matteElement = createNS('g');
elem.matteElement.appendChild(elem.layerElement);
elem.matteElement.appendChild(elem.transformedElement);
elem.baseElement = elem.matteElement
}
SVGMatte3Effect.prototype.findSymbol = function (mask) {
var i = 0;
var len = _svgMatteSymbols.length;
while (i < len) {
if (_svgMatteSymbols[i] === mask) {
return _svgMatteSymbols[i]
}
i += 1
}
return null
};
SVGMatte3Effect.prototype.replaceInParent = function (mask, symbolId) {
var parentNode = mask.layerElement.parentNode;
if (!parentNode) {
return
}
var children = parentNode.children;
var i = 0;
var len = children.length;
while (i < len) {
if (children[i] === mask.layerElement) {
break
}
i += 1
}
var nextChild;
if (i <= len - 2) {
nextChild = children[i + 1]
}
var useElem = createNS('use');
useElem.setAttribute('href', '#' + symbolId);
if (nextChild) {
parentNode.insertBefore(useElem, nextChild)
} else {
parentNode.appendChild(useElem)
}
};
SVGMatte3Effect.prototype.setElementAsMask = function (elem, mask) {
if (!this.findSymbol(mask)) {
var symbolId = createElementID();
var masker = createNS('mask');
masker.setAttribute('id', mask.layerId);
masker.setAttribute('mask-type', 'alpha');
_svgMatteSymbols.push(mask);
var defs = elem.globalData.defs;
defs.appendChild(masker);
var symbol = createNS('symbol');
symbol.setAttribute('id', symbolId);
this.replaceInParent(mask, symbolId);
symbol.appendChild(mask.layerElement);
defs.appendChild(symbol);
var useElem = createNS('use');
useElem.setAttribute('href', '#' + symbolId);
masker.appendChild(useElem);
mask.data.hd = false;
mask.show()
}
elem.setMatte(mask.layerId)
};
SVGMatte3Effect.prototype.initialize = function () {
var ind = this.filterManager.effectElements[0].p.v;
var elements = this.elem.comp.elements;
var i = 0;
var len = elements.length;
while (i < len) {
if (elements[i] && elements[i].data.ind === ind) {
this.setElementAsMask(this.elem, elements[i])
}
i += 1
}
this.initialized = true
};
SVGMatte3Effect.prototype.renderFrame = function () {
if (!this.initialized) {
this.initialize()
}
};
function SVGGaussianBlurEffect(filter, filterManager, elem, id) {
filter.setAttribute('x', '-100%');
filter.setAttribute('y', '-100%');
filter.setAttribute('300%');
filter.setAttribute('height', '300%');
this.filterManager = filterManager;
var feGaussianBlur = createNS('feGaussianBlur');
feGaussianBlur.setAttribute('result', id);
filter.appendChild(feGaussianBlur);
this.feGaussianBlur = feGaussianBlur
}
SVGGaussianBlurEffect.prototype.renderFrame = function (forceRender) {
if (forceRender || this.filterManager._mdf) {
var kBlurrinessToSigma = 0.3;
var sigma = this.filterManager.effectElements[0].p.v * kBlurrinessToSigma;
var dimensions = this.filterManager.effectElements[1].p.v;
var sigmaX = dimensions == 3 ? 0 : sigma;
var sigmaY = dimensions == 2 ? 0 : sigma;
this.feGaussianBlur.setAttribute('stdDeviation', sigmaX + ' ' + sigmaY);
var edgeMode = this.filterManager.effectElements[2].p.v == 1 ? 'wrap' : 'duplicate';
this.feGaussianBlur.setAttribute('edgeMode', edgeMode)
}
};
registerRenderer('canvas', CanvasRenderer);
registerRenderer('html', HybridRenderer);
registerRenderer('svg', SVGRenderer);
ShapeModifiers.registerModifier('tm', TrimModifier);
ShapeModifiers.registerModifier('pb', PuckerAndBloatModifier);
ShapeModifiers.registerModifier('rp', RepeaterModifier);
ShapeModifiers.registerModifier('rd', RoundCornersModifier);
setExpressionsPlugin(Expressions);
initialize1ドル();
initialize();
registerEffect(20, SVGTintFilter, true);
registerEffect(21, SVGFillFilter, true);
registerEffect(22, SVGStrokeEffect, false);
registerEffect(23, SVGTritoneFilter, true);
registerEffect(24, SVGProLevelsFilter, true);
registerEffect(25, SVGDropShadowEffect, true);
registerEffect(28, SVGMatte3Effect, false);
registerEffect(29, SVGGaussianBlurEffect, true);
return lottie
}));