Websites/interactives
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Changes

Browse source
This commit is contained in:
gpt-engineer-app[bot] 2025-12-01 07:05:04 +00:00
parent a87231ce46
commit 863f590d8c
1 changed files with 51 additions and 63 deletions
Download patch file Download diff file Expand all files Collapse all files

74
src/components/FerrersRogersRamanujan.tsx
View file

@ -12,6 +12,7 @@ const FerrersRogersRamanujan = () => {
const [rrPartition, setRRPartition] = useState<number[]>([]); const [rrPartition, setRRPartition] = useState<number[]>([]);
const [animatingHook, setAnimatingHook] = useState<{ row: number; col: number } | null>(null); const [animatingHook, setAnimatingHook] = useState<{ row: number; col: number } | null>(null);
const [animationStep, setAnimationStep] = useState(0); const [animationStep, setAnimationStep] = useState(0);
const [isAnimating, setIsAnimating] = useState(false);
useEffect(() => { useEffect(() => {
// Initialize sliders with all zeros // Initialize sliders with all zeros
@ -43,6 +44,7 @@ const FerrersRogersRamanujan = () => {
setRRPartition([]); setRRPartition([]);
setAnimatingHook(null); setAnimatingHook(null);
setAnimationStep(0); setAnimationStep(0);
setIsAnimating(false);
}; };
const generateRRPartition = () => { const generateRRPartition = () => {
@ -53,59 +55,52 @@ const FerrersRogersRamanujan = () => {
setRRPartition([]); setRRPartition([]);
setAnimationStep(0); setAnimationStep(0);
setIsAnimating(true);
// Start animation
animateHooks();
}; };
const animateHooks = () => { // Animation effect
const hooks: number[] = []; useEffect(() => {
if (!isAnimating || committedPartition.length === 0) return;
const partition = committedPartition; const partition = committedPartition;
// We need to traverse the L-shaped hooks // Find the hook at current animation step
// Start from position (0, 0) and go around the perimeter let found = false;
let step = 0; let hookCount = 0;
let targetRow = 0, targetCol = 0;
const maxRow = partition.length; const maxRow = partition.length;
const maxCol = partition[0] || 0; const maxCol = partition[0] || 0;
const processNextHook = () => { for (let d = 0; d < maxRow + maxCol && !found; d++) {
// Determine which hook to process
// We traverse diagonally: (0,0), (1,0), (0,1), (2,0), (1,1), (0,2), ...
let row = 0, col = 0;
let diag = 0;
let found = false;
// Find the step-th valid hook
let hookCount = 0;
for (let d = 0; d < maxRow + maxCol; d++) {
for (let r = 0; r <= d; r++) { for (let r = 0; r <= d; r++) {
const c = d - r; const c = d - r;
if (r < partition.length && c < partition[r]) { if (r < partition.length && c < partition[r]) {
if (hookCount === step) { if (hookCount === animationStep) {
row = r; targetRow = r;
col = c; targetCol = c;
found = true; found = true;
break; break;
} }
hookCount++; hookCount++;
} }
} }
if (found) break;
} }
if (!found) { if (!found) {
// Animation complete // Animation complete
setIsAnimating(false);
setAnimatingHook(null); setAnimatingHook(null);
return; return;
} }
setAnimatingHook({ row, col }); setAnimatingHook({ row: targetRow, col: targetCol });
// Calculate hook size: boxes to the right + boxes below + 1 (the box itself) // Calculate hook size
const boxesRight = partition[row] - col - 1; const boxesRight = partition[targetRow] - targetCol - 1;
let boxesBelow = 0; let boxesBelow = 0;
for (let r = row + 1; r < partition.length; r++) { for (let r = targetRow + 1; r < partition.length; r++) {
if (partition[r] > col) { if (partition[r] > targetCol) {
boxesBelow++; boxesBelow++;
} else { } else {
break; break;
@ -113,23 +108,16 @@ const FerrersRogersRamanujan = () => {
} }
const hookSize = boxesRight + boxesBelow + 1; const hookSize = boxesRight + boxesBelow + 1;
hooks.push(hookSize); // Update RR partition
setRRPartition([...hooks]); setRRPartition(prev => [...prev, hookSize]);
setTimeout(() => { // Schedule next step
setAnimationStep(step + 1); const timeout = setTimeout(() => {
}, 500); setAnimationStep(prev => prev + 1);
};
const interval = setInterval(() => {
processNextHook();
if (animatingHook === null && step > 0) {
clearInterval(interval);
}
}, 500); }, 500);
processNextHook(); return () => clearTimeout(timeout);
}; }, [isAnimating, animationStep, committedPartition]);
const renderFerrersDiagram = (partition: number[], highlightHook?: { row: number; col: number }) => { const renderFerrersDiagram = (partition: number[], highlightHook?: { row: number; col: number }) => {
if (partition.length === 0) return null; if (partition.length === 0) return null;
@ -247,10 +235,10 @@ const FerrersRogersRamanujan = () => {
<Button <Button
onClick={generateRRPartition} onClick={generateRRPartition}
disabled={rrPartition.length > 0} disabled={rrPartition.length > 0 || isAnimating}
className="w-full md:w-auto" className="w-full md:w-auto"
> >
Generate Rogers-Ramanujan Partition {isAnimating ? "Generating..." : "Generate Rogers-Ramanujan Partition"}
</Button> </Button>
{/* RR Partition Display */} {/* RR Partition Display */}