Skip to content

Commit 1b1d1a6

Browse files
authored
npm maintenance and add whitespace rules to eslint config (#51)
* update and audit fix * add some eslint rules regarding whitespace
1 parent 101fc7c commit 1b1d1a6

9 files changed

Lines changed: 835 additions & 650 deletions

File tree

eslint.config.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,13 @@ export default tseslint.config(
2323
'warn',
2424
{ allowConstantExport: true },
2525
],
26+
'eol-last': [
27+
'error',
28+
'always',
29+
],
30+
'no-trailing-spaces': [
31+
'error',
32+
],
2633
},
2734
},
2835
)

package-lock.json

Lines changed: 765 additions & 587 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

src/AnimationControl.tsx

Lines changed: 18 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -71,9 +71,9 @@ interface AnimationControlProps {
7171
}
7272

7373
function AnimationControl({
74-
playAnimation,
75-
onPlayAnimationChange,
76-
onSkipBackward,
74+
playAnimation,
75+
onPlayAnimationChange,
76+
onSkipBackward,
7777
onSkipForward,
7878
onRestart,
7979
stepSize,
@@ -93,11 +93,11 @@ function AnimationControl({
9393
setShowGoals,
9494
showGoalVectors,
9595
setShowGoalVectors,
96-
}: AnimationControlProps) {
96+
}: AnimationControlProps) {
9797
const roundAndSetStepSize = (value: number) => {
9898
onStepSizeChange(Number(value.toFixed(1)));
9999
}
100-
100+
101101
const handleSliderChange = (event: Event, value: number | number[]) => {
102102
event.preventDefault();
103103
if (typeof value === 'number') roundAndSetStepSize(value);
@@ -143,16 +143,16 @@ function AnimationControl({
143143
return () => {
144144
window.removeEventListener('keydown', handleKeyDown);
145145
};
146-
}, [playAnimation, onPlayAnimationChange, loopAnimation, onFitView,
147-
onLoopAnimationChange, onRestart, onShowAgentIdChange, onSkipBackward,
148-
onSkipForward, onStepSizeChange, showAgentId, stepSize, onTracePathsChange, tracePaths,
149-
takeScreenshot, showCellId, setShowCellId, showGoals, setShowGoals, showGoalVectors,
146+
}, [playAnimation, onPlayAnimationChange, loopAnimation, onFitView,
147+
onLoopAnimationChange, onRestart, onShowAgentIdChange, onSkipBackward,
148+
onSkipForward, onStepSizeChange, showAgentId, stepSize, onTracePathsChange, tracePaths,
149+
takeScreenshot, showCellId, setShowCellId, showGoals, setShowGoals, showGoalVectors,
150150
setShowGoalVectors]);
151151

152152
return (
153153
<Stack direction="column" spacing={1}>
154154
<Stack direction="row" spacing={2} justifyContent="center">
155-
<Tooltip
155+
<Tooltip
156156
title={
157157
<div style={{ textAlign: 'center' }}>
158158
Adjust animation step size
@@ -182,12 +182,12 @@ function AnimationControl({
182182
<Tooltip title={`Backward one step (${STEP_BACKWARD_KEY})`}>
183183
<Button onClick={onSkipBackward}>
184184
<SkipPreviousIcon />
185-
</Button>
186-
</Tooltip>
187-
<Tooltip title={(playAnimation ? "Pause" : "Play") + ` (spacebar)`}>
185+
</Button>
186+
</Tooltip>
187+
<Tooltip title={(playAnimation ? "Pause" : "Play") + ` (spacebar)`}>
188188
<Button onClick={() => onPlayAnimationChange(!playAnimation)}>
189-
{playAnimation ?
190-
<PauseTwoToneIcon /> :
189+
{playAnimation ?
190+
<PauseTwoToneIcon /> :
191191
<PlayArrowIcon />}
192192
</Button>
193193
</Tooltip>
@@ -207,8 +207,8 @@ function AnimationControl({
207207
</Tooltip>
208208
<Tooltip title={(loopAnimation ? "Disable loop" : "Enable loop") + ` (${LOOP_KEY})`}>
209209
<Button onClick={() => onLoopAnimationChange(!loopAnimation)}>
210-
{loopAnimation ?
211-
<RepeatOnIcon /> :
210+
{loopAnimation ?
211+
<RepeatOnIcon /> :
212212
<RepeatIcon />}
213213
</Button>
214214
</Tooltip>
@@ -266,7 +266,7 @@ function AnimationControl({
266266
</ButtonGroup>
267267
</Box>
268268
</Stack>
269-
);
269+
);
270270
}
271271

272272
export default AnimationControl;

src/App.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,10 @@ import React, { useCallback } from 'react';
88
import { StrictMode, useRef } from 'react';
99

1010
function App() {
11-
const pixiAppRef = useRef<{
12-
skipBackward?: () => void;
13-
skipForward?: () => void;
14-
restart?: () => void;
11+
const pixiAppRef = useRef<{
12+
skipBackward?: () => void;
13+
skipForward?: () => void;
14+
restart?: () => void;
1515
fit?: () => void;
1616
takeScreenshot?: () => void;
1717
}>(null);
@@ -65,8 +65,8 @@ function App() {
6565
<Grid size="grow">
6666
<Visualizer
6767
pixiAppRef = {pixiAppRef}
68-
graph={graph}
69-
solution={solution}
68+
graph={graph}
69+
solution={solution}
7070
playAnimation={playAnimation}
7171
stepSize={stepSize}
7272
loopAnimation={loopAnimation}

src/ConfigBar.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ interface ConfigBarProps {
3939
function ConfigBar({
4040
graph,
4141
onGraphChange,
42-
onSolutionChange,
42+
onSolutionChange,
4343
playAnimation,
4444
onPlayAnimationChange,
4545
onSkipBackward,
@@ -208,7 +208,7 @@ function ConfigBar({
208208
{solutionError && <p style={{color: 'red'}}>{solutionError}</p>}
209209
</Stack>
210210
<Divider />
211-
<AnimationControl
211+
<AnimationControl
212212
playAnimation={playAnimation}
213213
onPlayAnimationChange={onPlayAnimationChange}
214214
onSkipBackward={onSkipBackward}
@@ -240,4 +240,4 @@ function ConfigBar({
240240
);
241241
}
242242

243-
export default ConfigBar;
243+
export default ConfigBar;

src/Graph.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,4 +45,4 @@ export class Graph {
4545
}
4646
}
4747
}
48-
}
48+
}

src/PixiApp.tsx

Lines changed: 24 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -25,11 +25,11 @@ interface PixiAppProps {
2525
showGoalVectors: boolean,
2626
}
2727

28-
const PixiApp = forwardRef(({
29-
width,
30-
height,
31-
graph,
32-
solution,
28+
const PixiApp = forwardRef(({
29+
width,
30+
height,
31+
graph,
32+
solution,
3333
playAnimation,
3434
stepSize,
3535
loopAnimation,
@@ -42,7 +42,7 @@ const PixiApp = forwardRef(({
4242
}: PixiAppProps, ref) => {
4343
// this is a mess of state and refs, but how I got everything to work...
4444
// maybe someday I will clean this up or maybe someone who knows React better than me can help
45-
//
45+
//
4646
// the variables that are used inside the animation callbacks must
4747
// be stored in refs because the callbacks are created "once" and
4848
// the variables are updated outside of the callbacks
@@ -51,7 +51,7 @@ const PixiApp = forwardRef(({
5151
const canvasRef = useRef<HTMLCanvasElement>(null);
5252
const [grid, setGrid] = useState<PIXI.Container | null>(null);
5353
const playAnimationRef = useRef(playAnimation);
54-
const timestepRef = useRef(0.0);
54+
const timestepRef = useRef(0.0);
5555
const stepSizeRef = useRef(1.0);
5656
const loopAnimationRef = useRef(loopAnimation);
5757
const hudRef = useRef<PIXI.Container | null>(null);
@@ -140,7 +140,7 @@ const PixiApp = forwardRef(({
140140
agent.x =
141141
startPose.position.x +
142142
(endPose.position.x - startPose.position.x) * interpolationProgress;
143-
agent.y =
143+
agent.y =
144144
startPose.position.y +
145145
(endPose.position.y - startPose.position.y) * interpolationProgress;
146146
agent.x = scalePosition(agent.x);
@@ -157,7 +157,7 @@ const PixiApp = forwardRef(({
157157
circleContainer.rotation =
158158
startRotation +
159159
(endRotation - startRotation) * interpolationProgress;
160-
});
160+
});
161161
}, [solution]);
162162

163163
const updatePaths = useCallback((agents: PIXI.Container[], currentTime: number) => {
@@ -166,11 +166,11 @@ const PixiApp = forwardRef(({
166166
const currentTimestep = Math.floor(currentTime);
167167
const interpolationProgress = currentTime - currentTimestep;
168168

169-
169+
170170
agents.forEach((_agent, index) => {
171-
const agentLineStyle = {
172-
width: GRID_UNIT_TO_PX / 10,
173-
color: AGENT_COLORS[index % AGENT_COLORS.length],
171+
const agentLineStyle = {
172+
width: GRID_UNIT_TO_PX / 10,
173+
color: AGENT_COLORS[index % AGENT_COLORS.length],
174174
cap: "round" as const
175175
};
176176

@@ -231,7 +231,7 @@ const PixiApp = forwardRef(({
231231
scalePosition(goal.position.y)
232232
)
233233
.stroke({
234-
color: AGENT_COLORS[index % AGENT_COLORS.length],
234+
color: AGENT_COLORS[index % AGENT_COLORS.length],
235235
width: Math.max(1, GRID_UNIT_TO_PX / 25),
236236
cap: "round" as const
237237
});
@@ -254,7 +254,7 @@ const PixiApp = forwardRef(({
254254
}
255255
if (solution === null) return;
256256
resetTimestep();
257-
257+
258258
// Check if the solution is orientation-aware
259259
const orientationAware: boolean = solution[0][0].orientation !== Orientation.NONE;
260260

@@ -316,7 +316,7 @@ const PixiApp = forwardRef(({
316316
idText.x = -idText.width / 2;
317317
idText.y = -idText.height / 2;
318318
});
319-
319+
320320
const animate = () => {
321321
if(timestepTextRef.current) {
322322
timestepTextRef.current.text = `${timestepRef.current.toFixed(1)} / ${(solution.length - 1).toFixed(1)}`;
@@ -345,10 +345,10 @@ const PixiApp = forwardRef(({
345345
const canvas = canvasRef.current;
346346
if (canvas) {
347347
const pixiApp = new PIXI.Application();
348-
pixiApp.init({
349-
width: width,
350-
height: height,
351-
canvas: canvas,
348+
pixiApp.init({
349+
width: width,
350+
height: height,
351+
canvas: canvas,
352352
background: BACKGROUND_COLOR,
353353
antialias: true, // for smooooooth circles
354354
}).then(() => {
@@ -377,7 +377,7 @@ const PixiApp = forwardRef(({
377377
fontFamily: "Arial",
378378
fontWeight: "bold",
379379
stroke: {
380-
color: BACKGROUND_COLOR,
380+
color: BACKGROUND_COLOR,
381381
width: 4
382382
},
383383
});
@@ -408,7 +408,7 @@ const PixiApp = forwardRef(({
408408
const drawGrid = useCallback(() => {
409409
if (viewport === null || graph === null) return null;
410410
const grid = viewport.addChild(new PIXI.Container());
411-
411+
412412
for (let x: number = 0; x < graph.width; x++) {
413413
for (let y: number = 0; y < graph.height; y++) {
414414
const cellContainer = grid.addChild(new PIXI.Container());
@@ -435,7 +435,7 @@ const PixiApp = forwardRef(({
435435
idText.y = cellY + strokeWidth;
436436
}
437437
}
438-
438+
439439
viewport.worldHeight = grid.height * 1.2;
440440
viewport.worldWidth = grid.width * 1.2;
441441
return grid;
@@ -502,4 +502,4 @@ const PixiApp = forwardRef(({
502502
return <canvas ref={canvasRef} />
503503
});
504504

505-
export default PixiApp;
505+
export default PixiApp;

src/Solution.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,4 +65,4 @@ export function parseSolution(text: string): Solution {
6565
solution.push(config);
6666
}
6767
return solution;
68-
}
68+
}

src/Visualizer.tsx

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -20,9 +20,9 @@ interface VisualizerProps {
2020
}
2121

2222
function Visualizer({
23-
graph,
24-
solution,
25-
playAnimation,
23+
graph,
24+
solution,
25+
playAnimation,
2626
pixiAppRef,
2727
stepSize,
2828
loopAnimation,
@@ -40,9 +40,9 @@ function Visualizer({
4040
useEffect(() => {
4141
const handleResize = () => {
4242
if (boxRef.current && canvasRef.current) {
43-
setViewportSize({
44-
width: boxRef.current.clientWidth,
45-
height: window.innerHeight - canvasRef.current.getBoundingClientRect().top
43+
setViewportSize({
44+
width: boxRef.current.clientWidth,
45+
height: window.innerHeight - canvasRef.current.getBoundingClientRect().top
4646
});
4747
}
4848
};
@@ -54,10 +54,10 @@ function Visualizer({
5454
return (
5555
<Box width="100%" height="100%" ref={boxRef}>
5656
<div ref={canvasRef}>
57-
{viewportSize !== null &&
58-
<PixiApp
57+
{viewportSize !== null &&
58+
<PixiApp
5959
ref={pixiAppRef}
60-
width={viewportSize.width}
60+
width={viewportSize.width}
6161
height={viewportSize.height}
6262
graph={graph}
6363
solution={solution}
@@ -77,4 +77,4 @@ function Visualizer({
7777
);
7878
}
7979

80-
export default Visualizer;
80+
export default Visualizer;

0 commit comments

Comments
 (0)