Skip to content

Commit d7907a3

Browse files
alsonleejalsonleej
committed
visual garbage collector
1 parent 0bd3a5e commit d7907a3

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

49 files changed

+196
-135
lines changed

‎src/features/cseMachine/CseMachineAnimation.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -152,6 +152,7 @@ export class CseAnimation {
152152
) {
153153
return;
154154
}
155+
155156
if (isNode(lastControlItem)) {
156157
CseAnimation.handleNode(lastControlItem);
157158
} else if (isInstr(lastControlItem)) {

‎src/features/cseMachine/CseMachineUtils.ts‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -412,13 +412,13 @@ export function setUnhoveredStyle(target: Node | Group, unhoveredAttrs: any = {}
412412
node.setAttrs({
413413
stroke: node.attrs.stroke
414414
? node instanceof Text
415-
? defaultTextColor()
416-
: defaultStrokeColor()
415+
? reachedTextColor()
416+
: reachedStrokeColor()
417417
: node.attrs.stroke,
418418
fill: node.attrs.fill
419419
? node instanceof Text
420-
? defaultTextColor()
421-
: defaultStrokeColor()
420+
? reachedTextColor()
421+
: reachedStrokeColor()
422422
: node.attrs.fill,
423423
...unhoveredAttrs
424424
});
@@ -942,16 +942,16 @@ export const isStashItemInDanger = (stashIndex: number): boolean => {
942942
export const defaultBackgroundColor = () =>
943943
CseMachine.getPrintableMode() ? Config.PrintBgColor : Config.BgColor;
944944

945-
export const defaultTextColor = () =>
945+
export const reachedTextColor = () =>
946946
CseMachine.getPrintableMode() ? Config.PrintTextColor : Config.TextColor;
947947

948-
export const fadedTextColor = () =>
948+
export const defaultTextColor = () =>
949949
CseMachine.getPrintableMode() ? Config.PrintTextColorFaded : Config.TextColorFaded;
950950

951-
export const defaultStrokeColor = () =>
951+
export const reachedStrokeColor = () =>
952952
CseMachine.getPrintableMode() ? Config.PrintStrokeColor : Config.StrokeColor;
953953

954-
export const fadedStrokeColor = () =>
954+
export const defaultStrokeColor = () =>
955955
CseMachine.getPrintableMode() ? Config.PrintStrokeColorFaded : Config.StrokeColorFaded;
956956

957957
export const defaultActiveColor = () =>

‎src/features/cseMachine/animationComponents/ArrayAccessAnimation.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,9 @@ import { ControlStashConfig } from '../CseMachineControlStashConfig';
1010
import {
1111
defaultActiveColor,
1212
defaultDangerColor,
13-
defaultStrokeColor,
1413
getTextWidth,
15-
isStashItemInDanger
14+
isStashItemInDanger,
15+
reachedStrokeColor
1616
} from '../CseMachineUtils';
1717
import { Animatable } from './base/Animatable';
1818
import { AnimatedGenericArrow } from './base/AnimatedGenericArrow';
@@ -90,7 +90,7 @@ export class ArrayAccessAnimation extends Animatable {
9090
await Promise.all([
9191
this.arrayItemAnimation.animateTo({ opacity: 0 }, { duration: 0.6 }),
9292
this.arrayArrowAnimation.animateTo({ opacity: 0 }, { duration: 0.6 }),
93-
this.accessorAnimation.animateRectTo({ stroke: defaultStrokeColor() }, { duration: 1.2 }),
93+
this.accessorAnimation.animateRectTo({ stroke: reachedStrokeColor() }, { duration: 1.2 }),
9494
this.accessorAnimation.animateTo(
9595
{
9696
x: indexAboveArrayLocation.x - minInstrItemWidth,
@@ -99,7 +99,7 @@ export class ArrayAccessAnimation extends Animatable {
9999
},
100100
{ duration: 1.2 }
101101
),
102-
this.indexItemAnimation.animateRectTo({ stroke: defaultStrokeColor() }, { duration: 1.2 }),
102+
this.indexItemAnimation.animateRectTo({ stroke: reachedStrokeColor() }, { duration: 1.2 }),
103103
this.indexItemAnimation.animateTo(indexAboveArrayLocation, { duration: 1.2 })
104104
]);
105105
// Move arr acc instruction and result on top of array, and bring result up

‎src/features/cseMachine/animationComponents/ArrayAssignmentAnimation.tsx‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -12,8 +12,8 @@ import { ControlStashConfig } from '../CseMachineControlStashConfig';
1212
import {
1313
defaultActiveColor,
1414
defaultDangerColor,
15-
defaultStrokeColor,
16-
getTextWidth
15+
getTextWidth,
16+
reachedStrokeColor
1717
} from '../CseMachineUtils';
1818
import { Animatable } from './base/Animatable';
1919
import { AnimatedGenericArrow } from './base/AnimatedGenericArrow';
@@ -120,18 +120,18 @@ export class ArrayAssignmentAnimation extends Animatable {
120120
await Promise.all([
121121
this.arrayArrowAnimation.animateTo({ opacity: 0 }, { duration: 0.5 }),
122122
this.valueArrowAnimation?.animateTo({ opacity: 0 }, { duration: 0.5 }),
123-
this.asgnItemAnimation.animateRectTo({ stroke: defaultStrokeColor() }),
123+
this.asgnItemAnimation.animateRectTo({ stroke: reachedStrokeColor() }),
124124
this.asgnItemAnimation.animateTo({
125125
x: this.resultItem.x() - (this.resultItemIsFirst ? minAsgnItemWidth : 0),
126126
y: this.resultItem.y() + (this.resultItemIsFirst ? 0 : this.resultItem.height()),
127127
width: minAsgnItemWidth
128128
}),
129-
this.arrayItemAnimation.animateRectTo({ stroke: defaultStrokeColor() }),
129+
this.arrayItemAnimation.animateRectTo({ stroke: reachedStrokeColor() }),
130130
this.arrayItemAnimation.animateTo({ opacity: 0 }, fadeConfig),
131-
this.indexItemAnimation.animateRectTo({ stroke: defaultStrokeColor() }),
131+
this.indexItemAnimation.animateRectTo({ stroke: reachedStrokeColor() }),
132132
this.indexItemAnimation.animateTo({ x: this.resultItem.x() }),
133133
this.indexItemAnimation.animateTo({ opacity: 0 }, fadeConfig),
134-
this.resultAnimation.animateRectTo({ stroke: defaultStrokeColor() }),
134+
this.resultAnimation.animateRectTo({ stroke: reachedStrokeColor() }),
135135
this.resultAnimation.animateTo({ x: this.resultItem.x() }),
136136
this.resultArrowAnimation?.animateTo({ opacity: 1 }, { duration: 0.5, delay: 0.75 })
137137
]);

‎src/features/cseMachine/animationComponents/AssignmentAnimation.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import { defaultOptions, Text } from '../components/Text';
99
import { PrimitiveValue } from '../components/values/PrimitiveValue';
1010
import { Value } from '../components/values/Value';
1111
import { ControlStashConfig } from '../CseMachineControlStashConfig';
12-
import { defaultActiveColor, defaultStrokeColor, getTextWidth } from '../CseMachineUtils';
12+
import { defaultActiveColor, getTextWidth, reachedStrokeColor } from '../CseMachineUtils';
1313
import { Animatable } from './base/Animatable';
1414
import { AnimatedGenericArrow } from './base/AnimatedGenericArrow';
1515
import { AnimatedTextbox } from './base/AnimatedTextbox';
@@ -72,7 +72,7 @@ export class AssignmentAnimation extends Animatable {
7272
this.binding.arrow?.ref.current?.hide();
7373
// move asgn instruction next to stash item, while also decreasing its width
7474
await Promise.all([
75-
this.asgnItemAnimation.animateRectTo({ stroke: defaultStrokeColor() }),
75+
this.asgnItemAnimation.animateRectTo({ stroke: reachedStrokeColor() }),
7676
this.asgnItemAnimation.animateTo({
7777
x: this.stashItem.x() - (this.stashItemIsFirst ? minAsgnItemWidth : 0),
7878
y: this.stashItem.y() + (this.stashItemIsFirst ? 0 : this.stashItem.height()),

‎src/features/cseMachine/animationComponents/BinaryOperationAnimation.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,9 @@ import { ControlStashConfig } from '../CseMachineControlStashConfig';
77
import {
88
defaultActiveColor,
99
defaultDangerColor,
10-
defaultStrokeColor,
1110
getTextWidth,
12-
isStashItemInDanger
11+
isStashItemInDanger,
12+
reachedStrokeColor
1313
} from '../CseMachineUtils';
1414
import { Animatable } from './base/Animatable';
1515
import { AnimatedTextbox } from './base/AnimatedTextbox';
@@ -72,10 +72,10 @@ export class BinaryOperationAnimation extends Animatable {
7272
const fadeInDelay = 1 / 4;
7373
// Shifts the right operand to the right and move the operator in between the operands
7474
await Promise.all([
75-
this.binaryOperatorAnimation.animateRectTo({ stroke: defaultStrokeColor() }),
75+
this.binaryOperatorAnimation.animateRectTo({ stroke: reachedStrokeColor() }),
7676
this.binaryOperatorAnimation.animateTo({ ...rightOpPosition, width: minBinOpWidth }),
77-
this.leftOperandAnimation.animateRectTo({ stroke: defaultStrokeColor() }),
78-
this.rightOperandAnimation.animateRectTo({ stroke: defaultStrokeColor() }),
77+
this.leftOperandAnimation.animateRectTo({ stroke: reachedStrokeColor() }),
78+
this.rightOperandAnimation.animateRectTo({ stroke: reachedStrokeColor() }),
7979
this.rightOperandAnimation.animateTo({
8080
...rightOpPosition,
8181
x: rightOpPosition.x + minBinOpWidth

‎src/features/cseMachine/animationComponents/BranchAnimation.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { Group } from 'react-konva';
33

44
import { ControlItemComponent } from '../components/ControlItemComponent';
55
import { StashItemComponent } from '../components/StashItemComponent';
6-
import { defaultDangerColor, defaultStrokeColor } from '../CseMachineUtils';
6+
import { defaultDangerColor, reachedStrokeColor } from '../CseMachineUtils';
77
import { Animatable } from './base/Animatable';
88
import { AnimatedTextbox } from './base/AnimatedTextbox';
99
import { getNodePosition } from './base/AnimationUtils';
@@ -44,7 +44,7 @@ export class BranchAnimation extends Animatable {
4444
this.resultItems.forEach(i => i.ref.current?.hide());
4545
// Move boolean next to branch instruction
4646
await Promise.all([
47-
this.booleanItemAnimation.animateRectTo({ stroke: defaultStrokeColor() }),
47+
this.booleanItemAnimation.animateRectTo({ stroke: reachedStrokeColor() }),
4848
this.booleanItemAnimation.animateTo({
4949
x: this.branchItem.x() + this.branchItem.width(),
5050
y: this.branchItem.y()

‎src/features/cseMachine/animationComponents/ControlExpansionAnimation.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import React from 'react';
22
import { Group } from 'react-konva';
33

44
import { ControlItemComponent } from '../components/ControlItemComponent';
5-
import { defaultActiveColor, defaultStrokeColor } from '../CseMachineUtils';
5+
import { defaultActiveColor, reachedStrokeColor } from '../CseMachineUtils';
66
import { Animatable, AnimationConfig } from './base/Animatable';
77
import { AnimatedTextbox } from './base/AnimatedTextbox';
88
import { getNodePosition } from './base/AnimationUtils';
@@ -56,7 +56,7 @@ export class ControlExpansionAnimation extends Animatable {
5656
await Promise.all([
5757
// Fade out the previous item while also changing its height for a more fluid animation
5858
this.initialItemAnimation.animateRectTo(
59-
{ height: totalHeight, stroke: defaultStrokeColor() },
59+
{ height: totalHeight, stroke: reachedStrokeColor() },
6060
animationConfig
6161
),
6262
this.initialItemAnimation.animateTextTo({ y: textY }, animationConfig),

‎src/features/cseMachine/animationComponents/ControlToStashAnimation.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,8 @@ import { ControlStashConfig } from '../CseMachineControlStashConfig';
88
import {
99
defaultActiveColor,
1010
defaultDangerColor,
11-
defaultStrokeColor,
12-
isStashItemInDanger
11+
isStashItemInDanger,
12+
reachedStrokeColor
1313
} from '../CseMachineUtils';
1414
import { Animatable } from './base/Animatable';
1515
import { AnimatedGenericArrow } from './base/AnimatedGenericArrow';
@@ -76,7 +76,7 @@ export class ControlToStashAnimation extends Animatable {
7676
...stashPosition,
7777
stroke: isStashItemInDanger(this.stashItem.index)
7878
? defaultDangerColor()
79-
: defaultStrokeColor()
79+
: reachedStrokeColor()
8080
}),
8181
this.controlTextAnimation.animateTo(stashPosition),
8282
// If the text is different, also fade out the old text and fade in the new text

‎src/features/cseMachine/animationComponents/FrameCreationAnimation.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import { Value } from '../components/values/Value';
1212
import { CseAnimation } from '../CseMachineAnimation';
1313
import { Config } from '../CseMachineConfig';
1414
import { ControlStashConfig } from '../CseMachineControlStashConfig';
15-
import { defaultActiveColor, defaultStrokeColor, isEnvEqual } from '../CseMachineUtils';
15+
import { defaultActiveColor, isEnvEqual, reachedStrokeColor } from '../CseMachineUtils';
1616
import { Animatable, AnimationConfig } from './base/Animatable';
1717
import { AnimatedGenericArrow } from './base/AnimatedGenericArrow';
1818
import { AnimatedRectComponent, AnimatedTextComponent } from './base/AnimationComponents';
@@ -61,7 +61,7 @@ export class FrameCreationAnimation extends Animatable {
6161
});
6262
this.borderAnimation = new AnimatedRectComponent({
6363
...getNodePosition(origin),
64-
stroke: origin instanceof ControlItemComponent ? defaultActiveColor() : defaultStrokeColor(),
64+
stroke: origin instanceof ControlItemComponent ? defaultActiveColor() : reachedStrokeColor(),
6565
opacity: origin instanceof ControlItemComponent ? 1 : 0
6666
});
6767
if (frame.arrow) {

0 commit comments

Comments
 (0)