Animationen hinzugefügt

This commit is contained in:
silas
2018-09-21 17:09:02 +02:00
parent e83d0f8544
commit 2c3775308f
14 changed files with 630 additions and 664 deletions

View File

@@ -9,17 +9,55 @@ class DelayPromise extends Promise {
}
class ScaleHelper {
scaleTo(scale, fontElement, container, ignoreHeight, ignoreWidth, margin, fontWeight, addListener) {
async scaleTo(scale, fontElement, container, ignoreHeight, ignoreWidth, margin, fontWeight, animationDelay, addListener) {
addListener = Helper.nonNull(addListener, true);
animationDelay = Helper.nonNull(animationDelay, 0);
let newFontSize = await this._getNewFontSize(scale, fontElement, container, ignoreHeight, ignoreWidth, margin, fontWeight, animationDelay === 0);
if (animationDelay > 0) {
await new Promise(r => {
setTimeout(r, animationDelay);
fontElement.style.fontSize = newFontSize + "px";
});
}
let self = this;
let listener = function () {
let timeout = (typeof addListener === 'number')?addListener:255;
setTimeout(() => {
self.scaleTo(scale, fontElement, container, ignoreHeight, ignoreWidth, margin, fontWeight, animationDelay, false);
}, timeout);
};
if (addListener !== false) {
window.addEventListener("resize", listener);
}
return listener;
}
async scaleToFull(fontElement, container, ignoreHeight, ignoreWidth, margin, fontWeight, animDelay, addListener) {
return this.scaleTo(1, fontElement, container, ignoreHeight, ignoreWidth, margin, fontWeight, animDelay, addListener);
}
async _getNewFontSize(scale, fontElement, container, ignoreHeight, ignoreWidth, margin, fontWeight, setFontSize) {
margin = Helper.nonNull(margin, 10);
ignoreHeight = Helper.nonNull(ignoreHeight, false);
ignoreWidth = Helper.nonNull(ignoreWidth, false);
fontWeight = Helper.nonNull(fontWeight, fontElement.innerHTML.length);
addListener = Helper.nonNull(addListener, true);
setFontSize = Helper.nonNull(setFontSize, true);
let hasNoTransitionClass = container.classList.contains("no-transition");
container.classList.add("no-transition");
if (!hasNoTransitionClass) {
container.classList.add("no-transition");
}
// debugger;
let beforeFontSize = fontElement.style.fontSize;
let currentFontSize = 1;
let diff = 0;
let widthDiff = 0;
@@ -44,26 +82,20 @@ class ScaleHelper {
}
diff = newDiff;
} while ((widthDiff > (1 - scale) * containerWidth || ignoreWidth) && (heightDiff > (1 - scale) * containerHeight || ignoreHeight));
fontElement.style.fontSize = (currentFontSize - margin) + 'px';
console.log(setFontSize, currentFontSize, beforeFontSize, fontElement.style.fontSize, fontElement);
currentFontSize -= margin;
fontElement.style.fontSize = ((setFontSize) ? currentFontSize + "px" : beforeFontSize);
if (!hasNoTransitionClass) {
await new Promise((r) => {
setTimeout(r, 50);
});
container.classList.remove("no-transition");
}
let self = this;
let listener = function () {
setTimeout(() => {
self.scaleTo(scale, fontElement, container, ignoreHeight, ignoreWidth, margin, fontWeight, false);
}, 255);
};
if (addListener) {
window.addEventListener("resize", listener);
}
return listener;
}
scaleToFull(fontElement, container, ignoreHeight, ignoreWidth, margin, fontWeight) {
return this.scaleTo(1, fontElement, container, ignoreHeight, ignoreWidth, margin, fontWeight);
return currentFontSize;
}
}