Solves #103
This commit is contained in:
thednp
parent
65a56cd338
commit
b152aa8fa6
|
|
@ -59,15 +59,15 @@
|
|||
<li><a href="https://github.com/thednp/kute.js/wiki">Wiki</a></li>
|
||||
</ul>
|
||||
<ul id="share">
|
||||
<li>
|
||||
<li>
|
||||
<a class="facebook-link" target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=http://thednp.github.io/kute.js/index.html" title="Share KUTE.js on Facebook">
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024"><path class="icon-demo" d="M1008 511.996c0 247.56-181.381 452.76-418.5 490v-346.62h115.561l22-143.381h-137.561v-93.1c0-39.221 19.221-77.461 80.82-77.461h62.561v-122s-56.762-9.68-111.041-9.68c-113.34 0-187.34 68.66-187.34 192.961v109.279h-126v143.381h126v346.62c-237.12-37.24-418.5-242.44-418.5-490 0-274 222-496 496-496s496 222 496 496z" fill="currentColor"></path></svg>
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024"><path class="icon-demo" d="M1008 511.996c0 247.56-181.381 452.76-418.5 490v-346.62h115.561l22-143.381h-137.561v-93.1c0-39.221 19.221-77.461 80.82-77.461h62.561v-122s-56.762-9.68-111.041-9.68c-113.34 0-187.34 68.66-187.34 192.961v109.279h-126v143.381h126v346.62c-237.12-37.24-418.5-242.44-418.5-490 0-274 222-496 496-496s496 222 496 496z" fill="currentColor"></path></svg>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="twitter-link" target="_blank" href="https://twitter.com/intent/tweet?text=Spread the word about %23KUTEJS animation engine by @dnp_theme and download here http://thednp.github.io/kute.js/index.html" title="Share KUTE.js on Twitter">
|
||||
<a class="twitter-link" target="_blank" href="https://twitter.com/intent/tweet?text=Spread the word about %23KUTEjs animation engine by @dnp_theme and download here http://thednp.github.io/kute.js/index.html" title="Share KUTE.js on Twitter">
|
||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024"><path class="icon-demo" d="M886.579 306.995c0.41 8.294 0.563 16.691 0.563 24.986 0 255.488-194.406 549.99-549.888 549.99-109.21 0-210.739-32-296.294-86.886 15.155 1.792 30.515 2.714 46.08 2.714 90.624 0 173.926-30.925 240.026-82.688-84.531-1.587-155.955-57.395-180.531-134.195 11.776 2.202 23.91 3.379 36.352 3.379 17.664 0 34.765-2.304 50.944-6.707-88.422-17.818-155.034-95.898-155.034-189.594 0-0.819 0-1.587 0-2.406 26.061 14.49 55.91 23.194 87.552 24.218-51.866-34.714-86.016-93.798-86.016-160.922 0-35.379 9.523-68.608 26.214-97.178 95.283 116.992 237.773 193.894 398.387 201.984-3.277-14.182-4.966-28.877-4.966-44.083 0-106.701 86.477-193.178 193.229-193.178 55.603 0 105.83 23.398 141.107 60.979 43.981-8.704 85.35-24.781 122.726-46.899-14.438 45.107-45.107 82.995-84.992 106.906 39.117-4.71 76.288-15.002 111.002-30.413-25.907 38.81-58.675 72.806-96.461 99.994z" fill="currentColor"></path></svg>
|
||||
</a>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
/*!
|
||||
* KUTE.js Base v2.0.12 (http://thednp.github.io/kute.js)
|
||||
* KUTE.js Base v2.0.13 (http://thednp.github.io/kute.js)
|
||||
* Copyright 2015-2020 © thednp
|
||||
* Licensed under MIT (https://github.com/thednp/kute.js/blob/master/LICENSE)
|
||||
*/
|
||||
|
|
@ -9,7 +9,7 @@
|
|||
(global = global || self, global.KUTE = factory());
|
||||
}(this, (function () { 'use strict';
|
||||
|
||||
var version = "2.0.12";
|
||||
var version = "2.0.13";
|
||||
|
||||
var KUTE = {};
|
||||
|
||||
|
|
|
|||
4
demo/src/kute-base.min.js
vendored
4
demo/src/kute-base.min.js
vendored
File diff suppressed because one or more lines are too long
|
|
@ -1,5 +1,5 @@
|
|||
/*!
|
||||
* KUTE.js Extra v2.0.12 (http://thednp.github.io/kute.js)
|
||||
* KUTE.js Extra v2.0.13 (http://thednp.github.io/kute.js)
|
||||
* Copyright 2015-2020 © thednp
|
||||
* Licensed under MIT (https://github.com/thednp/kute.js/blob/master/LICENSE)
|
||||
*/
|
||||
|
|
@ -9,7 +9,7 @@
|
|||
(global = global || self, global.KUTE = factory());
|
||||
}(this, (function () { 'use strict';
|
||||
|
||||
var version = "2.0.12";
|
||||
var version = "2.0.13";
|
||||
|
||||
var KUTE = {};
|
||||
|
||||
|
|
@ -21,7 +21,7 @@
|
|||
|
||||
var Interpolate = {};
|
||||
|
||||
var onStart = {};
|
||||
var onStart$1 = {};
|
||||
|
||||
var Time = {};
|
||||
Time.now = self.performance.now.bind(self.performance);
|
||||
|
|
@ -42,11 +42,11 @@
|
|||
if (!Tweens.length && Tick) {
|
||||
cancelAnimationFrame(Tick);
|
||||
Tick = null;
|
||||
for (var obj in onStart) {
|
||||
if (typeof (onStart[obj]) === 'function') {
|
||||
for (var obj in onStart$1) {
|
||||
if (typeof (onStart$1[obj]) === 'function') {
|
||||
KUTE[obj] && (delete KUTE[obj]);
|
||||
} else {
|
||||
for (var prop in onStart[obj]) {
|
||||
for (var prop in onStart$1[obj]) {
|
||||
KUTE[prop] && (delete KUTE[prop]);
|
||||
}
|
||||
}
|
||||
|
|
@ -92,7 +92,7 @@
|
|||
prepareProperty: prepareProperty,
|
||||
prepareStart: prepareStart,
|
||||
crossCheck: crossCheck,
|
||||
onStart: onStart,
|
||||
onStart: onStart$1,
|
||||
onComplete: onComplete,
|
||||
linkProperty: linkProperty
|
||||
};
|
||||
|
|
@ -112,7 +112,7 @@
|
|||
|
||||
function removeAll () { Tweens.length = 0; }
|
||||
|
||||
function linkInterpolation() {
|
||||
function linkInterpolation$1() {
|
||||
var this$1 = this;
|
||||
var loop = function ( component ) {
|
||||
var componentLink = linkProperty[component];
|
||||
|
|
@ -149,7 +149,7 @@
|
|||
getAll: getAll,
|
||||
removeAll: removeAll,
|
||||
stop: stop,
|
||||
linkInterpolation: linkInterpolation
|
||||
linkInterpolation: linkInterpolation$1
|
||||
};
|
||||
|
||||
function getInlineStyle(el) {
|
||||
|
|
@ -369,8 +369,8 @@
|
|||
if( !(internalOption in this ) ) { this[internalOption] = options[op]; }
|
||||
}
|
||||
var easingFnName = this._easing.name;
|
||||
if (!onStart[easingFnName]) {
|
||||
onStart[easingFnName] = function(prop){
|
||||
if (!onStart$1[easingFnName]) {
|
||||
onStart$1[easingFnName] = function(prop){
|
||||
!KUTE[prop] && prop === this._easing.name && (KUTE[prop] = this._easing);
|
||||
};
|
||||
}
|
||||
|
|
@ -385,16 +385,16 @@
|
|||
if (this._onStart) {
|
||||
this._onStart.call(this);
|
||||
}
|
||||
for (var obj in onStart) {
|
||||
if (typeof (onStart[obj]) === 'function') {
|
||||
onStart[obj].call(this,obj);
|
||||
for (var obj in onStart$1) {
|
||||
if (typeof (onStart$1[obj]) === 'function') {
|
||||
onStart$1[obj].call(this,obj);
|
||||
} else {
|
||||
for (var prop in onStart[obj]) {
|
||||
onStart[obj][prop].call(this,prop);
|
||||
for (var prop in onStart$1[obj]) {
|
||||
onStart$1[obj][prop].call(this,prop);
|
||||
}
|
||||
}
|
||||
}
|
||||
linkInterpolation.call(this);
|
||||
linkInterpolation$1.call(this);
|
||||
this._startFired = true;
|
||||
}
|
||||
!Tick && Ticker();
|
||||
|
|
@ -540,6 +540,16 @@
|
|||
if (this._onResume !== undefined) {
|
||||
this._onResume.call(this);
|
||||
}
|
||||
for (var obj in onStart) {
|
||||
if (typeof (onStart[obj]) === 'function') {
|
||||
onStart[obj].call(this,obj);
|
||||
} else {
|
||||
for (var prop in onStart[obj]) {
|
||||
onStart[obj][prop].call(this,prop);
|
||||
}
|
||||
}
|
||||
}
|
||||
linkInterpolation.call(this);
|
||||
this._startTime += KUTE.Time() - this._pauseTime;
|
||||
add(this);
|
||||
!Tick && Ticker();
|
||||
|
|
@ -789,7 +799,7 @@
|
|||
Animation.prototype.setComponent = function setComponent (Component){
|
||||
var propertyInfo = this;
|
||||
var ComponentName = Component.component;
|
||||
var Functions = { prepareProperty: prepareProperty, prepareStart: prepareStart, onStart: onStart, onComplete: onComplete, crossCheck: crossCheck };
|
||||
var Functions = { prepareProperty: prepareProperty, prepareStart: prepareStart, onStart: onStart$1, onComplete: onComplete, crossCheck: crossCheck };
|
||||
var Category = Component.category;
|
||||
var Property = Component.property;
|
||||
var Length = Component.properties && Component.properties.length || Component.subProperties && Component.subProperties.length;
|
||||
|
|
@ -858,7 +868,7 @@
|
|||
AnimationDevelopment.prototype.setComponent = function setComponent (Component){
|
||||
Animation.prototype.setComponent.call(this, Component);
|
||||
var propertyInfo = this;
|
||||
var Functions = { prepareProperty: prepareProperty,prepareStart: prepareStart,onStart: onStart,onComplete: onComplete,crossCheck: crossCheck };
|
||||
var Functions = { prepareProperty: prepareProperty,prepareStart: prepareStart,onStart: onStart$1,onComplete: onComplete,crossCheck: crossCheck };
|
||||
var Category = Component.category;
|
||||
var Property = Component.property;
|
||||
var Length = Component.properties && Component.properties.length || Component.subProperties && Component.subProperties.length;
|
||||
|
|
@ -1222,7 +1232,7 @@
|
|||
if ( currentValue !== null && regex.test(currentValue) ) {
|
||||
var unit = trueDimension(currentValue).u || trueDimension(attrObj[p]).u;
|
||||
var suffix = /%/.test(unit) ? '_percent' : ("_" + unit);
|
||||
onStart[ComponentName][prop+suffix] = function(tp) {
|
||||
onStart$1[ComponentName][prop+suffix] = function(tp) {
|
||||
if ( this.valuesEnd[tweenProp] && this.valuesEnd[tweenProp][tp] && !(tp in attributes) ) {
|
||||
attributes[tp] = function (elem, p, a, b, v) {
|
||||
var _p = p.replace(suffix,'');
|
||||
|
|
@ -1232,7 +1242,7 @@
|
|||
};
|
||||
attributesObject[prop+suffix] = trueDimension(attrObj[p]);
|
||||
} else if ( !regex.test(attrObj[p]) || currentValue === null || currentValue !== null && !regex.test(currentValue) ) {
|
||||
onStart[ComponentName][prop] = function(tp) {
|
||||
onStart$1[ComponentName][prop] = function(tp) {
|
||||
if ( this.valuesEnd[tweenProp] && this.valuesEnd[tweenProp][tp] && !(tp in attributes) ) {
|
||||
attributes[tp] = function (elem, oneAttr, a, b, v) {
|
||||
elem.setAttribute(oneAttr, (numbers(a,b,v) * 1000 >> 0) / 1000 );
|
||||
|
|
@ -1242,7 +1252,7 @@
|
|||
attributesObject[prop] = parseFloat(attrObj[p]);
|
||||
}
|
||||
} else {
|
||||
onStart[ComponentName][prop] = function(tp) {
|
||||
onStart$1[ComponentName][prop] = function(tp) {
|
||||
if ( this.valuesEnd[tweenProp] && this.valuesEnd[tweenProp][tp] && !(tp in attributes) ) {
|
||||
attributes[tp] = function (elem, oneAttr, a, b, v) {
|
||||
elem.setAttribute(oneAttr, colors(a,b,v));
|
||||
|
|
@ -1962,9 +1972,9 @@
|
|||
}
|
||||
function path2curve(path, path2) {
|
||||
var p = pathToAbsolute(path),
|
||||
p2 = path2 && pathToAbsolute(path2),
|
||||
attrs = {x: 0, y: 0, bx: 0, by: 0, X: 0, Y: 0, qx: null, qy: null},
|
||||
attrs2 = {x: 0, y: 0, bx: 0, by: 0, X: 0, Y: 0, qx: null, qy: null};
|
||||
p2 = path2 && pathToAbsolute(path2),
|
||||
attrs = {x: 0, y: 0, bx: 0, by: 0, X: 0, Y: 0, qx: null, qy: null},
|
||||
attrs2 = {x: 0, y: 0, bx: 0, by: 0, X: 0, Y: 0, qx: null, qy: null};
|
||||
var pcoms1 = [], pcoms2 = [], pfirst = "", pcom = "";
|
||||
for (var i = 0, ii = Math.max(p.length, p2 && p2.length || 0); i < ii; i++) {
|
||||
p[i] && (pfirst = p[i][0]);
|
||||
|
|
@ -1993,9 +2003,9 @@
|
|||
p2 && fixM(p2, p, attrs2, attrs, i);
|
||||
ii = Math.max(p.length, p2 && p2.length || 0);
|
||||
var seg = p[i],
|
||||
seg2 = p2 && p2[i],
|
||||
seglen = seg.length,
|
||||
seg2len = p2 && seg2.length;
|
||||
seg2 = p2 && p2[i],
|
||||
seglen = seg.length,
|
||||
seg2len = p2 && seg2.length;
|
||||
attrs.x = seg[seglen - 2];
|
||||
attrs.y = seg[seglen - 1];
|
||||
attrs.bx = parseFloat(seg[seglen - 4]) || attrs.x;
|
||||
|
|
@ -2014,15 +2024,13 @@
|
|||
return np
|
||||
}
|
||||
function getSegments(curveArray) {
|
||||
var result = [];
|
||||
curveArray.map(function (seg, i) {
|
||||
result[i] = {
|
||||
return curveArray.map(function (seg) {
|
||||
return {
|
||||
x: seg[seg[0] === 'M' ? 1 : 5],
|
||||
y: seg[seg[0] === 'M' ? 2 : 6],
|
||||
seg: seg
|
||||
};
|
||||
});
|
||||
return result
|
||||
}
|
||||
})
|
||||
}
|
||||
function reverseCurve(path){
|
||||
var newSegments = [],
|
||||
|
|
|
|||
4
demo/src/kute-extra.min.js
vendored
4
demo/src/kute-extra.min.js
vendored
File diff suppressed because one or more lines are too long
4
demo/src/kute.min.js
vendored
4
demo/src/kute.min.js
vendored
File diff suppressed because one or more lines are too long
57
dist/kute.esm.js
vendored
57
dist/kute.esm.js
vendored
|
|
@ -1,9 +1,9 @@
|
|||
/*!
|
||||
* KUTE.js Standard v2.0.12 (http://thednp.github.io/kute.js)
|
||||
* KUTE.js Standard v2.0.13 (http://thednp.github.io/kute.js)
|
||||
* Copyright 2015-2020 © thednp
|
||||
* Licensed under MIT (https://github.com/thednp/kute.js/blob/master/LICENSE)
|
||||
*/
|
||||
var version = "2.0.12";
|
||||
var version = "2.0.13";
|
||||
|
||||
var KUTE = {};
|
||||
|
||||
|
|
@ -15,7 +15,7 @@ var globalObject = typeof (global) !== 'undefined' ? global
|
|||
|
||||
var Interpolate = {};
|
||||
|
||||
var onStart = {};
|
||||
var onStart$1 = {};
|
||||
|
||||
var Time = {};
|
||||
Time.now = self.performance.now.bind(self.performance);
|
||||
|
|
@ -36,11 +36,11 @@ function stop() {
|
|||
if (!Tweens.length && Tick) {
|
||||
cancelAnimationFrame(Tick);
|
||||
Tick = null;
|
||||
for (var obj in onStart) {
|
||||
if (typeof (onStart[obj]) === 'function') {
|
||||
for (var obj in onStart$1) {
|
||||
if (typeof (onStart$1[obj]) === 'function') {
|
||||
KUTE[obj] && (delete KUTE[obj]);
|
||||
} else {
|
||||
for (var prop in onStart[obj]) {
|
||||
for (var prop in onStart$1[obj]) {
|
||||
KUTE[prop] && (delete KUTE[prop]);
|
||||
}
|
||||
}
|
||||
|
|
@ -86,7 +86,7 @@ var Objects = {
|
|||
prepareProperty: prepareProperty,
|
||||
prepareStart: prepareStart,
|
||||
crossCheck: crossCheck,
|
||||
onStart: onStart,
|
||||
onStart: onStart$1,
|
||||
onComplete: onComplete,
|
||||
linkProperty: linkProperty
|
||||
};
|
||||
|
|
@ -106,7 +106,7 @@ function getAll () { return Tweens; }
|
|||
|
||||
function removeAll () { Tweens.length = 0; }
|
||||
|
||||
function linkInterpolation() {
|
||||
function linkInterpolation$1() {
|
||||
var this$1 = this;
|
||||
var loop = function ( component ) {
|
||||
var componentLink = linkProperty[component];
|
||||
|
|
@ -143,7 +143,7 @@ var Internals = {
|
|||
getAll: getAll,
|
||||
removeAll: removeAll,
|
||||
stop: stop,
|
||||
linkInterpolation: linkInterpolation
|
||||
linkInterpolation: linkInterpolation$1
|
||||
};
|
||||
|
||||
function getInlineStyle(el) {
|
||||
|
|
@ -363,8 +363,8 @@ var TweenBase = function TweenBase(targetElement, startObject, endObject, option
|
|||
if( !(internalOption in this ) ) { this[internalOption] = options[op]; }
|
||||
}
|
||||
var easingFnName = this._easing.name;
|
||||
if (!onStart[easingFnName]) {
|
||||
onStart[easingFnName] = function(prop){
|
||||
if (!onStart$1[easingFnName]) {
|
||||
onStart$1[easingFnName] = function(prop){
|
||||
!KUTE[prop] && prop === this._easing.name && (KUTE[prop] = this._easing);
|
||||
};
|
||||
}
|
||||
|
|
@ -379,16 +379,16 @@ TweenBase.prototype.start = function start (time) {
|
|||
if (this._onStart) {
|
||||
this._onStart.call(this);
|
||||
}
|
||||
for (var obj in onStart) {
|
||||
if (typeof (onStart[obj]) === 'function') {
|
||||
onStart[obj].call(this,obj);
|
||||
for (var obj in onStart$1) {
|
||||
if (typeof (onStart$1[obj]) === 'function') {
|
||||
onStart$1[obj].call(this,obj);
|
||||
} else {
|
||||
for (var prop in onStart[obj]) {
|
||||
onStart[obj][prop].call(this,prop);
|
||||
for (var prop in onStart$1[obj]) {
|
||||
onStart$1[obj][prop].call(this,prop);
|
||||
}
|
||||
}
|
||||
}
|
||||
linkInterpolation.call(this);
|
||||
linkInterpolation$1.call(this);
|
||||
this._startFired = true;
|
||||
}
|
||||
!Tick && Ticker();
|
||||
|
|
@ -534,6 +534,16 @@ var Tween = (function (TweenBase) {
|
|||
if (this._onResume !== undefined) {
|
||||
this._onResume.call(this);
|
||||
}
|
||||
for (var obj in onStart) {
|
||||
if (typeof (onStart[obj]) === 'function') {
|
||||
onStart[obj].call(this,obj);
|
||||
} else {
|
||||
for (var prop in onStart[obj]) {
|
||||
onStart[obj][prop].call(this,prop);
|
||||
}
|
||||
}
|
||||
}
|
||||
linkInterpolation.call(this);
|
||||
this._startTime += KUTE.Time() - this._pauseTime;
|
||||
add(this);
|
||||
!Tick && Ticker();
|
||||
|
|
@ -698,7 +708,7 @@ var Animation = function Animation(Component){
|
|||
Animation.prototype.setComponent = function setComponent (Component){
|
||||
var propertyInfo = this;
|
||||
var ComponentName = Component.component;
|
||||
var Functions = { prepareProperty: prepareProperty, prepareStart: prepareStart, onStart: onStart, onComplete: onComplete, crossCheck: crossCheck };
|
||||
var Functions = { prepareProperty: prepareProperty, prepareStart: prepareStart, onStart: onStart$1, onComplete: onComplete, crossCheck: crossCheck };
|
||||
var Category = Component.category;
|
||||
var Property = Component.property;
|
||||
var Length = Component.properties && Component.properties.length || Component.subProperties && Component.subProperties.length;
|
||||
|
|
@ -926,7 +936,7 @@ function prepareAttr(tweenProp,attrObj){
|
|||
if ( currentValue !== null && regex.test(currentValue) ) {
|
||||
var unit = trueDimension(currentValue).u || trueDimension(attrObj[p]).u;
|
||||
var suffix = /%/.test(unit) ? '_percent' : ("_" + unit);
|
||||
onStart[ComponentName][prop+suffix] = function(tp) {
|
||||
onStart$1[ComponentName][prop+suffix] = function(tp) {
|
||||
if ( this.valuesEnd[tweenProp] && this.valuesEnd[tweenProp][tp] && !(tp in attributes) ) {
|
||||
attributes[tp] = function (elem, p, a, b, v) {
|
||||
var _p = p.replace(suffix,'');
|
||||
|
|
@ -936,7 +946,7 @@ function prepareAttr(tweenProp,attrObj){
|
|||
};
|
||||
attributesObject[prop+suffix] = trueDimension(attrObj[p]);
|
||||
} else if ( !regex.test(attrObj[p]) || currentValue === null || currentValue !== null && !regex.test(currentValue) ) {
|
||||
onStart[ComponentName][prop] = function(tp) {
|
||||
onStart$1[ComponentName][prop] = function(tp) {
|
||||
if ( this.valuesEnd[tweenProp] && this.valuesEnd[tweenProp][tp] && !(tp in attributes) ) {
|
||||
attributes[tp] = function (elem, oneAttr, a, b, v) {
|
||||
elem.setAttribute(oneAttr, (numbers(a,b,v) * 1000 >> 0) / 1000 );
|
||||
|
|
@ -946,7 +956,7 @@ function prepareAttr(tweenProp,attrObj){
|
|||
attributesObject[prop] = parseFloat(attrObj[p]);
|
||||
}
|
||||
} else {
|
||||
onStart[ComponentName][prop] = function(tp) {
|
||||
onStart$1[ComponentName][prop] = function(tp) {
|
||||
if ( this.valuesEnd[tweenProp] && this.valuesEnd[tweenProp][tp] && !(tp in attributes) ) {
|
||||
attributes[tp] = function (elem, oneAttr, a, b, v) {
|
||||
elem.setAttribute(oneAttr, colors(a,b,v));
|
||||
|
|
@ -1446,9 +1456,8 @@ function coords(a, b, l, v) {
|
|||
function onStartSVGMorph(tweenProp){
|
||||
if (!KUTE[tweenProp] && this.valuesEnd[tweenProp]) {
|
||||
KUTE[tweenProp] = function (elem, a, b, v) {
|
||||
var path1 = a.pathArray, path2 = b.pathArray, len = path2.length, pathString;
|
||||
pathString = v === 1 ? b.original : ("M" + (coords( path1, path2, len, v ).join('L')) + "Z");
|
||||
elem.setAttribute("d", pathString );
|
||||
var path1 = a.pathArray, path2 = b.pathArray, len = path2.length;
|
||||
elem.setAttribute("d", (v === 1 ? b.original : ("M" + (coords( path1, path2, len, v ).join('L')) + "Z")) );
|
||||
};
|
||||
}
|
||||
}
|
||||
|
|
|
|||
4
dist/kute.esm.min.js
vendored
4
dist/kute.esm.min.js
vendored
File diff suppressed because one or more lines are too long
57
dist/kute.js
vendored
57
dist/kute.js
vendored
|
|
@ -1,5 +1,5 @@
|
|||
/*!
|
||||
* KUTE.js Standard v2.0.12 (http://thednp.github.io/kute.js)
|
||||
* KUTE.js Standard v2.0.13 (http://thednp.github.io/kute.js)
|
||||
* Copyright 2015-2020 © thednp
|
||||
* Licensed under MIT (https://github.com/thednp/kute.js/blob/master/LICENSE)
|
||||
*/
|
||||
|
|
@ -9,7 +9,7 @@
|
|||
(global = global || self, global.KUTE = factory());
|
||||
}(this, (function () { 'use strict';
|
||||
|
||||
var version = "2.0.12";
|
||||
var version = "2.0.13";
|
||||
|
||||
var KUTE = {};
|
||||
|
||||
|
|
@ -21,7 +21,7 @@
|
|||
|
||||
var Interpolate = {};
|
||||
|
||||
var onStart = {};
|
||||
var onStart$1 = {};
|
||||
|
||||
var Time = {};
|
||||
Time.now = self.performance.now.bind(self.performance);
|
||||
|
|
@ -42,11 +42,11 @@
|
|||
if (!Tweens.length && Tick) {
|
||||
cancelAnimationFrame(Tick);
|
||||
Tick = null;
|
||||
for (var obj in onStart) {
|
||||
if (typeof (onStart[obj]) === 'function') {
|
||||
for (var obj in onStart$1) {
|
||||
if (typeof (onStart$1[obj]) === 'function') {
|
||||
KUTE[obj] && (delete KUTE[obj]);
|
||||
} else {
|
||||
for (var prop in onStart[obj]) {
|
||||
for (var prop in onStart$1[obj]) {
|
||||
KUTE[prop] && (delete KUTE[prop]);
|
||||
}
|
||||
}
|
||||
|
|
@ -92,7 +92,7 @@
|
|||
prepareProperty: prepareProperty,
|
||||
prepareStart: prepareStart,
|
||||
crossCheck: crossCheck,
|
||||
onStart: onStart,
|
||||
onStart: onStart$1,
|
||||
onComplete: onComplete,
|
||||
linkProperty: linkProperty
|
||||
};
|
||||
|
|
@ -112,7 +112,7 @@
|
|||
|
||||
function removeAll () { Tweens.length = 0; }
|
||||
|
||||
function linkInterpolation() {
|
||||
function linkInterpolation$1() {
|
||||
var this$1 = this;
|
||||
var loop = function ( component ) {
|
||||
var componentLink = linkProperty[component];
|
||||
|
|
@ -149,7 +149,7 @@
|
|||
getAll: getAll,
|
||||
removeAll: removeAll,
|
||||
stop: stop,
|
||||
linkInterpolation: linkInterpolation
|
||||
linkInterpolation: linkInterpolation$1
|
||||
};
|
||||
|
||||
function getInlineStyle(el) {
|
||||
|
|
@ -369,8 +369,8 @@
|
|||
if( !(internalOption in this ) ) { this[internalOption] = options[op]; }
|
||||
}
|
||||
var easingFnName = this._easing.name;
|
||||
if (!onStart[easingFnName]) {
|
||||
onStart[easingFnName] = function(prop){
|
||||
if (!onStart$1[easingFnName]) {
|
||||
onStart$1[easingFnName] = function(prop){
|
||||
!KUTE[prop] && prop === this._easing.name && (KUTE[prop] = this._easing);
|
||||
};
|
||||
}
|
||||
|
|
@ -385,16 +385,16 @@
|
|||
if (this._onStart) {
|
||||
this._onStart.call(this);
|
||||
}
|
||||
for (var obj in onStart) {
|
||||
if (typeof (onStart[obj]) === 'function') {
|
||||
onStart[obj].call(this,obj);
|
||||
for (var obj in onStart$1) {
|
||||
if (typeof (onStart$1[obj]) === 'function') {
|
||||
onStart$1[obj].call(this,obj);
|
||||
} else {
|
||||
for (var prop in onStart[obj]) {
|
||||
onStart[obj][prop].call(this,prop);
|
||||
for (var prop in onStart$1[obj]) {
|
||||
onStart$1[obj][prop].call(this,prop);
|
||||
}
|
||||
}
|
||||
}
|
||||
linkInterpolation.call(this);
|
||||
linkInterpolation$1.call(this);
|
||||
this._startFired = true;
|
||||
}
|
||||
!Tick && Ticker();
|
||||
|
|
@ -540,6 +540,16 @@
|
|||
if (this._onResume !== undefined) {
|
||||
this._onResume.call(this);
|
||||
}
|
||||
for (var obj in onStart) {
|
||||
if (typeof (onStart[obj]) === 'function') {
|
||||
onStart[obj].call(this,obj);
|
||||
} else {
|
||||
for (var prop in onStart[obj]) {
|
||||
onStart[obj][prop].call(this,prop);
|
||||
}
|
||||
}
|
||||
}
|
||||
linkInterpolation.call(this);
|
||||
this._startTime += KUTE.Time() - this._pauseTime;
|
||||
add(this);
|
||||
!Tick && Ticker();
|
||||
|
|
@ -704,7 +714,7 @@
|
|||
Animation.prototype.setComponent = function setComponent (Component){
|
||||
var propertyInfo = this;
|
||||
var ComponentName = Component.component;
|
||||
var Functions = { prepareProperty: prepareProperty, prepareStart: prepareStart, onStart: onStart, onComplete: onComplete, crossCheck: crossCheck };
|
||||
var Functions = { prepareProperty: prepareProperty, prepareStart: prepareStart, onStart: onStart$1, onComplete: onComplete, crossCheck: crossCheck };
|
||||
var Category = Component.category;
|
||||
var Property = Component.property;
|
||||
var Length = Component.properties && Component.properties.length || Component.subProperties && Component.subProperties.length;
|
||||
|
|
@ -932,7 +942,7 @@
|
|||
if ( currentValue !== null && regex.test(currentValue) ) {
|
||||
var unit = trueDimension(currentValue).u || trueDimension(attrObj[p]).u;
|
||||
var suffix = /%/.test(unit) ? '_percent' : ("_" + unit);
|
||||
onStart[ComponentName][prop+suffix] = function(tp) {
|
||||
onStart$1[ComponentName][prop+suffix] = function(tp) {
|
||||
if ( this.valuesEnd[tweenProp] && this.valuesEnd[tweenProp][tp] && !(tp in attributes) ) {
|
||||
attributes[tp] = function (elem, p, a, b, v) {
|
||||
var _p = p.replace(suffix,'');
|
||||
|
|
@ -942,7 +952,7 @@
|
|||
};
|
||||
attributesObject[prop+suffix] = trueDimension(attrObj[p]);
|
||||
} else if ( !regex.test(attrObj[p]) || currentValue === null || currentValue !== null && !regex.test(currentValue) ) {
|
||||
onStart[ComponentName][prop] = function(tp) {
|
||||
onStart$1[ComponentName][prop] = function(tp) {
|
||||
if ( this.valuesEnd[tweenProp] && this.valuesEnd[tweenProp][tp] && !(tp in attributes) ) {
|
||||
attributes[tp] = function (elem, oneAttr, a, b, v) {
|
||||
elem.setAttribute(oneAttr, (numbers(a,b,v) * 1000 >> 0) / 1000 );
|
||||
|
|
@ -952,7 +962,7 @@
|
|||
attributesObject[prop] = parseFloat(attrObj[p]);
|
||||
}
|
||||
} else {
|
||||
onStart[ComponentName][prop] = function(tp) {
|
||||
onStart$1[ComponentName][prop] = function(tp) {
|
||||
if ( this.valuesEnd[tweenProp] && this.valuesEnd[tweenProp][tp] && !(tp in attributes) ) {
|
||||
attributes[tp] = function (elem, oneAttr, a, b, v) {
|
||||
elem.setAttribute(oneAttr, colors(a,b,v));
|
||||
|
|
@ -1452,9 +1462,8 @@
|
|||
function onStartSVGMorph(tweenProp){
|
||||
if (!KUTE[tweenProp] && this.valuesEnd[tweenProp]) {
|
||||
KUTE[tweenProp] = function (elem, a, b, v) {
|
||||
var path1 = a.pathArray, path2 = b.pathArray, len = path2.length, pathString;
|
||||
pathString = v === 1 ? b.original : ("M" + (coords( path1, path2, len, v ).join('L')) + "Z");
|
||||
elem.setAttribute("d", pathString );
|
||||
var path1 = a.pathArray, path2 = b.pathArray, len = path2.length;
|
||||
elem.setAttribute("d", (v === 1 ? b.original : ("M" + (coords( path1, path2, len, v ).join('L')) + "Z")) );
|
||||
};
|
||||
}
|
||||
}
|
||||
|
|
|
|||
4
dist/kute.min.js
vendored
4
dist/kute.min.js
vendored
File diff suppressed because one or more lines are too long
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "kute.js",
|
||||
"version": "2.0.12",
|
||||
"version": "2.0.13",
|
||||
"description": "JavaScript animation engine of the future is called KUTE.js.",
|
||||
"main": "dist/kute.min.js",
|
||||
"module": "dist/kute.esm.js",
|
||||
|
|
|
|||
|
|
@ -96,7 +96,6 @@ function parsePathString(pathString) {
|
|||
if( pathString instanceof Array ) {
|
||||
return pathString;
|
||||
} else {
|
||||
|
||||
// tracer minifier cannot compute this string for some reason
|
||||
// let spaces = "\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029";
|
||||
let spaces = `\\${("x09|x0a|x0b|x0c|x0d|x20|xa0|u1680|u180e|u2000|u2001|u2002|u2003|u2004|u2005|u2006|u2007|u2008|u2009|u200a|u202f|u205f|u3000|u2028|u2029").split('|').join('\\')}`,
|
||||
|
|
@ -245,6 +244,7 @@ function pathToAbsolute(pathArray) {
|
|||
}
|
||||
return res
|
||||
}
|
||||
|
||||
function l2c(x1, y1, x2, y2) {
|
||||
return [x1, y1, x2, y2, x2, y2];
|
||||
}
|
||||
|
|
@ -434,11 +434,11 @@ function fixArc (p, p2, pcoms1, pcoms2, i) {
|
|||
}
|
||||
|
||||
function path2curve(path, path2) {
|
||||
const p = pathToAbsolute(path), // holder for previous path command of original path
|
||||
p2 = path2 && pathToAbsolute(path2),
|
||||
// p2 = path2 ? pathToAbsolute(path2) : pathToAbsolute('M0,0L0,0'),
|
||||
attrs = {x: 0, y: 0, bx: 0, by: 0, X: 0, Y: 0, qx: null, qy: null},
|
||||
attrs2 = {x: 0, y: 0, bx: 0, by: 0, X: 0, Y: 0, qx: null, qy: null};
|
||||
let p = pathToAbsolute(path), // holder for previous path command of original path
|
||||
p2 = path2 && pathToAbsolute(path2),
|
||||
// p2 = path2 ? pathToAbsolute(path2) : pathToAbsolute('M0,0L0,0'),
|
||||
attrs = {x: 0, y: 0, bx: 0, by: 0, X: 0, Y: 0, qx: null, qy: null},
|
||||
attrs2 = {x: 0, y: 0, bx: 0, by: 0, X: 0, Y: 0, qx: null, qy: null};
|
||||
|
||||
// path commands of original path p
|
||||
// path commands of original path p2
|
||||
|
|
@ -483,10 +483,10 @@ function path2curve(path, path2) {
|
|||
p2 && fixM(p2, p, attrs2, attrs, i);
|
||||
ii = Math.max(p.length, p2 && p2.length || 0);
|
||||
|
||||
const seg = p[i],
|
||||
seg2 = p2 && p2[i],
|
||||
seglen = seg.length,
|
||||
seg2len = p2 && seg2.length;
|
||||
let seg = p[i],
|
||||
seg2 = p2 && p2[i],
|
||||
seglen = seg.length,
|
||||
seg2len = p2 && seg2.length;
|
||||
attrs.x = seg[seglen - 2];
|
||||
attrs.y = seg[seglen - 1];
|
||||
attrs.bx = parseFloat(seg[seglen - 4]) || attrs.x;
|
||||
|
|
@ -508,15 +508,23 @@ function createPath (path) { // create a <path> when glyph
|
|||
}
|
||||
|
||||
function getSegments(curveArray) {
|
||||
let result = []
|
||||
curveArray.map((seg, i) => {
|
||||
result[i] = {
|
||||
// let result = []
|
||||
// curveArray.map((seg, i) => {
|
||||
// result[i] = {
|
||||
// x: seg[seg[0] === 'M' ? 1 : 5],
|
||||
// y: seg[seg[0] === 'M' ? 2 : 6],
|
||||
// seg: seg
|
||||
// }
|
||||
// })
|
||||
// return result
|
||||
|
||||
return curveArray.map(seg => {
|
||||
return {
|
||||
x: seg[seg[0] === 'M' ? 1 : 5],
|
||||
y: seg[seg[0] === 'M' ? 2 : 6],
|
||||
seg: seg
|
||||
}
|
||||
})
|
||||
return result
|
||||
}
|
||||
function reverseCurve(path){
|
||||
let newSegments = [],
|
||||
|
|
|
|||
|
|
@ -7,9 +7,8 @@ import coords from '../interpolation/coords.js'
|
|||
export function onStartSVGMorph(tweenProp){
|
||||
if (!KUTE[tweenProp] && this.valuesEnd[tweenProp]) {
|
||||
KUTE[tweenProp] = (elem, a, b, v) => {
|
||||
let path1 = a.pathArray, path2 = b.pathArray, len = path2.length, pathString;
|
||||
pathString = v === 1 ? b.original : `M${coords( path1, path2, len, v ).join('L')}Z`;
|
||||
elem.setAttribute("d", pathString );
|
||||
let path1 = a.pathArray, path2 = b.pathArray, len = path2.length;
|
||||
elem.setAttribute("d", (v === 1 ? b.original : `M${coords( path1, path2, len, v ).join('L')}Z`) );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -134,6 +134,18 @@ export default class Tween extends TweenBase {
|
|||
if (this._onResume !== undefined) {
|
||||
this._onResume.call(this);
|
||||
}
|
||||
// re-queue execution context
|
||||
for (let obj in onStart) {
|
||||
if (typeof (onStart[obj]) === 'function') {
|
||||
onStart[obj].call(this,obj);
|
||||
} else {
|
||||
for (let prop in onStart[obj]) {
|
||||
onStart[obj][prop].call(this,prop);
|
||||
}
|
||||
}
|
||||
}
|
||||
linkInterpolation.call(this);
|
||||
// update time and let it roll
|
||||
this._startTime += KUTE.Time() - this._pauseTime;
|
||||
add(this);
|
||||
!Tick && Ticker(); // restart ticking if stopped
|
||||
|
|
|
|||
|
|
@ -75,11 +75,11 @@ export default class TweenBase {
|
|||
}
|
||||
|
||||
// fire onStart actions
|
||||
for (const obj in onStart) {
|
||||
for (let obj in onStart) {
|
||||
if (typeof (onStart[obj]) === 'function') {
|
||||
onStart[obj].call(this,obj) // easing functions
|
||||
} else {
|
||||
for (const prop in onStart[obj]) {
|
||||
for (let prop in onStart[obj]) {
|
||||
onStart[obj][prop].call(this,prop);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue