OpenNeo/impress-2020
OpenNeo/impress-2020
1
0
Fork 0
Code Pull requests Activity

fix bug that broke fades on cache-grouped layers

Browse source
This commit is contained in:
Emi Matchu 2020-09-25 07:53:04 -07:00
parent 32c4e540a3
commit f543868924
1 changed files with 32 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

35
src/app/components/OutfitCanvas.js
View file

@ -44,6 +44,25 @@ function OutfitCanvas({
return () => window.createjs.Ticker.removeEventListener("tick", onTick);
}, [loading]);
// Cache any cache groups whose children aren't doing a fade-in/out tween,
// and uncache any whose children are. We call this when tweens start and
// stop.
const onTweenStateChange = React.useCallback(() => {
for (const childOrCacheGroup of stage.children) {
if (childOrCacheGroup.DTI_isCacheGroup) {
const cacheGroup = childOrCacheGroup;
const isTweening = cacheGroup.children.some((c) =>
window.createjs.Tween.hasActiveTweens(c)
);
if (isTweening) {
cacheGroup.uncache();
} else {
cacheGroup.cache(0, 0, internalWidth, internalHeight);
}
}
}
});
const reorganizeChildren = React.useCallback(() => {
// First, to simplify, let's clean out all of the main children, and any
// caching group containers they might be in. This will empty the stage.
@ -55,11 +74,12 @@ function OutfitCanvas({
const children = [];
for (const childOrCacheGroup of [...stage.children]) {
if (childOrCacheGroup.DTI_isCacheGroup) {
for (const child of [...childOrCacheGroup.children]) {
const cacheGroup = childOrCacheGroup;
for (const child of [...cacheGroup.children]) {
children.push(child);
childOrCacheGroup.removeChild(child);
cacheGroup.removeChild(child);
}
stage.removeChild(childOrCacheGroup);
stage.removeChild(cacheGroup);
} else {
const child = childOrCacheGroup;
children.push(child);
@ -187,6 +207,7 @@ function OutfitCanvas({
removeChild,
addResizeListener,
removeResizeListener,
onTweenStateChange,
stage, // Not used, but available for debugging.
}}
>
@ -209,6 +230,7 @@ export function OutfitCanvasImage({ src, zIndex }) {
canvasRef,
addChild,
removeChild,
onTweenStateChange,
addResizeListener,
removeResizeListener,
} = React.useContext(EaselContext);
@ -244,7 +266,9 @@ export function OutfitCanvasImage({ src, zIndex }) {
// doesn't work until the first draw.
bitmap.cache(0, 0, image.width, image.height);
tween.paused = false;
onTweenStateChange();
};
tween.on("complete", onTweenStateChange);
setBitmapSize();
addChild(bitmap, zIndex, { afterFirstDraw: startFadeIn });
@ -266,6 +290,7 @@ export function OutfitCanvasImage({ src, zIndex }) {
tween.setPosition(0);
tween.paused = false;
tween.on("complete", removeBitmap, null, true);
onTweenStateChange();
}
};
}, [
@ -286,6 +311,7 @@ export function OutfitCanvasMovie({ librarySrc, zIndex }) {
canvasRef,
addChild,
removeChild,
onTweenStateChange,
addResizeListener,
removeResizeListener,
} = React.useContext(EaselContext);
@ -374,7 +400,9 @@ export function OutfitCanvasMovie({ librarySrc, zIndex }) {
);
const startFadeIn = () => {
tween.paused = false;
onTweenStateChange();
};
tween.on("complete", onTweenStateChange);
// Get it actually running! We need to set framerate _after_ adding it
// to the stage, to overwrite the stage's defaults.
@ -400,6 +428,7 @@ export function OutfitCanvasMovie({ librarySrc, zIndex }) {
tween.setPosition(0);
tween.paused = false;
tween.on("complete", removeMovieClip, null, true);
onTweenStateChange();
}
};
}, [