Skip to content

Commit

Permalink
changed buildBezierData signature
Browse files Browse the repository at this point in the history
  • Loading branch information
@bodymovin
bodymovin committed Feb 14, 2019
1 parent 32c44ec commit 9727c9f
Show file tree
Hide file tree
Showing 5 changed files with 64 additions and 72 deletions.
2 changes: 1 addition & 1 deletion player/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -163,7 +163,7 @@
var elem = document.getElementById('lottie');
var animData = {
container: elem,
renderer: 'canvas',
renderer: 'svg',
loop: true,
autoplay: true,
rendererSettings: {
Expand Down
15 changes: 9 additions & 6 deletions player/js/utils/PropertyFactory.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,9 +39,10 @@ var PropertyFactory = (function(){
var k, kLen, perc, jLen, j, fnc;
var nextKeyTime = nextKeyData.t - offsetTime;
var keyTime = keyData.t - offsetTime;
var endValue;
if (keyData.to) {
if (!keyData.bezierData) {
bez.buildBezierData(keyData);
keyData.bezierData = bez.buildBezierData(keyData.s, nextKeyData.s || keyData.e, keyData.to, keyData.ti);
}
var bezierData = keyData.bezierData;
if (frameNum >= nextKeyTime || frameNum < keyTime) {
Expand Down Expand Up @@ -95,18 +96,19 @@ var PropertyFactory = (function(){
} else {
var outX, outY, inX, inY, keyValue;
len = keyData.s.length;
endValue = nextKeyData.s || keyData.e;
if (this.sh && keyData.h !== 1) {
if (frameNum >= nextKeyTime) {
newValue[0] = keyData.e[0];
newValue[1] = keyData.e[1];
newValue[2] = keyData.e[2];
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(keyData.e);
var quatEnd = createQuaternion(endValue);
var time = (frameNum - keyTime) / (nextKeyTime - keyTime);
quaternionToEuler(newValue, slerp(quatStart, quatEnd, time));
}
Expand Down Expand Up @@ -150,7 +152,8 @@ var PropertyFactory = (function(){
}
}

keyValue = keyData.h === 1 ? keyData.s[i] : keyData.s[i] + (keyData.e[i] - keyData.s[i]) * perc;
endValue = nextKeyData.s || keyData.e;
keyValue = keyData.h === 1 ? keyData.s[i] : keyData.s[i] + (endValue[i] - keyData.s[i]) * perc;

if (len === 1) {
newValue = keyValue;
Expand Down
64 changes: 29 additions & 35 deletions player/js/utils/bez.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -99,45 +99,39 @@ function bezFunction(){

var storedData = {};

return function (keyData){
var pt1 = keyData.s;
var pt2 = keyData.e;
var pt3 = keyData.to;
var pt4 = keyData.ti;
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]){
keyData.bezierData = storedData[bezierName];
return;
}
var curveSegments = defaultCurveSegments;
var k, i, len;
var ptCoord,perc,addedLength = 0;
var ptDistance;
var point,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 = bm_pow(1-perc,3)*pt1[i]+3*bm_pow(1-perc,2)*perc*(pt1[i] + pt3[i])+3*(1-perc)*bm_pow(perc,2)*(pt2[i] + pt4[i])+bm_pow(perc,3)*pt2[i];
point[i] = ptCoord;
if(lastPoint !== null){
ptDistance += bm_pow(point[i] - lastPoint[i],2);
if(!storedData[bezierName]){
var curveSegments = defaultCurveSegments;
var k, i, len;
var ptCoord,perc,addedLength = 0;
var ptDistance;
var point,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 = bm_pow(1-perc,3)*pt1[i]+3*bm_pow(1-perc,2)*perc*(pt1[i] + pt3[i])+3*(1-perc)*bm_pow(perc,2)*(pt2[i] + pt4[i])+bm_pow(perc,3)*pt2[i];
point[i] = ptCoord;
if(lastPoint !== null){
ptDistance += bm_pow(point[i] - lastPoint[i],2);
}
}
ptDistance = bm_sqrt(ptDistance);
addedLength += ptDistance;
bezierData.points[k] = new PointData(ptDistance, point);
lastPoint = point;
}
ptDistance = bm_sqrt(ptDistance);
addedLength += ptDistance;
bezierData.points[k] = new PointData(ptDistance, point);
lastPoint = point;
bezierData.segmentLength = addedLength;
storedData[bezierName] = bezierData;
}
bezierData.segmentLength = addedLength;
keyData.bezierData = bezierData;
storedData[bezierName] = bezierData;
return storedData[bezierName];
};
}());

Expand Down
7 changes: 4 additions & 3 deletions player/js/utils/shapes/ShapeProperty.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,11 +11,12 @@ var ShapePropertyFactory = (function(){
isHold = true;
iterationIndex = 0;
}else if(frameNum >= kf[kf.length - 1].t-this.offsetTime){
if(kf[kf.length - 2].h === 1){
keyPropS = kf[kf.length - 1].s ? kf[kf.length - 1].s[0] : kf[kf.length - 2].e[0];
/*if(kf[kf.length - 1].s){
keyPropS = kf[kf.length - 1].s[0];
}else{
keyPropS = kf[kf.length - 2].e[0];
}
}*/
isHold = true;
}else{
var i = iterationIndex;
Expand Down Expand Up @@ -49,7 +50,7 @@ var ShapePropertyFactory = (function(){
}
perc = fnc((frameNum-(keyData.t-this.offsetTime))/((nextKeyData.t-this.offsetTime)-(keyData.t-this.offsetTime)));
}
keyPropE = keyData.e[0];
keyPropE = nextKeyData.s ? nextKeyData.s[0] : keyData.e[0];
}
keyPropS = keyData.s[0];
}
Expand Down
48 changes: 21 additions & 27 deletions player/js/utils/text/TextAnimatorProperty.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -66,32 +66,26 @@ TextAnimatorProperty.prototype.getMeasures = function(documentData, lettersChang
segments: []
};
len = paths._length - 1;
var pathData;
var bezierData;
totalLength = 0;
for (i = 0; i < len; i += 1) {
pathData = {
s: paths.v[i],
e: paths.v[i + 1],
to: [paths.o[i][0] - paths.v[i][0], paths.o[i][1] - paths.v[i][1]],
ti: [paths.i[i + 1][0] - paths.v[i + 1][0], paths.i[i + 1][1] - paths.v[i + 1][1]]
};
bez.buildBezierData(pathData);
pathInfo.tLength += pathData.bezierData.segmentLength;
pathInfo.segments.push(pathData);
totalLength += pathData.bezierData.segmentLength;
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) {
pathData = {
s: paths.v[i],
e: paths.v[0],
to: [paths.o[i][0] - paths.v[i][0], paths.o[i][1] - paths.v[i][1]],
ti: [paths.i[0][0] - paths.v[0][0], paths.i[0][1] - paths.v[0][1]]
};
bez.buildBezierData(pathData);
pathInfo.tLength += pathData.bezierData.segmentLength;
pathInfo.segments.push(pathData);
totalLength += pathData.bezierData.segmentLength;
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;
}
Expand All @@ -108,20 +102,20 @@ TextAnimatorProperty.prototype.getMeasures = function(documentData, lettersChang
currentLength = -Math.abs(currentLength) % pathInfo.tLength;
}
segmentInd = segments.length - 1;
points = segments[segmentInd].bezierData.points;
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].bezierData.points;
points = segments[segmentInd].points;
pointInd = points.length - 1;
}
}

}
points = segments[segmentInd].bezierData.points;
points = segments[segmentInd].points;
prevPoint = points[pointInd - 1];
currentPoint = points[pointInd];
partialLength = currentPoint.partialLength;
Expand Down Expand Up @@ -209,7 +203,7 @@ TextAnimatorProperty.prototype.getMeasures = function(documentData, lettersChang
if(this._hasMaskedPath) {
segmentInd = initSegmentInd;
pointInd = initPointInd;
points = segments[segmentInd].bezierData.points;
points = segments[segmentInd].points;
prevPoint = points[pointInd - 1];
currentPoint = points[pointInd];
partialLength = currentPoint.partialLength;
Expand Down Expand Up @@ -280,13 +274,13 @@ TextAnimatorProperty.prototype.getMeasures = function(documentData, lettersChang
if (mask.v.c) {
pointInd = 0;
segmentInd = 0;
points = segments[segmentInd].bezierData.points;
points = segments[segmentInd].points;
} else {
segmentLength -= currentPoint.partialLength;
points = null;
}
} else {
points = segments[segmentInd].bezierData.points;
points = segments[segmentInd].points;
}
}
if (points) {
Expand Down

0 comments on commit 9727c9f

Please sign in to comment.