Skip to content

Commit

Permalink
Add type to starter
Browse files Browse the repository at this point in the history
  • Loading branch information
irdkwmnsb committed Jun 19, 2023
1 parent 0a74376 commit 7e9df39
Show file tree
Hide file tree
Showing 4 changed files with 39 additions and 26 deletions.
8 changes: 4 additions & 4 deletions src/App.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { BubbleSortStarter } from "./visualizers/bubble-sort/start";
import { BubbleSortRender } from "./visualizers/bubble-sort/render";
import { Convolution2DStarter } from "./visualizers/convolution2d/start";
import { Convolution2DRender } from "./visualizers/convolution2d/render";
import { useVisualizer } from "./lib/hooks";
import { useEffect, useState } from "react";

Expand Down Expand Up @@ -48,8 +48,8 @@ const App = () => {
<button onClick={() => setEventOverride(0)}>Beginning</button>
<button onClick={() => setEventOverride(events.length - 1)}>End</button>
<small>Use arrow keys to navigate</small>
<BubbleSortStarter doStart={start}/>
<BubbleSortRender curState={curStateOverride} curEvent={curEventOverride}/>
<Convolution2DStarter doStart={start}/>
<Convolution2DRender curState={curStateOverride} curEvent={curEventOverride}/>
<div>
{events && events.map((x, i) => {
return <div key={i}>
Expand Down
2 changes: 1 addition & 1 deletion src/lib/hooks.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { useSyncExternalStore } from "react";
import { globalStore } from "../visualizers/bubble-sort";
import { globalStore } from "../visualizers/convolution2d";

export const useVisualizer = () => {
return useSyncExternalStore(globalStore.subscribe, globalStore.getCurSnapshot);
Expand Down
6 changes: 4 additions & 2 deletions src/visualizers/convolution2d/matrix.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,8 @@ export interface Matrix {
get: (row: number, column: number) => number;
}

export const enum PaddingType {
Reflect, Wrap, Edge, Zero
export enum PaddingType {
Reflect="reflect", Wrap="wrap", Edge="edge", Zero="zero"
}

export class ArrayMatrix implements Matrix {
Expand Down Expand Up @@ -75,6 +75,8 @@ const recalculateIndex = (
return edgeIndex(correctedIndex, length);
case PaddingType.Zero:
return 0;
default:
throw Error("Unknown type: " + paddingType)
}
}

Expand Down
49 changes: 30 additions & 19 deletions src/visualizers/convolution2d/start.tsx
Original file line number Diff line number Diff line change
@@ -1,30 +1,41 @@
import { useState } from "react"
import { Convolution2DArguments } from "./convolution2d"
import { PaddingType, ArrayMatrix } from "./matrix"

type Props = {
doStart: (args: Convolution2DArguments, noStop: boolean) => void
}

const args: Convolution2DArguments = [
new ArrayMatrix([
[5, 4, 3, 2, 1],
[4, 3, 2, 1, 0],
[3, 2, 1, 0, 1],
[2, 1, 0, 1, 2],
[1, 0, 1, 2, 3],
]),
new ArrayMatrix([
[0, 1, 0],
[1, 1, 1],
[0, 1, 0],
]),
2,
3,
PaddingType.Edge,
]

export const Convolution2DStarter = ({ doStart}: Props) => {
export const Convolution2DStarter = ({ doStart }: Props) => {
const options = Object.values(PaddingType);
const [selectedType, setSelectedType] = useState(PaddingType.Edge);
const args: Convolution2DArguments = [
new ArrayMatrix([
[5, 4, 3, 2, 1],
[4, 3, 2, 1, 0],
[3, 2, 1, 0, 1],
[2, 1, 0, 1, 2],
[1, 0, 1, 2, 3],
]),
new ArrayMatrix([
[0, 1, 0],
[1, 1, 1],
[0, 1, 0],
]),
2,
3,
selectedType,
]
console.log(args[4]);
return <div>
<select
value={selectedType}
onChange={(op) => setSelectedType(op.target.value as PaddingType)}
>
{options.map((op) => <option value={op} key={op}>
{op}
</option>)}
</select>
<button onClick={() => doStart(args, false)}>Start</button>
<button onClick={() => doStart(args, true)}>Run Full</button>
</div>;
Expand Down

0 comments on commit 7e9df39

Please sign in to comment.