feat: 第一次上传代码
This commit is contained in:
461
node_modules/lottie-web/player/js/utils/text/TextProperty.js
generated
vendored
Normal file
461
node_modules/lottie-web/player/js/utils/text/TextProperty.js
generated
vendored
Normal file
@@ -0,0 +1,461 @@
|
||||
import {
|
||||
initialDefaultFrame,
|
||||
} from '../../main';
|
||||
import getFontProperties from '../getFontProperties';
|
||||
import FontManager from '../FontManager';
|
||||
|
||||
function TextProperty(elem, data) {
|
||||
this._frameId = initialDefaultFrame;
|
||||
this.pv = '';
|
||||
this.v = '';
|
||||
this.kf = false;
|
||||
this._isFirstFrame = true;
|
||||
this._mdf = false;
|
||||
if (data.d && data.d.sid) {
|
||||
data.d = elem.globalData.slotManager.getProp(data.d);
|
||||
}
|
||||
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) {
|
||||
// Checking if index changed to prevent creating a new object every time the expression updates.
|
||||
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;
|
||||
var shouldCombineNext = false;
|
||||
var currentChars = '';
|
||||
while (i < len) {
|
||||
shouldCombine = shouldCombineNext;
|
||||
shouldCombineNext = false;
|
||||
charCode = text.charCodeAt(i);
|
||||
currentChars = text.charAt(i);
|
||||
if (FontManager.isCombinedCharacter(charCode)) {
|
||||
shouldCombine = true;
|
||||
// It's a potential surrogate pair (this is the High surrogate)
|
||||
} else if (charCode >= 0xD800 && charCode <= 0xDBFF) {
|
||||
if (FontManager.isRegionalFlag(text, i)) {
|
||||
currentChars = text.substr(i, 14);
|
||||
} else {
|
||||
secondCharCode = text.charCodeAt(i + 1);
|
||||
// It's a surrogate pair (this is the Low surrogate)
|
||||
if (secondCharCode >= 0xDC00 && secondCharCode <= 0xDFFF) {
|
||||
if (FontManager.isModifier(charCode, secondCharCode)) {
|
||||
currentChars = text.substr(i, 2);
|
||||
shouldCombine = true;
|
||||
} else if (FontManager.isFlagEmoji(text.substr(i, 4))) {
|
||||
currentChars = text.substr(i, 4);
|
||||
} else {
|
||||
currentChars = text.substr(i, 2);
|
||||
}
|
||||
}
|
||||
}
|
||||
} else if (charCode > 0xDBFF) {
|
||||
secondCharCode = text.charCodeAt(i + 1);
|
||||
if (FontManager.isVariationSelector(charCode)) {
|
||||
shouldCombine = true;
|
||||
}
|
||||
} else if (FontManager.isZeroWidthJoiner(charCode)) {
|
||||
shouldCombine = true;
|
||||
shouldCombineNext = true;
|
||||
}
|
||||
if (shouldCombine) {
|
||||
charactersArray[charactersArray.length - 1] += currentChars;
|
||||
shouldCombine = false;
|
||||
} else {
|
||||
charactersArray.push(currentChars);
|
||||
}
|
||||
i += currentChars.length;
|
||||
}
|
||||
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 {
|
||||
// tCanvasHelper.font = documentData.s + 'px '+ fontData.fFamily;
|
||||
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');
|
||||
// finalText = finalText.substr(0,i) + "\r" + finalText.substr(i === lastSpaceIndex ? i + 1 : i);
|
||||
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 {
|
||||
// var charWidth = fontManager.measureText(val, documentData.f, documentData.finalSize);
|
||||
// tCanvasHelper.font = documentData.finalSize + 'px '+ fontManager.getFontByName(documentData.f).fFamily;
|
||||
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) { // eslint-disable-line eqeqeq
|
||||
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) { // eslint-disable-line eqeqeq
|
||||
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))) { // eslint-disable-line eqeqeq
|
||||
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]) { // eslint-disable-line eqeqeq
|
||||
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.setCurrentData(dData);
|
||||
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);
|
||||
};
|
||||
|
||||
export default TextProperty;
|
||||
Reference in New Issue
Block a user