Skip to content

Commit d5e3027

Browse files
jdevdevdevjdevdevdev
committed
Split files
1 parent 7502997 commit d5e3027

File tree

7 files changed

+115
-130
lines changed

7 files changed

+115
-130
lines changed

‎src/app/waffle/cell.tsx‎ renamed to ‎src/app/waffle/Cell.tsx‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
11
import { PropsWithChildren } from "react";
22
import styles from "./page.module.css";
33

4-
export default function Cell({ swapped, children }: PropsWithChildren<{ swapped?: boolean }>) {
5-
4+
export const Cell = ({ swapped, children }: PropsWithChildren<{ swapped?: boolean }>) => {
65
return (
76
<div className={`${styles.cell} ${swapped ? styles.swapped : ''}`}>
87
{children}

‎src/app/waffle/RenderGrid.tsx‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
import { Cell } from "./Cell";
2+
import { RenderRow } from "./RenderRow"
3+
4+
type puzzleItem = {
5+
letter: string,
6+
index: number,
7+
swap: boolean,
8+
}
9+
10+
export const RenderGrid = ({ arr } : { arr : puzzleItem[]}) => {
11+
const result = [];
12+
let index = 0;
13+
const _arr = arr.length < 21 ? [...arr, ...Array(21 - arr.length).fill({ letter: '', index: 99, swap: false })] : arr.slice(0, 21);
14+
15+
while (index < _arr.length) {
16+
if (result.length % 2 === 0) {
17+
result.push(
18+
<RenderRow key={`row-${index}`}>
19+
{_arr.slice(index, index + 5)
20+
.map(
21+
(item: puzzleItem, index: number) =>
22+
<Cell key={`cell-${index}`} swapped={item.swap}>
23+
{item.letter}
24+
</Cell>
25+
)
26+
}
27+
</RenderRow>
28+
);
29+
index += 5;
30+
} else {
31+
result.push(
32+
<RenderRow key={`row-${index}`}>
33+
{_arr.slice(index, index + 3)
34+
.map(
35+
(item: puzzleItem, index: number) =>
36+
<Cell key={`cell-${index}`} swapped={item.swap}>
37+
{item.letter}
38+
</Cell>
39+
)
40+
}
41+
</RenderRow>
42+
);
43+
index += 3;
44+
}
45+
}
46+
return result;
47+
}

‎src/app/waffle/RenderRow.tsx‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import { PropsWithChildren } from 'react';
2+
import styles from "./page.module.css";
3+
4+
export const RenderRow = ({ children }: PropsWithChildren) => {
5+
return <div className={styles.boardRow}>{children}</div>;
6+
}

‎src/app/waffle/findMinCycle.ts‎

Lines changed: 26 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -13,9 +13,6 @@ export const findMinCycle = (source: string, target: string): number[][] => {
1313
const findCycle = (source: string, target: string): number[][] => {
1414
const puzzleLength = source.length;
1515
const indexMap: cycleIndexItem[] = [];
16-
const visited = new Array(puzzleLength).fill(false);
17-
let visitedTemp = new Array(puzzleLength).fill(false);
18-
const finalCycles: number[][] = [];
1916

2017
for (let i = 0; i < puzzleLength; i++) {
2118
if (source[i] !== target[i]) {
@@ -27,58 +24,18 @@ const findCycle = (source: string, target: string): number[][] => {
2724
});
2825
}
2926
}
30-
for (let k = 0; k < puzzleLength; k++) {
31-
const cycles: number[][] = [];
32-
for (let i = 0; i < puzzleLength; i++) {
33-
if (source[i] == target[i]) {
34-
continue
35-
}
36-
if (!visited[i]) {
37-
let j = i;
38-
const cycle: number[] = [];
39-
const key: Record<string, boolean> = {}
40-
while (!visitedTemp[j] && !key[source[j]]) {
41-
key[source[j]] = true;
42-
visitedTemp[j] = true;
43-
cycle.push(j);
44-
const next = indexMap.find(
45-
(element: cycleIndexItem): boolean => element.target == source[j] && !visited[element.index] && !visitedTemp[element.index]
46-
);
47-
const looped = indexMap.find(
48-
(element: cycleIndexItem): boolean => element.target == source[j] && !visited[element.index] && !!visitedTemp[element.index]
49-
);
50-
if (looped) {
51-
j = looped.index
52-
cycles[i] = [...cycle];
53-
} else if (next) {
54-
j = next.index;
55-
}
56-
}
57-
visitedTemp = new Array(puzzleLength).fill(false);
58-
}
59-
}
60-
let hold: number[] = [];
61-
cycles.forEach(c => {
62-
if (hold.length == 0 || c.length < hold.length) {
63-
hold = [...c];
64-
}
65-
})
66-
hold.forEach(visit => {
67-
visited[visit] = true;
68-
})
69-
if (hold.length) {
70-
finalCycles.push([...hold]);
71-
}
72-
}
73-
return finalCycles;
27+
28+
return generateCycles(
29+
source,
30+
target,
31+
indexMap,
32+
puzzleLength
33+
);
7434
}
7535

7636
const findCycleInverse = (source: string, target: string): number[][] => {
7737
const puzzleLength = source.length;
7838
const indexMap: cycleIndexItem[] = [];
79-
const visited = new Array(puzzleLength).fill(false);
80-
let visitedTemp = new Array(puzzleLength).fill(false);
81-
const finalCycles: number[][] = [];
8239

8340
for (let i = puzzleLength - 1; i >= 0; i--) {
8441
if (source[i] !== target[i]) {
@@ -90,6 +47,24 @@ const findCycleInverse = (source: string, target: string): number[][] => {
9047
});
9148
}
9249
}
50+
51+
return generateCycles(
52+
source,
53+
target,
54+
indexMap,
55+
puzzleLength
56+
);
57+
}
58+
59+
const generateCycles = (
60+
source: string,
61+
target: string,
62+
indexMap: {target: string, index: number, visited: boolean, source: string}[],
63+
puzzleLength: number
64+
): number[][] => {
65+
const visited = new Array(puzzleLength).fill(false);
66+
let visitedTemp = new Array(puzzleLength).fill(false);
67+
const finalCycles: number[][] = [];
9368
for (let k = 0; k < puzzleLength; k++) {
9469
const cycles: number[][] = [];
9570
for (let i = 0; i < puzzleLength; i++) {
@@ -134,4 +109,4 @@ const findCycleInverse = (source: string, target: string): number[][] => {
134109
}
135110
}
136111
return finalCycles;
137-
}
112+
}

‎src/app/waffle/objectEquals.ts‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
export const objectEquals = <T extends object>(obj1: T, obj2: T): boolean => {
2+
if (typeof obj1 !== 'object' || typeof obj2 !== 'object') return false;
3+
4+
const keys1 = Object.keys(obj1) as (keyof T)[];
5+
const keys2 = Object.keys(obj2) as (keyof T)[];
6+
7+
if (keys1.length !== keys2.length) return false;
8+
9+
for (const key of keys1) {
10+
const val1 = obj1[key];
11+
const val2 = obj2[key];
12+
13+
if (typeof val1 === 'object' && typeof val2 === 'object' && val1 !== null && val2 !== null) {
14+
if (!objectEquals(val1, val2)) return false;
15+
} else if (val1 !== val2) {
16+
return false;
17+
}
18+
}
19+
20+
return true;
21+
}

‎src/app/waffle/page.tsx‎

Lines changed: 5 additions & 77 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,10 @@
11
"use client"
22
import styles from "./page.module.css";
3-
import Cell from "./cell";
4-
import { useState, useMemo, useCallback, PropsWithChildren } from 'react';
3+
import { useState, useMemo, useCallback } from 'react';
54
import { findMinCycle } from "./findMinCycle";
5+
import { RenderGrid } from "./RenderGrid";
6+
import { objectEquals } from "./objectEquals";
7+
import { swap } from "./swap";
68

79
type puzzleItem = {
810
letter: string,
@@ -12,80 +14,6 @@ type puzzleItem = {
1214

1315
const gridCycleMapping = ["A1", "B1", "C1", "D1", "E1", "A2", "C2", "E2", "A3", "B3", "C3", "D3", "E3", "A4", "C4", "E4", "A5", "B5", "C5", "D5", "E5"]
1416

15-
const objectEquals = <T extends object>(obj1: T, obj2: T): boolean => {
16-
if (typeof obj1 !== 'object' || typeof obj2 !== 'object') return false;
17-
18-
const keys1 = Object.keys(obj1) as (keyof T)[];
19-
const keys2 = Object.keys(obj2) as (keyof T)[];
20-
21-
if (keys1.length !== keys2.length) return false;
22-
23-
for (const key of keys1) {
24-
const val1 = obj1[key];
25-
const val2 = obj2[key];
26-
27-
if (typeof val1 === 'object' && typeof val2 === 'object' && val1 !== null && val2 !== null) {
28-
if (!objectEquals(val1, val2)) return false;
29-
} else if (val1 !== val2) {
30-
return false;
31-
}
32-
}
33-
34-
return true;
35-
}
36-
const RenderRows = ({ children }: PropsWithChildren) => {
37-
return <div className={styles.boardRow}>{children}</div>;
38-
}
39-
40-
const splitArray = (arr: puzzleItem[]) => {
41-
const result = [];
42-
let index = 0;
43-
const _arr = arr.length < 21 ? [...arr, ...Array(21 - arr.length).fill({ letter: '', index: 99, swap: false })] : arr.slice(0, 21);
44-
45-
while (index < _arr.length) {
46-
if (result.length % 2 === 0) {
47-
result.push(
48-
<RenderRows key={`row-${index}`}>
49-
{_arr.slice(index, index + 5)
50-
.map(
51-
(item: puzzleItem, index: number) =>
52-
<Cell key={`cell-${index}`} swapped={item.swap}>
53-
{item.letter}
54-
</Cell>
55-
)
56-
}
57-
</RenderRows>
58-
);
59-
index += 5;
60-
} else {
61-
result.push(
62-
<RenderRows key={`row-${index}`}>
63-
{_arr.slice(index, index + 3)
64-
.map(
65-
(item: puzzleItem, index: number) =>
66-
<Cell key={`cell-${index}`} swapped={item.swap}>
67-
{item.letter}
68-
</Cell>
69-
)
70-
}
71-
</RenderRows>
72-
);
73-
index += 3;
74-
}
75-
}
76-
return result;
77-
}
78-
79-
const swap = (puzzleState: puzzleItem[], swapStep: number[]): puzzleItem[] => {
80-
const _puzzleState = [...puzzleState];
81-
const temp = _puzzleState[swapStep[0]];
82-
_puzzleState[swapStep[0]] = _puzzleState[swapStep[1]];
83-
_puzzleState[swapStep[1]] = temp;
84-
_puzzleState[swapStep[0]].swap = true;
85-
_puzzleState[swapStep[1]].swap = true;
86-
return _puzzleState;
87-
}
88-
8917
export default function Waffle() {
9018
const [puzzle, setPuzzle] = useState<string>('CACIPWTLMNSLERAILTUEE');
9119
const [solution, setSolution] = useState<string>('CLUMPRNIAISLEWECLATTE');
@@ -212,7 +140,7 @@ export default function Waffle() {
212140
</div>
213141

214142
<div className={styles.boardGrid}>
215-
{splitArray(puzzleState)}
143+
<RenderGrid arr={puzzleState}></RenderGrid>
216144
</div>
217145

218146
<div>

‎src/app/waffle/swap.ts‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
export const swap = <T extends {swap: boolean}>(puzzleState: T[], swapStep: number[]): T[] => {
2+
const _puzzleState : T[] = [...puzzleState];
3+
const temp = _puzzleState[swapStep[0]];
4+
_puzzleState[swapStep[0]] = _puzzleState[swapStep[1]];
5+
_puzzleState[swapStep[1]] = temp;
6+
_puzzleState[swapStep[0]].swap = true;
7+
_puzzleState[swapStep[1]].swap = true;
8+
return _puzzleState;
9+
}

0 commit comments

Comments
 (0)